Skip to content

Latest commit

 

History

History
529 lines (390 loc) · 30.3 KB

README.md

File metadata and controls

529 lines (390 loc) · 30.3 KB
Raw

Web Development In 2020 - A Practical Guide Video Tutorials List

Web development is a minefield of tools and technologies and it is very difficult to know what you need to learn and why you need to learn it. The absolute best resource I have come across on this topic is the YouTube video Web Development In 2020 - A Practical Guide by Brad Traversy. Watching this video is an absolute must for anyone who wants to become a web developer. In fact before you start learning anything you should first watch this video to understand the big picture. It will act as an invaluable compass in your learning journey. Free Code Camp's blog post Web Development in 2020: What Coding Tools You Should Learn gives a good high-level summary of what is covered in the video should you wish to know more prior to investing your time in watching the video.

Brad mentions in the video that you do not need to learn everything here. He is essentially providing you with an option menu of what is possible to learn (and some things you really should learn - such as HTML, CSS, and JavaScript) and why you should learn them depending on what your goals are. So really it is up to you to pick and choose what you want to learn.

I have created a list of links below to sections of the video along with the slides so you can delve further into certain specific topics that you are interested in learning more about. I have also compiled convenient links to the suggested YouTube tutorials highlighted in the video. You can also see the links I have added to relevant sections of Andrew Shearer's excellent Web Development 2020 Course List that comprises a list of the top Udemy courses for each slide as well as other resources. In fact this very repository is based on his excellent work so huge credit to him for putting all of that together. However, not everyone likes or can afford Udemy courses on all of these topics so I wanted to provide links to the YouTube videos and other resources so that people can either learn for free in a more bitesized manner.

OK no time to waste and time to start learning cos it's gonna take you years to learn even part of this stuff! 😊

High Level Overview

Tools 1 - The Necessities (2:38)

Slide 3

Computer & OS

  • Linux
  • MacOS
  • Windows

Text Editor / IDE

Browser

Terminal

Design (Optional)

UI/UX (Optional)

The Building Blocks (7:10)

Slide 4

HTML

CSS

HTML & CSS

Responsive Design (9:18)

Slide 5

Custom Reusable CSS Components (10:50)

Slide 6

CSS Frameworks (Choose One) (12:26)

Slide 7

Vanilla JavaScript (13:52)

Slide 8

Tools 2 - Essential Dev Tools (16:28)

Slide 9

Basic Deployment (20:45)

Slide 10

Where To Now? (24:12)

Slide 12

Front-End Framework (Choose One) (25:00)

Slide 13

Svelte (27:14)

Slide 14

State Management (28:32)

Slide 15

Server-Side Rendering (30:40)

Slide 16

Static Site Generators (33:04)

Slide 17

TypeScript (35:05)

Slide 18

Server-Side Language (Choose One) (37:42)

Slide 20

Server-Side Framework (Choose One) (42:52)

Slide 21

Database (Choose One) (47:37)

Slide 22

GraphQL (52:08)

Slide 23

Content Management (53:41)

Slide 24

Deployment & DevOps (55:22)

Slide 25

Mobile Development (Choose One) (59:51)

Slide 27

PWA: Progressive Web Apps (1:01:43)

Slide 28

Desktop Apps with Electron (1:03:19)

Slide 29

JAMstack (1:04:24)

Slide 30

Serverless Architecture (1:06:10)

Slide 31

API-First Design (1:07:24)

Slide 32

Machine Learning / AI & The Web (1:08:12)

Slide 33

Speech Recognition (1:09:03)

Slide 34

Web Assembly (1:09:42)

Slide 35

If all that wasn't enough then here are even more links:

Shearer's Other Links