Learn Angular, Angular Material, RxJS fundementals with LocalCast Weather using the Kanban method.
View live demo: https://localcast-weather.duluca.now.sh/
LocalCast Weather has been developed in support of my book Angular for Enterprise-Ready Web Applications. You can get the book at any major bookstore or find the links at http://AngularForEnterprise.com.
Watch the talk on Architecture for Scalable Angular Apps on Pluralsight.
Check out the slides for Architecture for Scalable Angular Apps free at Slides.com.
Check out LemonMart, an Angular Grocery Store LOB App implemented with a Router-first architecture with common recipes and patterns at https://github.com/duluca/lemon-mart. You can also use LemonMart as a template project to start your own app.
Build, debug and publish Docker images with npm Scripts for Docker and achieve Blue-Green deployments on AWS Fargate with npm Scripts for AWS.
npm run build:prodto build a production optimized version of the app.npm run docker:debugto run tests and build a containerized version of the app.
This app was developed to demonstrate Angular fundementals, unit testing, and different techniques for building Angular apps using reactive patterns. The app is a good blueprint if you intend to build largely a single screen app experience. Questions? Consider creating an issue on this repo and buying my book at http://AngularForEnterprise.com.
- Do NOT install
@angular/cliortypescriptglobally to avoid version mismatch issues across multiple projects.- Note: When creating new projects in the future, execute
npx @angular/cli new app-name --routingto create a new Angular app with basic routing wired. - If you have trouble with this command, try
npx -p @angular/cli new app-name --routing
- Note: When creating new projects in the future, execute
- To run
ngcommands from within the project directory, preprendnpxto commands, likenpx ng build. - To continue using
ngwithout having to prependnpx, configure shell autofallback as described here: https://www.npmjs.com/package/npx#shell-auto-fallback.
- Fork and clone this repo.
- Rename the repo on GitHub to match the name of your project.
- Search and replace references to
lemon-martwith your project name and git repo. - Remove
manager,pos, andinventoryfolders and references to them fromapp-routing.module.ts. - You may modify
profile.component.tsandview-user.component.tsunder theuserfolder to fit your needs. - Edit
lemonmart-theme.scssto match your desired color scheme. - Now you may begin implementing your own feature modules.
- Questions? Consider creating an issue on this repo and buying my book at http://AngularForEnterprise.com.
- Run
npm startfor a developmenet web server. - Navigate to
http://localhost:5000/. The app will automatically reload if you change any of the source files.- Note that the port is different than the default Angular port of
4200intentionally, so you can run test projects or proof of concepts side-by-side without the hassle of specifiying a new port.
- Note that the port is different than the default Angular port of
- Run
npm testto execute the unit tests via Karma. - Run
npm run e2eto execute the end-to-end tests via Protractor.
- Run
ng generate component component-nameto generate a new component. You can also useng generate directive|pipe|service|class|guard|interface|enum|module.
To get more help on the Angular CLI use
ng helpor go check out the Angular CLI README.
See the example project here https://github.com/duluca/lemon-mart-server
Sadly Waffle.io no longer exists. I recommend using GitHub Projects as a free replacement.
Unfortunately Zeit Now no longer allows publication of arbitrary Dockerfile images. Using Zeit v2 you can publish the output of your dist folder and still be able to host your application for free.
A replacement for publishing arbitrary Docker images would be a new service called Google Cloud Run. A sample command would look like gcloud beta run deploy --image localcast-weather.