Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

ng4 webpack and yarn in JHipster

563 views

Published on

Angular 4 / webpack and yarn in JHipster

Published in: Technology
  • Be the first to comment

ng4 webpack and yarn in JHipster

  1. 1. Angular 4 / Webpack/ Yarn in JHipster Sendil Kumar N
  2. 2. Sendil Kumar N Developer | JHipster ngx lead @sendilkumarn https://sendilkumarn.js.org
  3. 3. About you Anyone using Typescript ? Anyone using Angular ? Have you used JHipster before ?
  4. 4. JHipster https://jhipster.github.io + =
  5. 5. Architecture Options
  6. 6. Monolithic Application
  7. 7. Microservices
  8. 8. Devops ( CI-CD )
  9. 9. Deployment Options
  10. 10. Code Time Lets create an application
  11. 11. Tools - JDL Studio
  12. 12. Code Time Lets spin up some entities...
  13. 13. NG1 Builders View Testers Client Side NGx
  14. 14. Server Side
  15. 15. Developed for developers by developers, to enrich developer experience...
  16. 16. Migrating from AngularJs to Angular 1.x 4.x
  17. 17. Angular
  18. 18. TypeScript Javascript that scales Typed superset of JS Compiles to pure JS Use latest syntax worry free
  19. 19. TypeScript
  20. 20. Controller to Component 1.x 4.x
  21. 21. Service Migration 1.x 4.x
  22. 22. Angular Router Based on Browser model Easier to do lazy loading More workarounds were needed.
  23. 23. Webpack
  24. 24. Why Webpack
  25. 25. Webpack - an overview Entry Output Plugins Loaders
  26. 26. Webpack Bundling Compiles & Bundles app into static assets Lot of plugins and options
  27. 27. Code Time Switch to demo mode...
  28. 28. Yar n
  29. 29. Yarn Time in seconds
  30. 30. Bootstrap
  31. 31. Sass
  32. 32. Browsersync
  33. 33. Karma
  34. 34. Testing Karma based testing In TypeScript Protractor testing
  35. 35. Few tricks Distance yourself from DOM Use AOT for super-minified JS Use lazy loading Browsersync for better development experience Careful about library migration
  36. 36. Code Time Switch to demo mode...
  37. 37. Whats Next ?
  38. 38. Questions?
  39. 39. Thank You

×