Thanks to visit codestin.com
Credit goes to github.com

Skip to content

vigneshwar1990/angular6-example-app

 
 

Example app with Angular 6 + Angular CLI + Angular Material + Docker + Angular Example Library

Base project made with much ❤️ . Contains CRUD, patterns, custom library, etc.

travis Coverage Status Codacy Badge Known Vulnerabilities Conventional Commits

dependency Status devDependency Status peerDependencies Status

npm Join the chat at https://gitter.im/angular6-example-app/Lobby

GitHub forks GitHub stars

angular-example-app

Getting started

Warning

Verify that you are running at least node 8.9.x and npm 5.x.x by running node -v and npm -v in a terminal/console window. Older versions produce errors, but newer versions are fine.

  1. Go to project folder and install dependencies:
npm install
  1. Launch development server:
npm start

Usage

Tasks Description
npm i Install everything needed
npm start Start the app in development mode
npm run test Run unit tests with karma and jasmine
npm run e2e Run end to end tests
npm run build Build the app for production
npm run lint Run the linter (tslint)
npm run ci Execute linter and tests
npm run deploy Build the app and deploy dist folder to Github pages (angular-cli-ghpages) (fork to do this and remove CNAME file)
npm run sme Build and run source map explorer, really cool :)
npm run release Create a new release using standard-version
npm run docker Build the docker image and run the container

Features

  • CRUD: create, update and remove heroes
  • Search bar, to look for heroes
  • Custom loading page
  • Angular Pipes
  • Interceptors and Events (Progress bar active, if a request is pending)
  • Modal and toasts (snakbar)!
  • Responsive layout (flex layout module)
  • SASS (most common used functions and mixins) and BEM styles
  • Internationalization
  • Lazy loading modules
  • Service Workers
  • Dynamic Imports
  • Custom example library
  • Modernizr (browser features detection)
  • Google Tag Manager
  • Github pages deploy ready
  • Unit tests with Jasmine and Karma including code coverage
  • End-to-end tests with Protractor
  • ES6 Promises and Observables
  • Following the best practices!

Docker

You can build the image and run the container with Docker. The configuration is in the nginx folder if you want to change it.

docker build -t angularexampleapp .

docker run -d -p 4200:80 angularexampleapp

Do you want to create your own library with Angular?

This project is using an example library in angular, which you can check it here.

This library contains a sample module, component, pipe, directive, all with tests, AOT compilation and an Angular-CLI playground too.

You can see how to use it, or develop a new one in the repository. Any doubts, please submit an issue or make a pull request.

Travis CI

We use Travis CI to run this tasks in order:

  • Linter
  • Tests
  • Build for production
  • Deploy in Github pages

Contributing

  • Please see the CONTRIBUTING file for guidelines.
  • Create pull requests, submit bugs, suggest new features or documentation updates 🔧

Server

This repo is using a minimal app in NodeJS deployed on Heroku and using PostGreSQL, to create, modify and delete heroes.

Contributors

Thanks to all contributors and their support!

License

MIT

I'm always happy to hear your feedback!

Enjoy 🤘

About

Angular 6 Example App + Angular CLI + Angular Material + Docker + Angular Example Library

Resources

License

Code of conduct

Contributing

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 67.7%
  • HTML 15.6%
  • CSS 13.4%
  • JavaScript 3.3%