Demo project for "Angular architecture patterns" blog series http://netmedia.io/blog/angular-architecture-patterns-additional-application-features_5670
TypeScript CSS HTML JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
config project setup May 29, 2017
e2e project setup May 29, 2017
hooks project setup May 29, 2017
i18n project setup May 29, 2017
src project setup May 29, 2017
.angular-cli.json project setup May 29, 2017
.editorconfig project setup May 29, 2017
.gitignore project setup May 29, 2017
LICENSE.md License update May 29, 2017
README.md project setup May 29, 2017
favicon.ico project setup May 29, 2017
index.html project setup May 29, 2017
karma.conf.js project setup May 29, 2017
package.json project setup May 29, 2017
protractor.conf.js project setup May 29, 2017
proxy.conf.json project setup May 29, 2017
sw-precache-config.js project setup May 29, 2017
tsconfig.json project setup May 29, 2017
tslint.json project setup May 29, 2017

README.md

Angular architecture patterns

This application represents a demo project for Angular architecture patterns blog series at http://netmedia.io. Frontend app is generated with Angular CLI. It uses it's own local dev server on http://localhost:4200/.

Installation

git clone https://github.com/anteburazer/angular-architecture-patterns.git
cd angular-architecture-patterns
npm install
npm run start

Run Development

Run npm run start for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files. The command will run custom hooks which will set environment to development and merge all i18n files needed for multi language support. The application uses proxy file to connect with the API. Proxy settings are defined in proxy.conf.json

Build for production

Run npm run sy-build to build the application for production which includes tree shaking, AOT and other cool stuff for minification. This command is defined in package.json file under the scripts section and includes regular Angular CLI build command, custom made hooks and generation of service worker file.

When application is built for production it's copied in /dist folder which is the public folder for Angular CLI.

Hooks

Hooks are located in /hooks folder and they are responsible for merging and copying configuration and localization files for development and production.

Note

Copying files is not necessary on angular-cli v1.0.4 and above because it has built in login for this action. You just need to specify which files/folders need to be copied into your destination folder (default dist) and you can do that in .angular-cli.json file by specifing the assets array:

"assets": [
  "assets",
  "favicon.ico",
  "service-worker.js",
  { "glob": "**/*", "input": "../config", "output": "./config/" },
  { "glob": "en.json", "input": "../i18n", "output": "./i18n/" },
  { "glob": "hr.json", "input": "../i18n", "output": "./i18n/" }
]