Roadmap, Quick cheatsheet, Study materials for Front End Web Development

This is the roadmap I'm following to become a Frontend Web Developer in 2022

You can do the same!

Basics of CS
↓
HTML

↓
CSS

↓

Tailwind / Bootstrap
↓
JavaScript

↓
DOM
↓
Git (Version Control)
↓
React JS
↓
TypeScript
↓
Next JS
↓
GraphQL

You can prefer udemy paid course for complete web development bootcamp by Dr. Angela YU
https://www.udemy.com/share/1013gG/

HTML :-

https://www.w3schools.com/html/

CSS :-

https://www.w3schools.com/css/

Javascript:-

DOC to learn - https://www.javascripttutorial.net/
karel ide - https://stanford.edu/~cpiech/karel/ide.html
** HTML DOM ** - //stanford.edu/~cpiech/karel/ide.html

REACT

https://youtu.be/nTeuhbP7wdE

---

Quick cheetsheet--

HTML - https://htmlcheatsheet.com/

CSS - https://cssreference.io/

GIT - https://gitsheet.wtf/

OPEN API- https://overapi.com/

DEV HINTS- https://overapi.com/ ( This is a modest collection of cheat sheets for ES6, SASS, etc.)

Cheatography is a collection of 5047 cheat sheets and quick references in 25 languages for everything from programming to
travel!
https://cheatography.com/#google_vignette

---

TOOLS

Website to create wireframes - https://balsamiq.com/wireframes/?gclid=Cj0KCQjw2MWVBhCQARIsAIjbwoM7ELvU2Yb02JFDIY7PxMNuhqlKrAwtLRTreUSRcHlKsIG8Kh8DizQaAkhmEALw_wcB, https://sneakpeekit.com/

Website ideas https://www.awwwards.com/ , https://dribbble.com/tags/website

Help for UI-patterns = https://ui-patterns.com/patterns CSS Fount = https://www.cssfontstack.com/

for image use website https://www.pexels.com/ , https://unsplash.com/

make buttons https://css3buttongenerator.com/

make fabicon https://www.flaticon.com/

Add Icons - https://fontawesome.com/icons ,
https://icons.getbootstrap.com/#install

CSS Fount = https://www.cssfontstack.com/

Missing something? 👇