The Tale of 2 CLIs - Ember-cli and Angular-cli
2 likes769 views
The document discusses the importance of command-line interface (CLI) tools, specifically ember-cli and angular-cli, in web development. It highlights their ability to streamline project setup, adhere to community conventions, and enhance productivity through features like add-ons and automated testing. Additionally, the talk includes personal anecdotes and resources for further learning and application development.
The Tale of 2 CLIs - Ember-cli and Angular-cli
- 1. made with keynote Good Evening! @ladyleet
- 2. made with keynote How many of you use a cli tool? @ladyleet
- 3. @ladyleet “2016 will be the year of the CLI” - @rob_dodson, google developer advocate polymer
- 4. @ladyleet My search for cli tools this weekend
- 5. made with keynoteCLIs make web development accessible to everyone. @ladyleet
- 7. made with keynote Today we’re going to talk about my two favorite clis! ember-cli and angular-cli @ladyleet
- 8. Entrepreneur sold my startup Dishcrawl Junior Developer Playing with frameworks & JS Traveling Entrepreneur New company, #digitalnomad Who Knows? LYFE. #YOLO @ladyleet Bit About My Life
- 9. made with keynote I would not be doing development if it weren’t for ember-cli @ladyleet
- 10. made with keynote ember-cli was able to help me build apps immediately. @ladyleet
- 14. made with keynote angular-cli was the same story. @ladyleet
- 17. made with keynote • Why these tools are important • Development environment • Setting up a project • Community • Ember add-ons • Success stories • Creating and deploying an application • Live code up some apps! What we’re going to talk about! @ladyleet
- 18. @ladyleet
- 19. made with keynote Architect application Conventions of application Live reload / dev server Compiler for ES6 Testing Staging Production @ladyleet Setting up your dev environment
- 20. made with keynote Architect application Conventions of application Live reload / dev server Compiler for ES6 Testing Staging Production @ladyleet Setting up your dev environment
- 21. made with keynote Architect application Conventions of application Compiler for ES6 Live reload / dev server Testing Staging Production @ladyleet Ember-cli & Angular-cli do it for you App structure same for every app Follows community conventions BabelJS / TypeScript Out of the box! Creates tests for you! Out of the box! Out of the box!
- 22. made with keynote A short list of the awesome (there’s more) @ladyleet Tree shaking Route generation Component generation Model generation Tests (unit, acceptance, e2e) Sass/less support Add-ons Package.json Bower.json * these are in some or one of ember-cli or angular-cli
- 23. made with keynote The Ember Community Because of conventions and standards, a wealth of knowledge has emerged. @ladyleet
- 24. @ladyleet
- 25. made with keynote $ ember install <ember-addon> Ember-cli allows you to install add-ons into your application and directly imports other build systems without configuration. The benefit of conventions. @ladyleet
- 26. made with keynote Add-on Success Stories @ladyleet ember-data - data layer for your Ember apps ember-cli-deploy - deployment pipeline ember-cli-mirage - client-side HTTP server to develop, test and demo your Ember app
- 27. made with keynote My favorite add-on success story @ladyleet angular-cli! without ember-cli, angular-cli would not exist.
- 28. made with keynote What about Angular 2 add-ons? Coming soon. @ladyleet
- 29. made with keynote Let’s build an app! @ladyleet
- 30. made with keynote $ npm install ember-cli $ ember new <app-name> @ladyleet $ npm install angular-cli $ ng new <app-name> Installing the cli and creating a new app
- 31. made with keynote Let’s get into some code! @ladyleet
- 32. made with keynote • Why these tools are important • Development environment • Setting up a project • Community • Ember add-ons • Success stories • Creating and deploying an application • Live code up some apps! What we went over today! @ladyleet
- 34. @ladyleet Resources Github starter repo: https://github.com/ladyleet/yolobrolo-ember-demo App on Heroku: http://yolobrolo-ember-1.herokuapp.com/ Setting up a basic Ember.js app: https://medium.com/@ladyleet/setting-up-a-basic- ember-js-app-c9323760c675#.df609as7e Video: https://www.youtube.com/watch?v=-Ury2S9Y-4Q Tracy Lee @ladyleet github.com/ladyleet modern-web.org medium.com/@ladyleet
- 35. made with keynote Thank you! @ladyleet