An Angular CLI, Angular Universal, Trails, and Proxy Engine Boiler Plate complete with NgPacks concept.
Do you need to use Angular 5+ with Server Side Rendering (SSR) and an advanced node.js framework? This is the boiler plate for you!
Looking for NgEngine?
- Angular 5 (+ Angular CLI)
- Server Side Rendering (Universal)
- Advanced Node.js Backend (Node.js)
- Advanced Angular Configuration (NgEngine + NgPacks)
- Angular Material
- Service Workers (PWA)
From our time spent working on Trails, we've really enjoyed some of the design patters, specifically Trailpacks. We're bringing that to Angular. With NgPacks you can register all of your modular components, reducers, actions, effects and more, even if they are lazy loaded without loosing performance. The other thing that we love about Trails is it's configuration concept. With NgEngine, you now have environment driven configuration for all your NgPacks.
For Trails documentation see the Trails Website. The only difference is that we are extending trails with Typescript and bundling it with webpack. You can configure Trails through src/apiConfig
.
For Angular documentation see the Angular Website. You can configure your NgEngine Angular app through src/appConfig
.
For NgEngine documentation and to learn how "packs" work, see the NgEngine Repo.
run npm run build && node dist/server.js
for the trails server to start. Navigate to http://localhost:3000/
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.
Run npm start
for a dev server that expects the API server at http://localhost:3000
.
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
.
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.
Alternatively run npm run build
. The build artifacts will be stored in the dist/
directory.
Run npm run serve:prod:ngsw
for a production build with Service Workers and PWA. To just build the service worker build, run npm run build:prod:ngsw
and then start it with node dist/server
Run npm run build:prod
for a production build. The build artifacts will be stored in the dist/
directory. To start the server run node dist/server
.
Run npm test
to execute the unit test, end to end tests, and mocha spec test for node.js.
Run ng test
or npm run test:ng
to execute the unit tests via Karma. To continuously run unit tests, run npm run test:ng:watch
Run ng e2e
or npm run test:e2e
to execute the end-to-end tests via Protractor.
First you will need to create a Heroku app. The package.json includes a "heroku-postbuild" script that will build the app. The Procfile includes the location to start the node server which will serve the app on Heroku.
The Trails REPL (trailpack-repl) includes some characters that production webpack builds (webpack -p
) can not parse and fails during the uglify process. Currently, we use the normal webpack build which is faster but has a larger slug. If you can fix this, we would love a PR!
To get more help on the Angular CLI use ng help
or go check out the Angular CLI README.