0 Knowledge to Frontend Engineering Job

THE MOST EFFICIENT WAY TO BREAK INTO TECH.

Your only goal should be getting a job. That's when you'll start learning properly - surrounded by experienced engineers, working on real-world projects. And earning big. Everything before is just a preparation.

And that's the goal of this course: to get you a job in the most efficient way. You'll learn all the stuff you need to build apps and deploy them (i.e. make them available on public URLs):

1. HTML 
2. CSS 
3. JavaScript 
4. React 
5. Git and GitHub knowledge

But you'll also learn in the same way in which software engineers work in companies. We'll use Figma - a cool design tool where designers create sketches and engineers implement them. You'll also build 3 personal projects along the way.

Get the course and get the job.

Course Outline (5 chapters) [8h 39m 22s]

1. HTML (Structure Your App) [1h 1m 59s]
   1. Why do we need HTML? [2:30]
   2. HTML tags [3:21]
   3. Basic HTML structure [3:49]
   4. HTML attributes [1:14]
   5. Your first app! [1:38]
   6. HTML elements: div [1:00]
   7. HTML elements: heading [3:09]
   8. HTML elements: paragraph [1:08]
   9. HTML elements: list [3:23]
   10. HTML elements: anchor [3:20]
   11. HTML elements: image [3:39]
   12. HTML elements: table [3:02]
   13. HTML elements: form [1:26]
   14. HTML elements: input [2:13]
   15. HTML elements: button [3:53]
   16. HTML elements: dropdown [3:10]
   17. HTML elements: checkbox [1:53]
   18. HTML elements: label [3:14]
   19. HTML elements: radio button [2:32]
   20. HTML elements: navigation [2:17]
   21. ASSignment (personal website) [3:08]
   22. ASSignemt review [7:00]
2. CSS (Styling The App) [2h 32m 14s]
   1. WTF is CSS? [3:37]
   2. CSS selectors [6:13]
   3. CSS specificity [12:00]
   4. Units [6:55]
   5. CSS properties: display [4:52]
   6. CSS properties: flexbox [12:01]
   7. Aligning specific items [2:02]
   8. CSS properties: margin [5:28]
   9. CSS properties: padding [4:41]
   10. CSS properties: color [2:37]
   11. CSS properties: background-color [1:23]
   12. CSS variables [4:33]
   13. CSS properties: font-size [3:04]
   14. CSS properties: font-family [4:29]
   15. CSS properties: font-weight [2:34]
   16. CSS properties: line-height [3:56]
   17. CSS properties: width [7:08]
   18. CSS properties: height [1:36]
   19. CSS properties: pseudo-classes [2:34]
   20. CSS properties: cursor [1:27]
   21. CSS properties: opacity [1:05]
   22. CSS properties: border [3:30]
   23. CSS properties: box-sizing [2:42]
   24. CSS properties: position [2:44]
   25. CSS properties: position absolute/relative [12:10]
   26. CSS properties: responsive design [7:09]
   27. CSS reset [5:24]
   28. Finalising your personal website [24:22]
3. Git and GitHub (Push Me To The Cloud) [32m 39s]
   1. WTF are Git and GitHub? [1:36]
   2. GitHub in details [5:54]
   3. Pushing code to the repository (code cloud) [12:34]
   4. Publishing your website (live on a public URL!!!) [2:02]
   5. Git (How multiple devs work on the same codebase) [10:33]
4. JavaScript (Let's Supercharge The App) [2h 22m 56s]
   1. Why Is JavaScript needed (and so good) [2:47]
   2. Your first JS app [2:36]
   3. JS variables [6:44]
   4. if/else [5:43]
   5. Operators [1:58]
   6. Relational operators [2:25]
   7. Equality operators [3:58]
   8. Logical operators [4:49]
   9. Data types [3:29]
   10. 2 main data types [1:33]
   11. Data type: Number [3:29]
   12. Data type: String [4:21]
   13. Data type: Boolean [4:19]
   14. Data type: Undefined [1:13]
   15. Data type: Null [1:58]
   16. Data type: BigInt and Symbol [1:27]
   17. Objects [3:48]
   18. Functions [7:17]
   19. for loop [3:48]
   20. Arrays [3:57]
   21. Array.forEach [2:52]
   22. Array.map [2:25]
   23. Array.filter [1:56]
   24. Array.find [3:00]
   25. Arrow functions [8:09]
   26. Asynchronous JavaScript [5:07]
   27. Promises [4:47]
   28. setTimeout [5:47]
   29. async/await [3:55]
   30. try/catch [3:59]
   31. Fetch [4:02]
   32. Fetch + async/await [4:12]
   33. DOM [2:22]
   34. Document interface [6:31]
   35. Events [4:51]
   36. Reacting to events [4:30]
   37. Updating styles [3:52]
5. React (Coding On Steroids) [2h 31m 34s]
   1. The Last Intro (React) [4:34]
   2. SPA (Single Page Application) [2:58]
   3. Setting up a development environment [5:32]
   4. NFT website (personal project) [2:16]
   5. JSX [2:33]
   6. Components [13:07]
   7. Props [4:43]
   8. Prettier [3:01]
   9. Building components live (like a senior dev): SponsorshipListItem [3:36]
   10. Aliases (make your imports powerful) [2:17]
   11. SponsorshipListItem: additional styling [3:18]
   12. Style Me [4:49]
   13. Custom fonts [2:34]
   14. Changing the background [2:43]
   15. Building components live: Header [6:44]
   16. Building components live: Button [4:31]
   17. Building components live: Hero pt1 [8:40]
   18. CSS reset [0:58]
   19. Building components live: Hero pt2 [6:38]
   20. Building components live: NFT card pt1 [6:23]
   21. Building components live: NFT card pt2 [9:57]
   22. Building components live: NFT list [9:08]
   23. Building components live: NFT card with text [8:27]
   24. Tweaking styles like a senior dev [9:41]
   25. Reviewing the app [8:38]
   26. Final app tweaks [9:36]
   27. Let's push this to the cloud [4:03]