Skip to content

Instantly share code, notes, and snippets.

@InsaneNaman

InsaneNaman/gsoc2017.md

Last active August 28, 2017 22:19
Show Gist options
  • Save InsaneNaman/0afc3810be187491efdea2039769aaf6 to your computer and use it in GitHub Desktop.
Save InsaneNaman/0afc3810be187491efdea2039769aaf6 to your computer and use it in GitHub Desktop.
Download ZIP
This gist is about My (@InsaneNaman) gsoc project for final evaluation.
Raw
gsoc2017.md

Commit History - (https://github.com/RocketChat/Rocket.Chat.PWA/commits/gsoc?author=InsaneNaman)

Git Repo Link- (https://github.com/RocketChat/Rocket.Chat.PWA/tree/gsoc)

Note: This branch(Above Git Repo Link) is specific to GSoC'17 and was started from scratch. So, every work done in the gsoc branch can be considered for evaluation.

All about Hack:

Before I Got Selected:

  • (#12) - Closed
    About : In this, i updated readme (docs) for getting started, added the procedure to test and also deployed a demo on firebase.
    Reason : Previously, App was built on the top of Polymer but we were about to drop polymer and adapt Angular for GSoC Project,
  • (#13) - Closed
    About : In this, i upgraded codebase to Polymer 2.0 from Polymer 1.0.
    Reason : Same as reason as of #12

Project Proposal - (https://goo.gl/HpCa1M)

After I Got Selected:

  • (#16) - Closed
    About : In this, i initialised the project using angular-cli and added basic components.
    Reason : The tree structure of containing folder wasn't right, so this PR was closed and another patched PR was made (#17)
  • (#17) - Merged
    About : This PR, was a patched version of (#16)
  • (#19) - Merged
    About : In this, i added more basic config files and components.
  • (#21) - Closed
    About : This PR, holds almost all the work done.
    Reason : The PR got messed up a lot because of a lot of commits. So, i added new clean PR(#29) was made after this.
  • (#29) - Merged
    About : This PR, was a cleaner version of PR- (#21) with 1-2 more commits. This PR can be referenced to see the main codebase.

Issues

  • (#22)- To track the milestone in the intial stages only.

About PWA

As mentioned at Google Developers Site (here) PWA bears these following features:

Progressive Web Apps are user experiences that have the reach of the web, and are:

  • Reliable - Load instantly and never show the downasaur, even in uncertain network conditions.
  • Fast - Respond quickly to user interactions with silky smooth animations and no janky scrolling.
  • Engaging - Feel like a natural app on the device, with an immersive user experience.

This new level of quality allows Progressive Web Apps to earn a place on the user's home screen.

About this project

Live Demo- (Click Here)

Technology/Framework/Library Used:

  • Angular 4

Angular 4

  • RxJs

RxJs

  • sw-precache & sw-toolbox (sw = Service Worker)

  • Other Basic APIs like Websocket etc.

For Developers(Contribution Guide)

Steps for getting started:

1- Install/Update your CLI

  • Install npm install -g @angular/cli

OR

npm uninstall -g angular-cli
npm cache clean
npm install -g @angular/cli@latest

2- Clone this Repo

https://github.com/RocketChat/Rocket.Chat.PWA.git

3- Install Node Dependencies

npm install

4- Run

ng serve

Production Build

ng build --prod -aot
npm run precache                                  // for generating sw.js file in dist folder
ng serve --prod

Note: You may see an error regarding service worker. This is because service worker works over HTTPS, so in order to make it work correctly. You need to deploy it on some cloud like Firebase.

Mentors:

1- Karl Prieb - Github

2- Guilherme Gazzo - Github

GSoC Student:

3- Naman Gupta - Github

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment