30 Days Of Ember

Table of Contents

• What are you learning
• Learning Resources
• Immerse Yourself in your learning
• Learning Plan

 

🤔 What are you learning?

Topic:
One sentence to describe this new skill.

Ember.js, an open-source JavaScript web framework, for creating ambitious web applications.

Learning Objectives:
List the core concepts or foundational skills needed to master this skill.

• Architectural Understanding
  • Model
  • View
  • Controller
• Routing
• The object model
• Services
• Components
• Templating
• Controllers
• Ember Data
• Addons and Dependencies
• Testing
• Configuration
• Binding
• Handlebars
  • Functional Helpers
  • Block helpers
• Nesting

Proficiency Metrics:
List task you'll be able to achieve after completed this 30 day learning journey.

• Reviewing routes with Ember Inspector
• Loading templates with routes
• Creating links with the link-to helper
• Adding component templates
• Loading model data
• Customizing components
• Building nested routes and route objects
• Loading data with object and array controllers
• Creating interfaces with CSS. Where to put my stylesheets?
• How to create conditionals?
• How to loop?
• What is the Convention-over-Configuration Approach?
• What are glimmer components?
• What is Ember Observer?
• What is the Ember CLI? Why do I need it?
• How to test?

Learning Resources:

Categorizing my learning resources based on my learning style usually helps me a ton.

👀 Visual Resources:

1. https://embermap.com
2. https://www.emberscreencasts.com
3. https://www.youtube.com/watch?v=zXbqv2PeYCM
4. Ember Octane - Great For Beginners by Ilya Radchenko
5. Reactivity Basics (Tracked Decorator) - EmberJS Octane by Ilya Radchenko
6. Ember Octane - Attributes aka "Splattributes" by Ilya Radchenko
7. EmberJS Octane - Handling Actions by Ilya Radchenko
8. EmberConf 2020 - Tuesday March 17th - Part 1
9. A preview of Ember.js Octane by Gavin Joyce

💻 15 Short Projects (Hands-on learner):

1. https://guides.emberjs.com/release/tutorial/
2. https://github.com/ember-learn/super-rentals
3. https://github.com/ember-learn/cli-guides
4. Ember Octane Fundamentals by Mike North
5. Ember.js tutorial for beginners by Shawn Chen
6. Ember.js Tutorial: Build a painting game in 20 mins by Gavin Joyce
7. Ember Octane Livestream: Build a drum machine by Gavin Joyce
8. Build An Ember.js App In 2019 For Beginners by Program with Erik
9. Building a complex web application with Ember.js Octane by Zoltan
10. Build a chat app using Ember JS by Christian Nwamba
11. Build and Authenticate an EmberJS 3 Application by Kapehe Jorgenson
12. Getting Started With Component Testing - EmberJS Octane by Ilya Radchenko
13. (1/2) Building a menu component with Tailwind CSS and Ember.js by Gavin Joyce
14. EmberConf 2019 - Building a UI Styleguide in Ember by Frédéric Soumaré

🗣 Auditory Resources:

1. https://embermap.com/podcast
2. https://changelog.com/jsparty
3. https://audio.ember.report/
4. https://podcasts.apple.com/us/podcast/javascript-jabber/id1237401284

📖 Reading Resources:

1. https://emberjs.com/
2. http://www.balinterdi.com/rock-and-roll-with-emberjs
3. https://www.emberweekly.com/
4. https://blog.emberjs.com/tag/newsletter/
5. https://www.apress.com/gp/book/9781484265604

📝 Teaching Opportunities (Verbal and Social Learner):

1. Writing blog post
2. Creating a TikTok or IG Reel series about Ember JS
3. YouTube or Twitch Content
4. Speaking at Ember Conference
5. At-work opportunities running Ember workshops

👋🏾 Open Source Projects to Contribute To (Hands-on learner):

