Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Complete Web Developer Course Build 10 Websites from Scratch
Learn how to Build Websites
1 Introduction to Course (7:31)
2 How to use this course (7:49)
3 Course resources overview (6:20)
4 Best Web Resources (7:26)
5 Getting your website online (2:53)
6 what is HTML CSS and JavaScript (5:59)
7 Resource List
HTML Foundations for building websites
8 Introduction to learning HTML (2:21)
9 Basics of HTML (7:03)
10 How to create a basic HTML template (11:38)
11 Basic HTML template source
12 Headings Paragraphs and Line Breaks Content Structuring (7:32)
13 Adding images into HTML (5:10)
14 Ordered Lists Unordered Lists (3:51)
15 Hyperlinks Relative paths vs Absolute Paths (8:07)
16 Divs and Spans Tel and Mailto (9:00)
17 HTML5 Semantic Elements (5:14)
18 Transfer build content to editor (2:32)
19 HTML page structure
20 How to create HTML forms (8:24)
21 HTML5 Input types (13:02)
22 Additional Form Elements (4:55)
23 Form Resources
24 HTML conclusion (5:01)
CSS Foundations for building websites
25 CSS introduction (2:33)
26 CSS selecting elements from HTML (8:47)
27 Working with CSS colors (5:25)
28 CSS Background options (7:06)
29 Adding Fonts (3:02)
30 Pseudo classes and design patterns (4:47)
31 Using the Float property (5:55)
32 Box Model Margins (9:38)
33 Box Model Padding shorthand (4:20)
34 CSS to create a navbar (9:03)
35 Display properties CSS (3:14)
36 CSS overflow handling (2:39)
37 CSS positioning elements (3:40)
38 CSS tweaks and updates (8:25)
39 Media Queries making your website Responsive (11:05)
40 HTML CSS summary (2:57)
41 Source Code
42 CSS Conclusion (2:09)
Quick JavaScript for building websites
43 Introduction to JavaScript Overview (2:11)
44 What is JavaScript (2:22)
45 How to add JavaScript in web pages (5:17)
46 Basics of JavaScript Dev Tools How to Comment and more (10:55)
47 Introduction to Variables within JavaScript (11:05)
48 Understanding Variables (10:50)
49 Source Code
50 Arrays and Objects (8:03)
51 Working with Arrays and Objects (9:25)
52 Using and updating array values (10:53)
53 Source Code
54 Introduction to Functions (7:59)
55 Local Global Variables in functions (3:36)
56 Source Code
57 Ternary Comparison (9:03)
58 Conditional Statements (5:54)
59 Switch Statements (4:55)
60 Source Code
61 Introduction to looping (4:59)
62 JavaScript For Loops (6:43)
63 Source Code
64 Introduction to the Document Object Model (6:13)
65 Accessing Page Elements from JavaSCript (4:29)
66 Selecting Elements via JavaScript (8:44)
67 Source Code
68 Updating CSS with JavaScript (7:27)
69 Source Code
70 JavaScript Events (5:06)
71 Event Listeners selecting elements (9:34)
72 Source Code
73 addEventListener More events trigger options (7:00)
74 Source Code
75 What can you do with JavaScript (3:58)
76 JavaScript Overview Conclusion (2:42)
Quick jQuery for building websites
77 Introduction to using jQuery (2:21)
78 What is jQuery and why do we use it (5:12)
79 Getting Started with jQuery (6:17)
80 jQuery Selectors (6:08)
81 Each value from mulitple selector elements (4:06)
82 Updating elements via jQuery (7:11)
83 Source Code
84 CSS selectors and jQuery selectors (2:15)
85 Introduction to event binding (2:33)
86 Event Listeners jQuery Mouse Events (6:39)
87 Source Code
88 Keyboard event triggers (6:08)
89 Source Code
90 Resize and Scroll event listeners on window object (7:06)
91 Source Code
92 Finding input values from form jQuery (6:23)
93 jQuery Traversing elements (7:34)
94 Select elements from HTML content (5:21)
95 Source Code
96 jQuery working with CSS (7:29)
97 Source Code
98 Hide and Show page sections (9:10)
99 jQuery effects Fading (4:03)
100 JQuery Sliding Effects (4:33)
101 Source Code
102 jQuery Animate (10:35)
103 Source Code
104 jQuery AJAX made easy JSON and more (5:32)
105 Loading data into HTML via jQuery (6:44)
106 jQuery AJAX get getJSON (9:21)
107 AJAX with jQuery (9:51)
108 Source Code
109 jQuery Conclusion (2:16)
110 Resources
111 using map and each within jQuery (7:10)
112 Source Code
Bootstrap 4 Introduction
0 Setup Coding Environment (2:29)
1 Get Bootstrap Setup Template (7:56)
2 Source Code Bootstrap 4
3 Bootstrap Layout Containers (4:56)
4 Introduction to the Grid (11:57)
5 Do more with the Grid (11:25)
6 Jumbotron Bootstrap 4 (2:48)
7 Margins and Padding Bootstrap (2:30)
8 Bootstrap 4 Color Utilities (2:48)
9 Bootstrap 4 Utilities (7:51)
10 Bootstrap 4 Tables (6:38)
11 Bootstrap Images Responsive (3:40)
12 Bootstrap Buttons (3:03)
13 Bootstrap 4 Forms (9:25)
14 Button Grouping Radio and Checkboxes (5:33)
15 Bootstrap 4 Alerts (2:34)
16 Bootstrap 4 Badges (1:40)
17 Bootstrap 4 Progress Bar (2:59)
18 Bootstrap 4 Cards (6:27)
19 Bootstrap List Group (3:09)
20 NavBar Responsive Bootstrap (9:13)
21 Nav List Bootstrap 4 (2:13)
22 Bootstrap 4 Carousel (8:22)
23 Bootstrap Modals (7:47)
New Bootstrap 4 Version Single Page Website
single page parallax website 4 (2:16)
1 Basic Bootstrap 4 Template Creation (3:20)
2 Create Bootstrap NavBar (11:08)
3 Header Section (6:30)
4 Build Home Section (7:56)
5 About Me Section (7:41)
6 Bootstrap Cards Grid Columns (7:55)
7 Create Contact Form Grid (7:08)
8 Footer and Tweak Page (3:13)
9 Add jQuery Animate (7:30)
10 Project Review (2:37)
Build a single Page responsive website
163 Introduction Website 2 (2:40)
164 Create a wireframe of website (2:23)
165 Build HTML page structure in prep for Styling (8:21)
166 Build Navigation Menu and Page Content (9:54)
167 Build HTML tags Nesting of Semantic Elements (8:48)
168 Adding Styling to your webpage (9:55)
169 Linking to Libraries Google Fonts and more (7:20)
170 Sticky Headers Section Styling (8:37)
171 Build a navigation bar with CSS (6:36)
172 Add background images (7:30)
173 Section text rgba (2:37)
174 CSS media for responsive web design (6:23)
175 Update menu to be Responsive on resize (5:40)
176 Introduction to JavaScript and jQuery (6:52)
177 Add Click events create interactions for users (5:07)
178 use jQuery to get pixel position of HTML elements (6:56)
179 Scroll webpage dynamically (3:45)
180 Hide menu when clicked on small screen (5:11)
181 Final Fix of issues completed website (5:20)
182 Source Code
183 Source Code
184 Conclusion website 2 (2:13)
Create a quick simple website using HTML and CSS
148 Website 1 Introduction (2:05)
149 HTML and WireFrame (5:25)
150 Build HTML structure (5:46)
151 Source Code
152 Add Placeholder content (4:21)
153 Add Styling to HTML Structure (6:21)
154 How to turn Unorderd List into a Navbar (9:00)
155 Source Code
156 Media Screen Sizes make it responsive (5:40)
157 Responsive Columns (9:54)
158 Clear Floating update sections (7:20)
159 Google Fonts and Customizing (6:54)
160 Source Code HTML
161 Source Code CSS
162 Website 1 Conclusion (2:14)
Responsive Website Template
204 Website 4 Introduction Responsive Navbars (3:10)
205 Website Wireframe plan (5:57)
206 Build HTML Structure Layout (8:40)
207 Source Code
208 Floating Elements (11:36)
209 Update header elements (4:56)
210 Build nav menu CSS (7:20)
211 Source Code
212 Margins Padding Logo area update (9:39)
213 Source Code
214 Source Code
215 update styling nav menu updates (10:08)
216 Main wrapper update set selected item in menu (7:02)
217 Use jQuery to get URL page value (9:00)
218 jQuery Dynamic Classes (5:18)
219 Source Code
220 Add web fonts Google Fonts to website (2:21)
221 select page styling (10:12)
222 Images products resize (8:31)
223 Course Summary (3:58)
224 Source Code
225 Source Code
226 Source Code
227 Source Code
228 Website 4 Conclusion (2:08)
Two Column Responsive Website Template
229 Website 5 Columns Introduction (2:01)
230 Website Planning Design Sketch (5:33)
231 Building HTML structure (8:33)
232 HTML adding placeholder content (9:49)
233 Source Code
234 Create Stlying for webpage (9:38)
235 CSS source
236 Header positioning with CSS (8:54)
237 Create a Navigation Menu Bar (9:51)
238 Quick Fixes image and nav (4:19)
239 making a 2 column website (6:31)
240 Quick Tweaks of CSS (4:53)
241 Three Column Fat Footer Styling (6:04)
242 Source Code HTMl and CSS
243 Making your website Fully Responsive (11:10)
244 Updating media sizes (6:14)
245 Create additional web pages (2:17)
246 Source Code
247 Source Code
248 Website 5 Conclusion (1:33)
Single Page website with Parallax Website
277 Website 7 Parallax Backgrounds Introduction (3:14)
278 Create Wireframe of Website (6:08)
279 HTML structure create Navmenu (5:28)
280 Creating HTML sections (5:08)
281 Source Code
282 Placeholder content (3:19)
283 Apply CSS to HTML (4:26)
284 How to create a Navbar from UL (8:08)
285 Full page size sections and background defaults (6:06)
286 Add background images (4:46)
287 Make your text standout (5:00)
288 Tweaking the navbar for responsive effects (8:02)
289 Responsive Updates and Fixes (8:23)
290 Navbar for small screens (3:25)
291 Adding Footer and updating sections (7:36)
292 Source Code
293 Adding jQuery create event triggers (7:09)
294 jQuery binding window events (3:12)
295 Adding icon library (2:33)
296 Animate Scrolling with jQuery (8:31)
297 Slidemenu up jQuery (3:07)
298 Add Parallax effect (6:37)
299 Create a Contact Form (9:56)
300 Single Page Parallax site summary (3:14)
301 Source Code
302 Source Code CSS
303 Resources
304 Website 7 Conclusion (2:09)
Single Page Carousel Control Website
305 Website 8 Introduction (2:07)
306 Web Design Planning wireframe outline (2:37)
307 Web Design HTML structure (7:48)
308 Adding placeholder design content (7:45)
309 Setup Content Sections 100% (7:59)
310 Position Navbar (5:35)
311 Create floating navbar indicators (8:25)
312 Source Code
313 Quick introduction to jQuery (3:10)
314 jQuery to select elements with hash (9:25)
315 Animate Scroll jQuery (6:53)
316 jQuery Scroll window and mapping of section info (9:11)
317 Calculate which section the window is currently in (6:52)
318 Change calls to active on scroll (6:37)
319 HTML jQuery
320 Source Code CSS
321 website tweaks (3:24)
322 Making it responsive (8:47)
323 Update section content (4:10)
324 Pseudo Elements setup sections (6:04)
325 Final adjustments on design (6:40)
326 Source Code Conclusion (2:03)
327 Source Code
328 Website 8 Conclusion (2:11)
Multiple Page website from scratch with active class
329 Website 9 Introduction mutiple page multiple column (2:47)
330 Website Planning wireframe design (6:49)
331 Create parent elements HTML structure (6:57)
332 Add resources and dummy placeholder content (4:33)
333 Apply Styling to HTML top level elements (5:33)
334 Navbar setup and styling (12:00)
335 Creating a content wrapper (2:40)
336 Creating a header (3:05)
337 Source Code
338 Setting up sections sidebar and footer (7:03)
339 CSS tweaks and fixes (4:51)
340 Add media queries make it responsive (7:27)
341 Add additional media queries (4:20)
342 Source Code
343 Setup responsive navbar (5:11)
344 Setup menu for toggle of class (3:20)
345 Source Code
346 Add jQuery event trigger (8:02)
347 Source Code
348 Setting classes on the fly (11:46)
349 Page Tweaks and options (4:55)
350 Source Code
351 Create additional pages for website (8:18)
352 update contact form (6:19)
353 Source Code
354 Website 9 Conclusion (2:00)
Single Page Bottom Menu website
355 Introduction website 10 HTML CSS jQuery together (2:28)
356 Wireframe planning of website (4:53)
357 Web Design HTML Page structure (6:14)
358 Add placeholder content to prepare for stlying (5:19)
359 Setup CSS defaults (3:58)
360 Create a sticky Footer position it at the bottom (4:36)
361 Source Code
362 Navbar coding options for styling (9:32)
363 Navbar code
364 Add styling to sections (8:35)
365 Source Code
366 Add section background covers (6:49)
367 Image tweaks and adjustments to CSS (6:55)
368 Header update style (4:39)
369 Contact form styling (7:31)
370 HTML CSS Source Code
371 Add jQuery to website (4:19)
372 Animate scrolling of webpage (6:53)
373 update classes on scroll (9:44)
374 Source Code jQuery
375 Google Fonts and Background shadows (6:27)
376 How to add social icons (5:55)
377 Resources to update CSS and customize (6:41)
378 Final Updates (3:45)
379 Source Code
380 Website 10 Conclusion (2:02)
Quick Website Development Sample Site
0 Setup Editor (2:14)
1 Quick Start Bootstrap (5:51)
2 Page Quick Design (5:02)
3 Splash Page Introduction (4:28)
4 Bootstrap 4 NavBar (8:04)
5 Bootstrap Grid (5:29)
6 Bootstrap 4 Cards (4:13)
8 Customize CSS (6:57)
9 Bootstrap 4 Utilities (5:14)
10 Bootstrap 4 Card options (8:03)
11 Website Overview (4:37)
12 Footer Sizing Spacing (7:08)
Making a Contact form
381 Introduction to making a contact form (3:58)
382 Create HTML Bootstrap structure (6:52)
383 Create form structure (8:57)
384 Add PHP session holder (9:18)
385 Source Code
386 PHP Get Post Data (11:28)
387 AnitSpam Check using PHP (5:21)
388 PHP send Email (7:03)
389 Upload file and send email to email address (4:31)
390 PHP form Fixes (2:04)
391 Source Code
392 jQuery Form Check setup (4:17)
393 jQuery Toggle Error messages (10:01)
394 Web Contact Form live Test (2:49)
395 Web Contact Form Tweaks and Adjustments (5:42)
396 Source Code
Code Snippets in Action Just Useful code for web development
397 Code Snippets Introduction (2:25)
398 Popup Images using JavaScript (8:46)
399 Source Code
400 Mouse Event Listeners JavaScript (10:32)
401 Source Code
Conclusion & resources
402 Complete Websites Conclusion (3:35)
Bootstrap 3 Content
113 Introduction to using Bootstrap (2:04)
114 What is Bootstrap and how do you use it (11:48)
115 Bootstrap Containers (6:26)
116 Source Code
117 Bootstrap Grid System (10:22)
118 Grid Source Code
119 How to practice and learn the Bootstrap Grid (4:20)
120 Bootstrap Containers Jumbotron (6:14)
121 Bootstrap typography (5:54)
122 Typography Source Code
123 Amazing Bootstrap Table stlying options (8:51)
124 Table Source Code
125 Bootstrap Form inputs (8:58)
126 Button options with Bootstrap (11:23)
127 Button Source Code
128 Typography options (3:43)
129 Source Code
130 Bootstrap images and alignments (6:29)
131 Image Source Code
132 Bootstrap Alerts (8:48)
133 Alerts Source Code
134 Bootstrap Navbar (8:05)
135 Responsive Navbar Bootstrap (9:36)
136 Navbar Source Code
137 Carousel image slider with Bootstrap (12:40)
138 Bootstrap Carousel indicators (3:27)
139 Carousel Source Code
140 Buidling a modal within Bootstrap (9:38)
141 Creating a Modal Complete (2:37)
142 Modal Source Code
143 Bootstrap Utility classes (6:41)
144 Source Code
145 Bootstrap Conclusion Resources (4:06)
146 Resources
147 Conclusion to Bootstrap Section (2:41)
Bootstrap Template from Scratch
185 Website 3 Bootstrap introduction (2:36)
186 Website Structure (7:05)
187 Source Code
188 Add styling to sections (4:59)
189 Building a navigation menu (7:27)
190 Navbar with Bootstrap easy (2:07)
191 Source Code
192 Adding Buttons to elements (7:55)
193 Rows cols images made responsive (8:08)
194 Contact form using Bootstrap for styling (9:23)
195 Add background images (7:27)
196 jQuery Scrolling Effect (5:24)
197 Source Code
198 Adding modals (7:11)
199 Course Summary (3:17)
200 Source Code
201 Source Code
202 Source Code
203 Website 3 Conclusion (2:53)
Simple Bootstrap Menu website
249 Website 6 Introduction to Bootstrap Navbars (2:02)
250 Website Planning (5:04)
251 Building HTML page Structure (10:40)
252 adding Bootstrap to a website (5:09)
253 Adding placeholder content (2:20)
254 Source Code HTML
255 Adding Default Styling (6:30)
256 Update Logo Slogan section (5:57)
257 Create a Navbar with Active element (7:07)
258 Index Page welcome message (9:29)
259 Source Code
260 Create a two column content area (3:49)
261 Create Footer Element (2:27)
262 Make it responsive (3:34)
263 Setting up font awesome (4:27)
264 Update navbar to be responsive (4:05)
265 JavaScript to Hide and Show Elements (5:48)
266 Source Navbar 1
267 Create another responsive Navbar (11:59)
268 Source Navbar 2
269 How to add Bootstrap JavaScript Library (3:19)
270 Add Bootstrap Menu NavBar (8:45)
271 Bootstrap Menu Navbar (5:56)
272 Source Navbar Bootstrap
273 Create website pages (4:33)
274 Online Code Editor (2:03)
275 Links and Resources
276 Website 6 Conclusion (1:34)
229 Website 5 Columns Introduction
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock