The Complete 2019 Web Development Bootcamp

The Complete 2019 Web Development Bootcamp
The Complete 2019 Web Development Bootcamp
English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 43 Hours | 18.2 GB

The only course you need to learn to code and become a full-stack web developer. HTML, CSS, Javascript, Node and more!

Welcome to the Complete Web Development Bootcamp, the only course you need to learn to code and become a full-stack web developer.

At 43+ hours, this Web Development course is without a doubt the most comprehensive web development course available online. Even if you have zero programming experience, this course will take you from beginner to mastery. Here’s why:

The course is a taught by the lead instructor at the App Brewery, London’s leading in-person programming bootcamp.

The course has been updated to be 2019 ready and you’ll be learning the latest tools and technologies that are used in large companies such as Apple, Google and Netflix.

This course doesn’t cut any corners, there are beautiful animated explanation videos and tens of real-world projects which you will get to build.

The curriculum was developed over a period of three years, with student testing and feedback.

We’ve taught over 100,000 students how to code and many have gone on to change their lives by becoming professional developers or start their own tech startup.

You’ll save yourself over $12,000 by enrolling, but still get access to the same teaching materials and learn from the same instructor and curriculum as our in-person programming bootcamp.

The course is constantly updated with new content, with new projects and modules determined by students – that’s you!

We’ll take you step-by-step through engaging video tutorials and teach you everything you need to know to succeed as a web developer.

The course includes over 30 hours of HD video tutorials and builds your programming knowledge while making real world websites and web apps.

Throughout the course, we cover a massive amount of tools and technologies, including:

  • Front-End Web Development
  • HTML 5
  • CSS 3
  • Bootstrap 4
  • Javascript ES6
  • DOM Manipulation
  • jQuery
  • Bash Command Line
  • Git, GitHub and Version Control
  • Backend Web Development
  • Node.js
  • NPM
  • Express.js
  • EJS
  • REST
  • APIs
  • Databases
  • SQL
  • MongoDB
  • Mongoose
  • Web Design
  • Deployment with GitHub Pages, Heroku and MongoDB Atlas

By the end of this course, you will be fluently programming and be ready to make any website you can dream of.

You’ll also build a portfolio of over 15+ websites that you can show off to any potential employer.

What you’ll learn

  • Be able to build ANY website you want
  • Craft a portfolio of websites to apply for junior developer jobs
  • Build fully-fledged websites and web apps for your startup or business
  • Work as a freelance web developer
  • Understand the latest frameworks and technologies, including Bootstrap 4, MongoDB, NodeJS, Express, .
  • Learn professional developer best practices
Table of Contents

Front-End Web Development
1 What You’ll Get in This Course
2 Syllabus Download
3 The Giant List of Resources
4 How to Get the Most Out of the Course
5 What You’ll Need to Get Started – Setup Your Local Web Development Environment
6 How Does the Internet Actually Work
7 How Do Websites Actually Work
8 Download the 12 Rules to Learn to Code eBook
9 Pathfinder

Introduction to HTML
10 Introduction to HTML
11 Join the Student Community
12 The Anatomy of an HTML Tag
13 What we’re building – HTML Personal Site
14 What is The HTML Boilerplate
15 How to Structure Text in HTML
16 HTML Lists
17 HTML Image Elements
18 The Anchor Tag Download Attribute
19 HTML Links and Anchor Tags

Intermediate HTML
20 HTML Tables
21 Get Monthly Tips and Tools to Level Up as a Developer
22 Using HTML Tables for Layout
23 HTML Tables Code Challenge
24 How to Type Emojis
25 HTML Tables Solution Walkthrough
26 HTML Forms
27 Forms in Practice – Create a Contact Me Form
28 HTML Challenge
29 Publish Your Website!

Introduction to CSS
30 Introduction to CSS
31 Inline CSS
32 A Quick Note About the Next Lesson
33 Internal CSS
34 External CSS
35 How to Debug CSS Code
36 The Anatomy of CSS Syntax
37 CSS Selectors
38 Classes vs. Ids

Intermediate CSS
39 What We’ll Make – Stylised Personal Site
40 Font Styling in Our Personal Site
41 Learn More About Typography
42 Adding Content to Our Website
43 CSS Sizing
44 Font Properties Challenge 1 – Change the Font Colour
45 Font Properties Challenge 2 – Change the Font Weight
46 Font Properties Challenge 3 – Change the Line Height
47 CSS Font Property Challenge Solutions
48 CSS Float and Clear
49 CSS Challenge
50 What Are Favicons
51 Stylised Personal Site Solution Walkthrough
52 [Optional] Get More Practice HTML and CSS
53 HTML Divs
54 The Box Model of Website Styling
55 CSS Display Property
56 Learn More About Web Design
57 CSS Static and Relative Positioning
58 Absolute positioning
59 The Dark Art of Centering Elements with CSS

