└── README.md /README.md: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | 10 | 11 | 18 | 19 | 20 |
21 |

22 | 23 | Logo 24 | 25 | 26 |

Best Web-Dev Resources

27 | 28 |

29 | Find resources to become full stack web developer! 30 |
31 |

32 |

33 | 34 | 35 |
36 | Table of Contents 37 |
    38 |
  1. About The Project
    2. 39 |
  2. Getting Started
    3. 40 |
  3. Programs and Classes
    4. 41 |
  4. Learn HTML
    5. 42 |
  5. Learn CSS
    6. 43 |
  6. Learn GIT
    7. 44 |
  7. Learn JavaScript
    8. 45 |
  8. Learn TypeScript
    9. 46 |
  9. Learn Reactjs
    10. 47 |
  10. Learn Nodejs
    11. 48 |
  11. Learn API
    12. 49 |
  12. Learn Database
    13. 50 |
  13. Learn Authentication
    14. 51 |
52 |
53 | 54 | --- 55 | 56 | 57 | ## About The Project 58 |
59 | About The Project 60 |
61 | Hello, thank you for checking out Web Dev Resources. These are the resources that I found which helped me learn full stack web development. 62 | Note: Some of the links are for the paid courses. Any of the attached links are not affiliated. 63 |
64 | 65 | --- 66 | 67 | 68 | ## Getting Started 69 | 70 |
71 | Getting Started 72 |
73 | The list below isn't meant to be exclusive, it's more so a collection of links that have helped me out along the way (and can hopefully help you). As you'll see, I've focused on JavaScript, React, and Node.js. There is also a wealth of information on interview prep and applying to jobs. 74 | 75 | * [2021 Web Developer Roadmap](https://roadmap.sh/) 76 | * Brad Traversy's YouTube video on what to learn [Web Development In 2021 - A Practical Guide](https://www.youtube.com/watch?v=VfGW0Qiy2I0&ab_channel=TraversyMedia) 77 | * Coursera Course (Not CS Specific) - [Learning how to learn](https://www.coursera.org/learn/learning-how-to-learn) 78 | * [Teaching Yourself Computer Science](https://teachyourselfcs.com/) 79 |
80 | 81 | --- 82 | 83 | 84 | ## What is the Single most useful CS Bookmark you have? 85 | 86 |
87 |
88 | 89 | * [Build Your Own X](https://github.com/danistefanovic/build-your-own-x) 90 | * [Dev Docs](https://devdocs.io) 91 |
92 | 93 | --- 94 | 95 | 96 | ## Programs and Classes 97 | 98 |
99 | Programs and Classes 100 |
101 | 102 | * Bootcamps 103 | * [The Frontend Developer Career Path](https://scrimba.com/learn/frontend) 104 | * [The Web Developer Bootcamp by Colt Steele](https://www.udemy.com/course/the-web-developer-bootcamp). 105 | 106 | * Programs 107 | * [The Odin Project](http://www.theodinproject.com/) 108 | * [FreeCodeCamp](https://www.freecodecamp.com/) 109 | * [The Essential Web Developer Course](https://open.appacademy.io/) Free access to their various curriculums. 110 | * [Full Stack Open by University of Helsinki](https://fullstackopen.com/en/) Learn to build Fullstack app using MERN Stack. 111 |
112 | 113 | --- 114 | 115 | 116 | ## Learn HTML 117 | 118 |
119 | HTML Resources 120 |
121 | 122 | * [HTML5 Full Tutorial - w3schools](https://www.w3schools.com/html/) 123 | * [Learn HTML and CSS](https://www.internetingishard.com/) 124 | * [HTML5 Introduction EDX](https://www.edx.org/course/html5-introduction-w3cx-html5-0x-0) 125 | * [HTML Cheat Sheet](https://websitesetup.org/html5-cheat-sheet/) 126 | * [HTML Best Practices](https://github.com/hail2u/html-best-practices) 127 |
128 | 129 | --- 130 | 131 | 132 | ## Learn CSS 133 | 134 |
135 | CSS Resources 136 |
137 | 138 | * [The Responsive Web Design Bootcamp](https://scrimba.com/learn/responsive) 139 | * [Learn HTML and CSS](https://www.internetingishard.com/) 140 | * [HTML and CSS Tutorial for 2021 - COMPLETE Crash Course!](https://www.youtube.com/watch?v=D-h8L5hgW-w&ab_channel=DesignCourse) 141 | * [100 Days Of CSS](https://100dayscss.com/) 142 | * CSS Games 143 | * [Flexbox Froggy](https://flexboxfroggy.com) 144 | * [CSS Grid Garden](https://cssgridgarden.com/) 145 | * [CSS Dinner](https://flukeout.github.io) 146 | * [CSS Cheat Sheet](https://websitesetup.org/css3-cheat-sheet/) 147 | * Blog posts and Articles 148 | * [The CSS Cascade](https://wattenberger.com/blog/css-cascade) 149 |
150 | 151 | --- 152 | 153 | 154 | ## Learn Git 155 | 156 |
157 | Git Resources 158 |
159 | 160 | * [Git and GitHub for Beginners - Crash Course](https://www.youtube.com/watch?v=RGOj5yH7evk&t=5s&ab_channel=freeCodeCamp.org) 161 | * [Learn Git Branching](https://learngitbranching.js.org/) 162 | 163 |
164 | 165 | --- 166 | 167 | 168 | ## Learn JavaScript 169 | 170 |
171 | JavaScript Resources 172 |
173 | 174 | * [FreeCodeCamp's JavaScript Playlist on Youtube](https://www.youtube.com/playlist?list=PLWKjhJtqVAbleDe3_ZA8h3AO2rXar-q2V) 175 | * [MDN's JavaScript Tutorial](https://developer.mozilla.org/en-US/docs/Web/JavaScript) 176 | * [Scrimba's The JavaScript Bootcamp](https://scrimba.com/learn/javascript) 177 | * [Wes Bos's Beginner JavaScript Course](https://wesbos.com/javascript) 178 | * [JavaScript: Understanding the Weird Parts](https://www.udemy.com/course/understand-javascript) 179 | * [javaScript.info](https://javascript.info) 180 | * JavsScript Projects 181 | * [30 Day Vanilla JS Coding Challenge](https://javascript30.com) 182 | * [100+ JavaScript Projects for Beginners!](https://jsbeginners.com/javascript-projects-for-beginners/) 183 | * [Build 15 JavaScript Projects - Vanilla JavaScript Course](https://www.youtube.com/watch?v=3PHXvlpOkf4&ab_channel=freeCodeCamp.org) 184 | * JavaScript Data Structures and Algorithms 185 | * [JavaScript Algorithms and Data Structures](https://github.com/trekhleb/javascript-algorithms) 186 | * [Data Structures & Algorithms - JavaScript](https://www.udemy.com/course/data-structures-algorithms-javascript) 187 | * Coding Challenges 188 | * [Edabit](https://edabit.com/challenges/javascript) 189 | * [Exercism](https://exercism.io/tracks/javascript) 190 | * [Codewars](https://www.codewars.com) 191 | * Books 192 | * [Eloquent JavaScript](https://eloquentjavascript.net) 193 | * [You Dont Know JS](https://github.com/getify/You-Dont-Know-JS) 194 | * [Learning JavaScript Design Patterns](https://addyosmani.com/resources/essentialjsdesignpatterns/book) 195 | * Blog posts and Articles 196 | * [A Study Plan To Cure JavaScript Fatigue](https://www.freecodecamp.org/news/a-study-plan-to-cure-javascript-fatigue-8ad3a54f2eb1) 197 | * [Understanding Closures in JavaScript](https://blog.bitsrc.io/a-beginners-guide-to-closures-in-javascript-97d372284dda) 198 | * [Callback Hell](http://callbackhell.com) 199 |
200 | 201 | --- 202 | 203 | 204 | ## Learn TypeScript 205 | 206 |
207 | TypeScript Resources 208 |
209 | 210 | * [TypeScript Course for Beginners 2021 - Learn TypeScript from Scratch!](https://www.youtube.com/watch?v=BwuLxPH8IDs&t=6181s) 211 | * [TypeScript Playlist by Net Ninja](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gUgr39Q_yD6v-bSyMwKPUI) 212 | * [No BS TS by Jack Herrington](https://www.youtube.com/playlist?list=PLNqp92_EXZBJYFrpEzdO2EapvU0GOJ09n) 213 | * [Typescript: The Complete Developer's Guide](https://www.udemy.com/course/typescript-the-complete-developers-guide) 214 | * [React + TypeScript Cheatsheet](https://github.com/typescript-cheatsheets/react) 215 | * [TypeScript Exercise](https://typescript-exercises.github.io/#exercise=1&file=%2Findex.ts) 216 | * Books 217 | * [TypeScript in 50 Lessons](https://typescript-book.com) 218 | * [Programming TypeScript: Making Your JavaScript Applications Scale](https://www.amazon.in/Programming-TypeScript-Boris-Cherny/dp/1492037656) 219 | * [Effective TypeScript: 62 Specific Ways to Improve Your TypeScript](https://www.amazon.in/Effective-TypeScript-Dan-Vanderkam/dp/1492053740) 220 | * [Tackling TypeScript: Upgrading from JavaScript](https://exploringjs.com/tackling-ts) 221 | * Blog posts and Articles 222 | * [Why You Should Choose TypeScript Over JavaScript](https://serokell.io/blog/why-typescript) 223 | * [TypeScript Generics for People Who Gave Up on Understanding Generics](https://www.robinwieruch.de/react-testing-library) 224 | * [Here is what every React Developer needs to know about TypeScript - Part 1](https://blog.dastasoft.com/posts/heres-what-every-react-developer-needs-to-know-about-typescript) 225 | *[React Query and TypeScript](https://tkdodo.eu/blog/react-query-and-type-script) 226 | *[In-Depth Look at TypeScript Generics: Part 1 — Intro to Generics](https://itnext.io/in-depth-look-at-typescript-generics-part-1-intro-to-generics-7ddc72dcfcea) 227 | *[In-Depth Look at TypeScript Generics: Part 2 — Advanced Inference](https://itnext.io/in-depth-look-at-typescript-generics-part-2-advanced-inference-5c75638ee6bf) 228 | 229 |
230 | 231 | 232 | ## Learn Reactjs 233 | 234 |
235 | Reactjs 236 |
237 | 238 | * [Full React Course 2020 - Learn Fundamentals, Hooks, Context API, React Router, Custom Hooks](https://www.youtube.com/watch?v=4UZrsTqkcW4&t=5s&ab_channel=freeCodeCamp.org) 239 | * [FreeCodeCamp's React Playlist on Youtube](https://www.youtube.com/playlist?list=PLWKjhJtqVAbkArDMazoARtNz1aMwNWmvC) 240 | * [Epic React by Kent C. Dodds](https://epicreact.dev) 241 | * [70+ open-source clones of sites like Airbnb, Tiktok, Netflix, Spotify etc](https://gourav.io/clone-wars) 242 | * React Testing 243 | * [How to use React Testing Library Tutorial](https://www.robinwieruch.de/react-testing-library) 244 | * [Kent C. Dodds blogs on testing](https://kentcdodds.com/blog/?q=testing) 245 | * Books 246 | * [Pure React by Dave Cedia](https://daveceddia.com/pure-react) 247 | * [Learning React, 2nd Edition](https://www.oreilly.com/library/view/learning-react-2nd/9781492051718) 248 | * Blog posts and Articles 249 | * [Thinking in React Hooks](https://wattenberger.com/blog/react-hooks) 250 | * [Why React Hooks?](https://ui.dev/why-react-hooks/) 251 | * [Flow Control in React](https://reacttraining.com/blog/flow-control-in-react) 252 | * [A (Mostly) Complete Guide to React Rendering Behavior](https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior) 253 | * [TypeScript + React: Why I don't use React.FC](https://fettblog.eu/typescript-react-why-i-dont-use-react-fc/) 254 | * [Not All Components Are Created Equal](https://formidable.com/blog/2021/react-components) 255 | * [useState lazy initialization and function updates](https://kentcdodds.com/blog/use-state-lazy-initialization-and-function-updates) 256 | * [State Colocation will make your React app faster](https://kentcdodds.com/blog/state-colocation-will-make-your-react-app-faster) 257 | * [Should I useState or useReducer?](https://kentcdodds.com/blog/should-i-usestate-or-usereducer) 258 |
259 | 260 | --- 261 | 262 | 263 | ## Learn Nodejs 264 | 265 |
266 | Nodejs 267 |
268 | 269 | * [The Complete Node.js Developer Course](https://www.udemy.com/course/the-complete-nodejs-developer-course-2) 270 | * [Traversy Media's Nodejs Playlist](https://www.youtube.com/playlist?list=PLillGF-RfqbZ2ybcoD2OaabW2P7Ws8CWu) 271 | * Fullstack Projects 272 | * [Build Social Media App by JavaScript Mastery](https://www.youtube.com/playlist?list=PL6QREj8te1P7VSwhrMf3D3Xt4V6_SRkhu) 273 | * [MERN eCommerce From Scratch](https://www.udemy.com/course/mern-ecommerce) 274 | 275 | * Blog posts and Articles 276 | * [The Node.js Way - Understanding Error-First Callbacks](http://fredkschott.com/post/2014/03/understanding-error-first-callbacks-in-node-js) 277 | * [How Node JS middleware Works?](https://medium.com/@selvaganesh93/how-node-js-middleware-works-d8e02a936113) 278 | 279 |
280 | 281 | --------------------------------------------------------------------------------