1. https://github.com/ember-learn/ember-api-docs
2. https://github.com/emberjs/data
3. https://github.com/ember-learn/guides-source
4. https://github.com/ember-a11y/ember-a11y-testing
5. https://github.com/ember-weekend/ember-weekend
6. https://github.com/ember-template-lint/ember-template-lint
7. https://github.com/discourse/discourse
8. https://github.com/TryGhost/Ghost-Admin
9. https://github.com/TryGhost/Ghost
10. https://github.com/rust-lang/crates.io
11. https://github.com/storybookjs/storybook
12. https://github.com/cowbell/sharedrop

Immerse yourself in your learning:

#️⃣ Hashtags to follow:
Example: #javascript, #womenintech, #peopleintech, #blacksintech, #blackwomenintech, #codinglife, #frontend, #emberjs etc.

1. #emberJS
2. #100daysofcode
3. #womenintech
4. #peopleintech
5. #blacksintech
6. #blackwomenintech
7. #codinglife
8. #frontend
9. #BlackTechTwitter
10. #LatinXTechTwitter
11. #POCinTech
12. #NonBinaryInTech
13. #LGBTQinTech
14. #IndigenousTechnologists
15. #NativeTechTwitter
16. #NativesinTech
17. #javascript
18. #html
19. #programming
20. #coding
21. #css
22. #developer
23. #programmer
24. #webdeveloper
25. #code
26. #webdevelopment
27. #coder
28. #webdesign
29. #software
30. #softwaredeveloper
31. #codinglife
32. #computerscience
33. #technology
34. #js
35. #javascriptdeveloper
36. #softwareengineer
37. #programmers

👤 Social Media Accounts to follow:
Personally, I love following the creators of the coding language, folks who identify as core contributors and folks who talk about what I want to learn.

1. https://twitter.com/i/lists/199135857
2. Melanie Sumner
3. Leah Silber
4. Ava Wroten
5. Mike North
6. David Tang
7. Balint Erdi
8. Scott Newcomer
9. Jessica Jordan
10. NullVoxPopuli
11. Jen Weber
12. Dianne Eramo
13. Ryan LaBouve
14. Katie Gengler
15. Godfrey Chan
16. Dave Laird
17. Chris Manson
18. Kenneth Larsen
19. Ilya Radchenko
20. Chris Thoburn
21. Tom Dale
22. Yehuda Katz

👥 Indirect Mentors, Direct Mentors, Friends, and Communities:
Indirect Mentors are those informal mentors who may or may not know you; however, they provide encouragment or aide in some way. Direct mentors are those folks who you have a recurring meeting cadence, those who you have direct access to, and folks who you may spend time pairing programming with.

1. Ember Community Discord
2. StackOverflow
3. Dev Community
4. Ember Discuss

Learning Plan

 

📋 What’s the plan?
Pick one learning resources that'll cover a span of 30 days:

Balint Erdi's Rock and Roll with Ember Octane

 

🎯 Goal:
Code for a *minimum* of an hour a day
Mon - Fri: Tutorials & Learning

 

Time:
Pick a time where you learn best.
I learn best in the morning so 6am works for me!

Week 1: 83 pages

Chapters or Video	Pages or Time
1. Introduction to Ember.js	Page 1-15
2. Ember CLI	Page 16-24
3. Templates and Data Bindings	Page 25-33
4. Routing	Page 34-45
5. Nested Routes	Page 46-66
6. Components	Page 67-83

Week 2: 116 pages

Chapters or Video	Pages or Time
7. Controllers	Page 83-113
8. Building a catalog	Page 114-140
9. Talking to a back-end	Page 141-199

Week 3: 134 pages

Chapters or Video	Pages or Time
10. Advanced routing	Page 200-235
11. Testing	Page 236-284
12. Query Params	Page 285-334

Week 4: 57 pages

Chapters or Video	Pages or Time
13. Loading and Error Substates	Page 335-348
14. Helpers	Page 349-371
15. Deployment	Page 372-392