Introduction to Bootstrap 4
60 What is Bootstrap
61 Adding Grid Layouts to Our Website
62 A Note About CSS Link Order
63 Bootstrap Containers
64 Bootstrap Buttons & Font Awesome
65 Styling Our Website Challenges and Solutions
66 Bootstrap Challenge 1
67 Solution to Bootstrap Challenge 1
68 Installing Bootstrap
69 Web Design 101 – Wireframing
70 The Bootstrap Navigation Bar
71 What We’ll Make TinDog
72 Download the Starting Files
73 Setting Up Our New Project
74 Bootstrap Grid Layout System
75 Getting Montserrat Black and other Font Weights

Intermediate Bootstrap
76 The Bootstrap Carousel Part 1
77 Advanced CSS – Combining Selectors
78 Refactoring our Website Part 2
79 Advanced CSS – Selector Priority
80 Completing the Website
81 Download the Completed Website
82 The Bootstrap Carousel Part 2
83 Bootstrap Cards
84 The CSS Z-Index and Stacking Order
85 Media Query Breakpoints
86 Bootstrap Challenge 2
87 Bootstrap Challenge 2 Solution
88 How to become a Better Programmer – Code Refactoring
89 Put it into Practice – Refactor our Website Part 1

Introduction to Javascript ES6
90 Introduction to Javascript
91 Challenge Changing String Casing Solution
92 Basic Arithmetic and the Modulo Operator in Javascript
93 Increment and Decrement Expressions
94 Functions Part 1 Creating and Calling Functions
95 Functions Part 1 Challenge – The Karel Robot
96 The Karel Chess Board Solution
97 A Quick Note About the Next Lesson
98 Functions Part 2 Parameters and Arguments
99 Functions Part 3 Outputs & Return Values
100 Javascript Alerts – Adding Behaviour to Websites
101 Challenge Create a BMI Calculator
102 Challenge BMI Calculator Solution
103 Data Types
104 Javascript Variables
105 Naming and Naming Conventions for Javascript Variables
106 String Concatenation
107 String Lengths and Retrieving the Number of Characters
108 Slicing and Extracting Parts of a String
109 Challenge Changing Casing in Text

Intermediate Javascript
110 Random Number Generation in Javascript Building a Love Calculator
111 Control Statements For Loops
112 Control Statements Using If-Else Conditionals & Logic
113 Comparators and Equality
114 Combining Comparators
115 Collections Working with Javascript Arrays
116 Adding Elements and Intermediate Array Techniques
117 Control Statements While Loops
118 Solution to the 99 Bottles Challenge

The Document Object Model (DOM)
119 Adding Javascript to Websites
120 Introduction to the Document Object Model (DOM)
121 Solution to the DOM Challenge
122 Selecting HTML Elements with Javascript
123 Manipulating and Changing Styles of HTML Elements with Javascript
124 The Separation of Concerns Structure vs Style vs Behaviour
125 Text Manipulation and the Text Content Property
126 Manipulating HTML Element Attributes

Boss Level Challenge 1 – The Dicee Game
127 Challenge The Dicee Challenge
128 Download the Completed Website
129 Dicee Challenge Step 0 – Download the Skeleton Project
130 Dicee Challenge Step 1 – Create an External Javascript File
131 Dicee Challenge Step 2 – Add Dice Images
132 Dicee Challenge Step 3 – Create a Random Number
133 Dicee Challenge Step 4 – Change the img to a Random Dice
134 Dicee Challenge Step 5 – Change both img Elements
135 Dicee Challenge Step 6 – Change the Title to Display a Winner
136 The Solution to the Dicee Challenge

Advanced Javascript and DOM Manipulation
137 What We’ll Make Drum Kit
138 A Quick Note About the Next Lesson
139 Using Keyboard Event Listeners to Check for Key Presses
140 Understanding Callbacks and How to Respond to Events
141 Adding Animation to Websites
142 Download the Completed Website
143 Download the Starting Files
144 Adding Event Listeners to a Button
145 Higher Order Functions and Passing Functions as Arguments
146 Higher Order Function Challenge Solution
147 How to Play Sounds on a Website
148 A Deeper Understanding of Javascript Objects
149 How to Use Switch Statements in Javascript
150 Objects, their Methods and the Dot Notation

