Rently

Development

• Clone the repo
• Install dependencies(npm recommended)
• Download runtime config via npm run appconfig
• Use one of the scripts from the list below

Scripts

Topic	Script
General development	serve
Development SSR build	build:all:dev
Production SSR build	build:all
Interact with SSR	firebase serve
Download runtime config	appconfig

SSR development notes

• The SSR part was initially generated using Angular CLI as described in official docs
• Since the project heavily depends on Firebase services(using AngularFire wrapper) we need to some fixes in regards building/packaging firebase sources:
  • [webpack.server.config.js] Point out modules resolution order in resolve.mainFields
  • [webpack.server.config.js] Modify externals - add /^firebase/ entry since Firebase has some troubles being bundled when in the Node environment
  • [webpack.server.config.js] Provide output.libraryTarget & output.library data because we want to run out SSR server in the Firebase function called ssr
  • Move firebase web config into functions remote config. You can download remote config using npm run appconfig
  • [src/app/core/core.module.ts] Replace generic AngularFireModule.initializeApp({ }) with manual initialization of FirebaseOptionsToken with value from environment
• server.ts file generated by Angular CLI was enhanced with logging and some fixes:
  • Add important pollyfils for firebase running in node
  • Rewrite Express.Request.originalUrl from to absolute to relative path. Original url initially comes as https://{firebase-project-id}/{page-route}. We need to get rid of the first part for Angular Router to correctly resolve path within the frontend app navigation
  • Instead of listening the SSR server it needs to be exported for cloud function to actually run it

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.