Angela's roadmap

Get Started. It's Free
or sign up with your email address
Angela's roadmap by Mind Map: Angela's roadmap

1. conditionals

2. SASS

2.1. Mixins

2.2. Variables

2.3. Nesting

2.4. "&"

2.5. "#{$variable}" - SASS interpolation

2.6. Fluid props

3. Vue.JS

3.1. Vuex

3.2. Vue router

3.3. Single File Components

4. JS

4.1. Promises

4.1.1. Promises tutorial Async JS Crash Course - Callbacks, Promises, Async Await

4.2. Ternary operator

4.3. RegExp

4.4. NPM / Yarn

4.4.1. Yarn tutorial - Yarn Package Manager Crash Course

4.5. Node

4.6. AJAX

4.6.1. Axios

4.6.2. Try - Catch

4.6.3. JSON

4.6.4. AJAX Crash Course (Vanilla JavaScript)

4.7. ES6

4.7.1. Arrow functions

4.7.1.1. preserving scope

4.7.2. Rest / Spread

4.7.3. Object / Array destructuring

4.7.4. Let, var, const

4.7.5. map

4.7.6. filter

4.7.7. forReach

4.7.8. reduce

4.7.9. classes

4.8. Scope

4.8.1. ES2015+ cheatsheet

4.8.2. Understanding Variable Scope & Closures Without Losing your Mind

4.9. Navigating DOM

4.9.1. QuerySelector

4.9.2. getElementsById

4.10. The Modern Javascript Tutorial

4.11. https://devhints.io/es6

4.12. VanillaJS

4.12.1. https://www.youtube.com/watch?v=VuN8qwZoego&list=PLu8EoSxDXHP6CGK4YVJhL_VWetA865GOH

4.13. throttle

4.14. debounce

4.15. prototypes and prototypal inheritance

4.16. Immutability

4.16.1. https://itnext.io/why-concept-of-immutability-is-so-damn-important-for-a-beginner-front-end-developer-8da85b565c8e

5. Twig

5.1. loops

5.2. conditionals

6. Emmet

6.1. CSS

6.2. HTML

6.3. Emmet For Faster HTML & CSS Workflow

7. Handlebars

7.1. loops

8. Git

8.1. Tower

8.2. git clone

8.3. git push

8.4. git fetch

8.5. git pull

8.6. git add -p

8.7. git status

8.8. git stash

8.9. git commit -m ""

8.10. Git & GitHub Crash Course For Beginners

9. Bash

9.1. mkdir

9.2. touch

9.3. cd

9.4. rm

9.5. Learn the Command Line | Codecademy

10. PHP

11. Fractal

11.1. Add a component

11.1.1. Config

11.1.2. Template

11.1.3. JS

11.1.3.1. register components in index.js

11.1.4. Baseview

11.1.5. yo fractal-component

11.2. Component development checklist

11.2.1. Fractal component development process

12. HTTP

12.1. Types of requests

12.1.1. GET

12.1.2. POST

12.1.3. PUT

12.1.4. DELETE

13. CSS

13.1. Selectors

13.2. Specificity

13.3. Layouts

13.3.1. Grid

13.3.2. Flex

13.4. Cascade

13.5. Mobile first

13.6. 30 Seconds of CSS - Useful CSS snippets

13.7. BEM

13.7.1. BEM 101 | CSS-Tricks

14. HTML

14.1. Semantics

14.1.1. Avoiding div's

14.1.1.1. HTML5 Semantic Elements

14.2. Accessibility

14.2.1. ARIA

14.2.1.1. WAI-ARIA basics

15. Wordpress

15.1. Advanced Custom Fields (ACF)

15.2. Wordpress Template Development Process Checklist

16. SQL Databases

16.1. MySQL

17. Gulp

17.1. Minifying

17.2. Transpiling

17.3. SASS to CSS

18. Webpack

19. Mindset

19.1. As simple as possible

19.2. Focus on value provided

19.3. https://www.youtube.com/watch?v=8adsZeMQjGQ&feature=youtu.be

19.4. Taking higher perspective on the tasks

19.5. Solve the problem first, then write the code

19.6. Problem solving techniques

19.7. KISS YAGNI & DRY Principles | iTexico

19.8. KISS, DRY, YAGNI and More. The 7 Acronyms Every Developer Should Know

19.9. How to think like a programmer - https://www.youtube.com/watch?v=YgzpqlF54lo&list=PLKQ5LYb497AZIZe9dBWy8GwLluVaMQVj0

19.10. Drawing flowcharts

19.10.1. Programming: Flowcharts

20. Chrome Developer Tools

20.1. console

20.1.1. console.log

20.1.2. console.dir

20.1.3. console.table

20.1.4. debugger

21. DOM

22. Browser

22.1. Rendering Performance  |  Web Fundamentals  |  Google Developers

22.2. Rendering process

22.2.1. Rendering Performance  |  Web Fundamentals  |  Google Developers

23. Docker

23.1. docker-compose up -d

24. 3 mornings

24.1. VueJS and Javascript

24.1.1. VueJS

24.1.1.1. learning the basics

24.1.2. VueX

24.1.3. JS

24.1.3.1. AJAX

24.1.3.2. ES6

24.1.4. yarn / npm scripts - quick walkthrough

24.1.5. Stuff surrounding JobTrek

24.1.6. Walkthrough and development process of a more complicated Vue component (feeling button for example)

24.1.7. Using Zeplin / Sketch workflow

24.1.8. Pair programming

24.1.8.1. Pair program my task

24.1.8.2. Pair program her task

24.2. Fractal component development

24.2.1. Twig

24.2.2. Handlebars

24.2.3. SASS

24.2.4. Walkthrough of fractal component development

25. Soft skills

25.1. How to handle frustration

25.2. Grow empathy

25.3. Understanding thinking of other departments (missions, skills, tools)

25.4. Teach others - (not only developers!)

25.4.1. how can the designers understand enough to think in a more compatible way? (understand constraints, possibilities, what choice impacts development)

25.5. capacity for code review (project+team+growth interest > personal preference / ego)

25.6. ratio effort/result

25.7. detach from tech

25.7.1. what’s important is to deliver value, onboard easily, avoid technical debt… not wether you chose the best latest trend stack