jQuery
151 What is jQuery
152 Website Animations with jQuery
153 How to Incorporate jQuery into Websites
154 How Minification Works to Reduce File Size
155 Selecting Elements with jQuery
156 Manipulating Styles with jQuery
157 Manipulating Text with jQuery
158 Manipulating Attributes with jQuery
159 Adding Event Listeners with jQuery
160 Adding and Removing Elements with jQuery

Boss Level Challenge 2 – The Simon Game
161 What You’ll Make The Simon Game
162 Step 4 – Check Which Button is Pressed
163 Step 4 – Answer
164 Step 5 – Add Sounds to Button Clicks
165 Step 5 – Answer
166 Step 6 – Add Animations to User Clicks
167 Step 6 – Answer
168 Step 7 – Start the Game
169 Step 7 – Answer
170 Step 8 – Check the User’s Answer Against the Game Sequence8
171 Step 8 – Answer
172 Play the Game
173 Step 9 – Game Over
174 Step 9 – Answer
175 Step 10 – Restart the Game
176 Step 10 – Answer
177 Download the Completed Project Code
178 Step 0 – Download the Starting Files
179 Step 1 – Add Javascript and jQuery
180 Step 1 – Answer
181 Step 2 – Create A New Pattern
182 Step 2 – Answer
183 Step 3 – Show the Sequence to the User with Animations and Sounds
184 Step 3 – Answer

The Unix Command Line
185 Command Line Hyper Setup
186 Understanding the Command Line. Long Live the Command Line!
187 Command Line Techniques and Directory Navigation
188 A Quick Note About the Next Lesson
189 Creating, Opening, and Removing Files through the Command Line

Backend Web Development
190 Backend Web Development Explained

Node.js
191 What is Node.js
192 Install Node.js on Mac
193 Install Node.js on Windows
194 The Power of the Command Line and How to Use Node
195 The Node REPL (Read Evaluation Print Loops)
196 How to Use the Native Node Modules
197 The NPM Package Manager and Installing External Node Modules

Express.js with Node.js
198 What is Express
199 Processing Post Requests with Body Parser
200 BMI Routing Challenge
201 Solution to the BMI Routing Challenge
202 Creating Our First Server with Express
203 Handling Requests and Responses the GET Request
204 Nodemon Installation
205 Understanding and Working with Routes
206 What We’ll Make A Calculator
207 Calculator Setup Challenge
208 Calculator Setup Challenge Solution
209 Responding to Requests with HTML Files

Git, Github and Version Control
210 Introduction to Version Control and Git
211 Version Control Using Git and the Command Line
212 GitHub and Remote Repositories
213 GitHub Private Repos are now Free!
214 Gitignore
215 Cloning
216 Branching and Merging
217 Forking and Pull Requests
218 Optional Git Challenge

APIs – Application Programming Interfaces
219 What are APIs Application Programming Interfaces Demystified
220 Using the Request Module to Get Data from an API
221 Understanding the JSON Format and Working with JSON
222 API Calls with Parameters
223 What We’ll Make A MailChimp Newsletter Sign Up Page
224 Setting Up the Newsletter Page
225 Posting Data to MailChimp’s Servers
226 Adding Success and Failure Pages to the Website
227 Deploy the Project to Heroku and Make it Live!

EJS
228 What We’ll Make A ToDoList
229 Understanding Node Module Exports How to Pass Functions and Data between Files
230 Linter Errors with EJS
231 Templates Why Do We Need Templates
232 Creating Your First EJS Templates
233 Running Code Inside the EJS Template
234 Passing Data from Your Webpage to Your Server
235 The Concept of Scope in the Context of Javascript
236 Adding Pre-Made CSS Stylesheets to Your Website
237 Understanding Templating vs. Layouts

Boss Level Challenge 3 – Blog Website
238 A New Challenge Format and What We’ll Make A Blog
239 Challenge 4 Solution
240 Challenge 5
241 Challenge 5 Solution
242 Challenge 6
243 Challenge 6 Solution
244 Challenge 7
245 Challenge 7 Solution
246 Challenge 8
247 Challenge 8 Solution
248 Challenge 9
249 Setting Up the Blog Project
250 Challenge 9 Solution
251 Challenge 10
252 Challenge 10 Solution
253 Challenge 11
254 Challenge 11 Solution
255 Challenge 12
256 Challenge 12 Solution
257 Challenge 13
258 Challenge 13 Solution
259 Challenge 14 and Solution
260 Challenge 1
261 Challenge 15
262 Challenge 15 Solution
263 Express Routing Parameters
264 Challenge 16
265 Challenge 16 Solution
266 Challenge 17
267 Challenge 17 Solution
268 Challenge 18
269 Challenge 18 Solution
270 Challenge 19
271 Challenge 1 Solution
272 Challenge 19 Solution
273 Challenge 20
274 Challenge 20 Solution
275 Challenge 21
276 Challenge 21 Solution
277 Challenge 2
278 Challenge 2 Solution
279 Challenge 3
280 Challenge 3 Solution
281 Challenge 4

Databases
282 Databases Explained SQL vs. NOSQL

SQL
283 SQL Commands CREATE Table and INSERT Data
284 SQL Commands READ, SELECT, and WHERE
285 Updating Single Values and Adding Columns in SQL
286 SQL Commands DELETE
287 Understanding SQL Relationships, Foreign Keys and Inner Joins

MongoDB
288 Installing MongoDB on Mac
289 Installing MongoDB on Windows
290 MongoDB CRUD Operations in the Shell Create
291 MongoDB CRUD Operations in the Shell Reading & Queries
292 MongoDB CRUD Operations in the Shell Update
293 MongoDB CRUD Operations in the Shell Delete
294 Relationships in MongoDB
295 Working with The Native MongoDB Driver
296 If You Have Forgotten to Quit the Mongod Server

Mongoose
297 Introduction to Mongoose
298 Reading from Your Database with Mongoose
299 Data Validation with Mongoose
300 Updating and Deleting Data Using Mongoose
301 Establishing Relationships and Embedding Documents using Mongoose

Putting Everything Together
302 Let’s take the ToDoList Project to the Next Level and Connect it with Mongoose
303 Rendering Database Items in the ToDoList App
304 Adding New Items to our ToDoList Database
305 Deleting Items from our ToDoList Database
306 Creating Custom Lists using Express Route Parameters
307 Adding New Items to the Custom ToDo Lists
308 Revisiting Lodash and Deleting Items from Custom ToDo Lists

Deploying Your Web Application
309 How to Deploy Web Apps with a Database
310 How to Setup MongoDB Atlas
311 Deploying an App with a Database to Heroku

Boss Level Challenge 4 – Blog Website Upgrade
312 Challenge Give your Blog a Database
313 Step 0 – Download the Starting Files
314 Step 1 – Save Composed Posts with MongoDB
315 Step 2 – Get the Home Page to Render the Posts
316 Step 3 – Fix the bug
317 Step 4 – Render the correct blog post based on post id
318 Completed Blog with Database Solution

Build Your Own RESTful API From Scratch
319 What is REST
320 PUT a Specific Article
321 PATCH a Specific Article
322 DELETE a Specific Article
323 Download the Completed Project Code
324 Creating a Database with Robo 3T
325 Set Up Server Challenge
326 Set Up Server Solution
327 GET All Articles
328 POST a New Article
329 DELTE All Articles
330 Chained Route Handlers Using Express
331 GET a Specific Article

Authentication & Security
332 Introduction to Authentication
333 What are Cookies and Sessions
334 Using Passport.js to Add Cookies and Sessions
335 Level 6 – OAuth 2.0 & How to Implement Sign In with Google
336 Finishing Up the App – Letting Users Submit Secrets
337 Download the Completed Project Code
338 Getting Set Up
339 Level 1 – Register Users with Username and Password
340 How to Review the Source Code
341 Level 2 – Database Encryption
342 Using Environment Variables to Keep Secrets Safe
343 Level 3 – Hashing Passwords
344 Hacking 101 ☣️
345 Level 4 – Salting and Hashing Passwords with bcrypt

Bonus Module Design School 101
346 Designer vs. Non-Designer Thinking
347 What is User Interface (UI) Design
348 The Tour Guide Approach to UI Design
349 The Importance of Alignment
350 What is Good Practice in Interaction Design
351 Colour in User Interface Design
352 The Many Ways of Designing Text Overlays
353 How to Be an Attention Architect
354 Understanding the Mood of Your Colour Palette
355 How to Combine Colours to Create Colour Palettes
356 Tools for Designing with Colour
357 Introduction to Typography
358 The Serif Type Family – Origin and Use
359 The Sans-Serif Type Family – Origin and Use
360 How Typography Determines Readability
361 How to Combine Fonts Like a Pro

Bonus Module Ask Angela Anything
362 AAA 1 – How to Soak in Programming Concepts and more…
363 AAA 2 – Schedule for Learning to Code and more…
364 AAA 3 – How to Start Freelancing and more…

Next Steps
365 Vote for the Next Module!