English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 729 lectures (74h 12m) | 77.83 GB
10 Hours of React just added. Become a Developer With ONE course – HTML, CSS, JavaScript, React, Node, MongoDB and More!
When you’re learning to program you often have to sacrifice learning the exciting and current technologies in favor of the “beginner friendly” classes. With this course, you get the best of both worlds. This is a course designed for the complete beginner, yet it covers some of the most exciting and relevant topics in the industry.
Throughout the brand new version of the course we cover tons of tools and technologies including:
- HTML5
- CSS3
- Flexbox
- Responsive Design
- JavaScript (all 2022 modern syntax, ES6, ES2018, etc.)
- Asynchronous JavaScript – Promises, async/await, etc.
- AJAX and single page apps
- Bootstrap 4 and 5 (alpha)
- SemanticUI
- Bulma CSS Framework
- DOM Manipulation
- Unix(Command Line) Commands
- NodeJS
- NPM
- ExpressJS
- Templating
- REST
- SQL vs. NoSQL databases
- MongoDB
- Database Associations
- Schema Design
- Mongoose
- Authentication From Scratch
- Cookies & Sessions
- Authorization
- Common Security Issues – SQL Injection, XSS, etc.
- Developer Best Practices
- Deploying Apps
- Cloud Databases
- Image Upload and Storage
- Maps and Geocoding
What you’ll learn
- The ins and outs of HTML5, CSS3, and Modern JavaScript for 2021
- Make REAL web applications using cutting-edge technologies
- Create responsive, accessible, and beautiful layouts
- Recognize and prevent common security exploits like SQL-Injection & XSS
- Continue to learn and grow as a developer, long after the course ends
- Create a blog application from scratch using Node, Express, and MongoDB.
- Create a complicated yelp-like application from scratch
- Deploy your applications and work with cloud databases
- Create static HTML and CSS portfolio sites and landing pages
- Think like a developer. Become an expert at Googling code questions!
- Create complex HTML forms with validations
- Implement full authentication from scratch!
- Use CSS Frameworks including Bootstrap 5, Semantic UI, and Bulma
- Implement responsive navbars on websites
- Use JavaScript variables, conditionals, loops, functions, arrays, and objects
- Write Javascript functions, and understand scope and higher order functions
- Master the “weird” parts of JavaScript
- Create full-stack web applications from scratch
- Manipulate the DOM with vanilla JS
- Write JavaScript based browser games
- Use Postman to monitor and test APIs
- Use NodeJS to write server-side JavaScript
- Write complex web apps with multiple models and data associations
- Write a REAL application using everything in the course
- Use Express and MongoDB to create full-stack JS applications
- Use common JS data structures like Arrays and Objects
- Master the command line interface
- Use NPM to install all sorts of useful packages
- Understand the ins and outs of HTTP requests
- Create your own Node modules
- Make a beautiful, responsive photographer’s portfolio page
- Create a beautiful, responsive landing page for a startup
- Implement user authentication
- Create a beautiful animated todo list application
- Create single page applications with AJAX
Table of Contents
Course Orientation
1 Welcome To The Course!
2 Joining The Community Chat & Groups
3 Curriculum Walkthrough
4 When Was The Course Last Updated
5 Course Change Log
6 Will I Get A Job
7 Accessing Course Code & Slides
8 Tips On The Interactive Coding Exercises
9 Course Coding Exercise Solutions
10 Migrating From The Old Version Of This Course
An Introduction to Web Development
11 What Matters In This Section
12 The Internet in 5 Minutes
13 Intro to the Web
14 The RequestResponse Cycle
15 Front-End and Back-End
16 What do HTMLCSSJS do
17 Setting Up Our Developer Environment
18 OPTIONAL VSCode Theme
HTML The Essentials
19 What Matters In This Section
20 Introduction to HTML
21 Our Very First HTML Page
22 TIP Mozilla Developer Network
23 Paragraph Elements
24 Heading Elements
25 Pangolin Practice
26 Introduction to the Chrome Inspector
27 HTML Boilerplate
28 VSCode Tip Auto-format
29 List Elements
30 Favorite Movies Exercises
31 Anchor Tags
32 Images
33 Comments
34 Wolf Images & Links Exercise
HTML Next Steps & Semantics
35 What Matters In This Section
36 What Exactly Is HTML5
37 Block vs. Inline Elements – Divs and Spans
38 An Odd Assortment of Elements HR, BR, Sup, & Sub
39 Entity Codes
40 Snowman Logo Exercise
41 Intro to Semantic Markup
42 Playing With Semantic Elements
43 Screen Reader Demonstration
44 VSCode Tip Emmet
HTML Forms & Tables
45 What Matters In This Section
46 Unit Goals
47 Introducing HTML Tables
48 Tables TR, TD, and TH Elements
49 Tables Thead, Tbody, and Tfoot Elements
50 Tables Colspan & Rowspan
51 Table Practice Exercise
52 The Form Element
53 Common Input Types
54 The All-Important Label
55 HTML Buttons
56 The Name Attribute
57 Hijacking Google & Reddit_s Search
58 Radio Buttons, Checkboxes, & Selects
59 Range & Text Area
60 Forms Practice Exercise
61 HTML5 Form Validations
62 Creating A Marathon Registration Form Intro
63 Creating A Marathon Registration Form Solution
CSS The Very Basics
64 What Matters In This Section
65 What is CSS
66 CSS is Huge, Don_t Panic!
67 Including Styles Correctly
68 Color & Background-Color Properties
69 Our First CSS Exercise
70 Colors Systems RGB & Named Colors
71 Colors Systems Hexadecimal
72 A Reminder On Semicolons & CSS
73 Common Text Properties
74 Font Size Basics With Pixels
75 The Font Family Property
76 Hipster Logo Exercise
The World of CSS Selectors
77 What Matters In This Section
78 Universal & Element Selectors
79 The ID Selector
80 The Class Selector
81 Basic Selectors Practice
82 The Descendant Selector
83 Descendant Combinator Practice
84 The Adjacent & Direct-Descendant Selectors
85 The Attribute Selector
86 Pseudo Classes
87 Checkerboard Exercise
88 Pseudo Elements
89 The CSS Cascade
90 WTF is Specificity
91 TIP Chrome Dev Tools & CSS
92 Inline Styles & Important
93 CSS Inheritance
The CSS Box Model
94 What Matters In This Section
95 Box Model Width & Height
96 Box Model Border & Border-Radius
97 Box Model Practice
98 Box Model Padding
99 Box Model Margin
100 The Display Property
101 CSS Units Revisited
102 CSS Units ems
103 CSS Units rems
Other Assorted Useful CSS Properties
104 What Matters In This Section
105 Opacity & The Alpha Channel
106 The Position Property
107 CSS Transitions (yay!)
108 The Power of CSS Transforms
109 Fancy Button Hover Effect CodeAlong
110 The Truth About Background
111 Google Fonts is Amazing
112 IMPORTANT REMINDER How To Find And Download Course Code
113 Photo Blog CodeAlong Pt. 1
114 Photo Blog CodeAlong Pt. 2
Responsive CSS & Flexbox
115 What Matters In This Section
116 What on Earth Is Flexbox
117 Flex-Direction
118 Justify-Content
119 Flex-Wrap
120 Align-Items
121 Align-Content & Align-Self
122 Flex-Basis, Grow, & Shrink
123 Flex Shorthand
124 Responsive Design & Media Queries Intro
125 The Power of Media Queries
126 NOTE Fixing The Code Order In The Next Lecture
127 Building a Responsive Nav
Pricing Panel Project
128 Pricing Panel CodeAlong Pt. 1
129 Pricing Panel CodeAlong Pt. 2
130 Pricing Panel CodeAlong Pt. 3
131 Pricing Panel CodeAlong Pt. 4
132 Pricing Panel CodeAlong Pt. 5
133 Pricing Panel CodeAlong Pt. 6
CSS Frameworks Bootstrap
134 What Matters In This Section
135 WTF Is Bootstrap
136 Including Bootstrap & Containers
137 Bootstrap Buttons
138 Bootstrap Typography & Utilities
139 Badges, Alerts, & Button Groups
140 Bootstrap Basics Practice
141 Intro to the Bootstrap Grid
142 Bootstrap Grid Practice
143 Responsive Bootstrap Grids
144 Useful Grid Utilities
145 Bootstrap & Forms
146 Bootstrap Navbars
147 Bootstrap Icons!
148 Other Bootstrap Utilities
149 A Mixed Bag of Other Bootstrap Stuff
OPTIONAL Museum Of Candy Project
150 Watch This First! (it_s short)
151 Museum of Candy Project Part 1
152 NOTE ABOUT THE NEXT VIDEO!
153 Museum of Candy Project Part 2
154 Museum of Candy Project Part 3
155 Museum of Candy Project Part 4
156 Museum of Candy Project Part 5
JavaScript Basics!
157 What Matters In This Section
158 Why JavaScript is Awesome
159 Primitives & The Console
160 JavaScript Numbers
161 WTF is NaN
162 Quick Numbers Quiz
163 Variables & Let
164 Our First Variables Exercise
165 Updating Variables
166 Increment Operator Explanation i++ vs ++i
167 Const & Var
168 Our First Constants Exercise
169 Booleans
170 Variable Naming and Conventions
JavaScript Strings and More
171 What Matters In This Section
172 Introducing Strings
173 Our First String Variables Practice
174 Indices & Length
175 String Methods
176 String Methods Practice
177 String Methods With Arguments
178 More String Methods Practice
179 String Template Literals -SUPER USEFUL
180 Undefined & Null
181 Random Numbers & The Math Object
182 String Template Literal Exercise
JavaScript Decision Making
183 What Matters In This Section
184 Decision Making With Code
185 Comparison Operators
186 Equality Triple Vs. Double Equals
187 Console, Alert, & Prompt
188 Running JavaScript From A Script!
189 If Statements
190 Our First Conditional Exercise
191 Else-If
192 Else
193 getColor Conditional Exercise
194 Nesting Conditionals
195 Nested Conditionals Practice
196 Truth-y & False-y Values
197 Logical AND
198 Logical AND Mystery Exercise
199 Logical OR
200 Logical NOT
201 The Switch Statement Is…A Lot
JavaScript Arrays
202 What Matters In This Section
203 Introducing Arrays
204 Lotto Numbers Exercise
205 Array Random Access
206 Array Access Exercise
207 Push & Pop
208 Shift & Unshift
209 PushPopShiftUnshift Practice
210 Concat, indexOf, includes & reverse
211 Slice & Splice
212 Reference Types & Equality Testing
213 Arrays + Const
214 Multi-Dimensional Arrays
215 Nested Arrays Exercise
JavaScript Object Literals
216 What Matters In This Section
217 Introducing Object Literals
218 Creating Object Literals
219 Our First Object Exercise
220 Accessing Data Out Of Objects
221 Object Access Exercise
222 Modifying Objects
223 Nesting Arrays & Objects
Repeating Stuff With Loops
224 What Matters In This Section
225 Intro to For Loops
226 Our First For Loop Practice
227 More For Loops Examples
228 More For Loops Practice
229 The Perils Of Infinite Loops (
230 Looping Over Arrays
231 Iterating Arrays Exercise
232 Nested Loops
233 Another Loop The While Loop
234 The Break Keyword
235 Writing a Guessing Game
236 Guessing Game Explanation And Bug Fixes
237 The Lovely For…Of Loop
238 For…Of Practice
239 Iterating Over Objects
240 Todo List Project Intro
241 Todo List Project CodeAlong
NEW Introducing Functions
242 What Matters In This Section
243 Intro to Functions
244 Our Very First Function
245 Heart Function Exercise
246 Arguments Intro
247 Rant Exercise
248 Functions With Multiple Arguments
249 Multiple Args Exercise
250 The Return Keyword
251 Return Value Practice
252 isShortsWeather Function
253 Last Element Exercise
254 Capitalize Exercise
255 Sum Array Exercise
256 Days Of The Week Exercise
Leveling Up Our Functions
257 What Matters In This Section
258 Function Scope
259 Block Scope
260 Lexical Scope
261 Function Expressions
262 Function Expression Exercise
263 Higher Order Functions
264 Returning Functions
265 Defining Methods
266 Methods Exercise
267 The Mysterious Keyword _this_
268 Egg Laying Exercise
269 Using TryCatch
Callbacks & Array Methods
270 What Matters In This Section
271 What Is This Section Even About!
272 The forEach Method
273 The map Method
274 Map Practice
275 Intro to Arrow Functions
276 Arrow Function Exercise
277 Arrow Function Implicit Returns
278 Arrow Functions Wrapup
279 setTimeout and setInterval
280 The filter Method
281 Filter Exercise
282 Some & Every Methods
283 SomeEvery Exercise
284 The Notorious Reduce Method
285 Arrow Functions & _this_
Newer JavaScript Features
286 What Matters In This Section
287 Default Params
288 Spread in Function Calls
289 Spread with Array Literals
290 Spread with Objects
291 Rest Params
292 Destructuring Arrays
293 Destructuring Objects
294 Destructuring Params
Introducing The World Of The DOM
295 What Matters In This Section
296 Introducing the DOM
297 The Document Object
298 getElementById
299 getElementById Practice
300 getElementsByTagName & className
301 querySelector & querySelectorAll
302 querySelector Practice
303 innerHTML, textContent, & innerText
304 Pickles Exercise
305 Attributes
306 Manipulating Attributes Practice
307 Changing Styles
308 Magical Forest Circle Exercise
309 Rainbow Text Exercise
310 ClassList
311 ClassList Practice
312 Traversing ParentChildSibling
313 Append & AppendChild
314 Button Insanity Exercise
315 removeChild & remove
316 Pokemon Sprites Demo
The Missing Piece DOM Events
317 What Matters In This Section
318 Intro to Events
319 Inline Events
320 Know Thy Enemy Exercise
321 The Onclick Property
322 addEventListener
323 Click Events Exercise
324 Random Color Exercise
325 Events & The Keyword This
326 Keyboard Events & Event Objects
327 NEW VERSION Form Events & PreventDefault
328 NEW VERSION Practice With Form Events & PreventDefault
329 ORIGINAL VERSION Form Events & PreventDefault
330 Form Events Exercise
331 Input & Change Events
332 Input Event Practice
333 Event Bubbling
334 Event Delegation
Score Keeper CodeAlong
335 Score Keeper Pt. 1
336 Score Keeper Pt. 2
337 Score Keeper Pt. 3 With Bulma
338 Score Keeper Pt. 4 Refactoring
Async JavaScript Oh Boy!
339 What Matters In This Section
340 The Call Stack
341 WebAPIs & Single Threaded
342 Callback Hell (
343 Demo fakeRequest Using Callbacks
344 Demo fakeRequest Using Promises
345 The Magic Of Promises
346 Creating Our Own Promises
347 The Async Keyword
348 The Await Keyword
349 Handling Errors In Async Functions
AJAX and API_s
350 What Matters In This Section
351 Intro to AJAX
352 Intro to APIs
353 WTF is JSON
354 Using Hoppscotch (or Postman)
355 HTTP Verbs
356 HTTP Status Codes
357 Understanding Query Strings
358 HTTP Headers
359 Making XHRs
360 Using The Fetch API
361 Introducing Axios
362 Setting Headers With Axios
363 TV Show Search App
Prototypes, Classes, & OOP
364 What Matters In This Section
365 What On Earth Are Prototypes
366 Intro to Object Oriented Programming
367 Factory Functions
368 Constructor Functions
369 JavaScript Classes
370 More Classes Practice
371 Extends and Super Keywords
Mastering The Terminal
372 What Matters In This Section
373 Backend Overview
374 A Pep Talk On Terminal
375 Why Do We Need To Know Terminal Commands
376 Windows Terminal Installation Instructions
377 The Basics LS & PWD
378 Changing Directories
379 Relative Vs. Absolute Paths
380 Making Directories
381 Man Pages & Flags
382 The Touch Command
383 Removing Files & Folders
Our First Brush With Node
384 What Matters In This Section
385 Introducing Node JS
386 What Is Node Used For
387 Installing Node
388 The Node REPL
389 Running Node Files
390 Process & Argv
391 IMPORTANT NOTE fs.writeFileSync Changes
392 File System Module Crash Course
Exploring Modules & The NPM Universe
393 What Matters In This Section
394 Working With module.exports
395 Requiring A Directory
396 Introducing NPM
397 Installing Packages – Jokes & Rainbow
398 Adding Global Packages
399 The All-Important Package.json
400 Installing All Dependencies For A Project
401 IMPORTANT NOTE Fixing Issues — Language Guesser Challenge
402 Language Guesser Challenge
Creating Servers With Express
403 What Matters In This Section
404 Introducing Express
405 Our Very First Express App
406 The Request & Response Objects
407 Express Routing Basics
408 Express Path Parameters
409 Working With Query Strings
410 Auto-Restart With Nodemon
Creating Dynamic HTML With Templating
411 What Matters In This Section
412 What is Templating
413 Configuring Express For EJS
414 Setting The Views Directory
415 EJS Interpolation Syntax
416 Passing Data To Templates
417 Subreddit Template Demo
418 Conditionals in EJS
419 Loops In EJS
420 A More Complex Subreddit Demo
421 Serving Static Assets In Express
422 Bootstrap + Express
423 EJS & Partials
Defining RESTful Routes
424 What Matters In This Section
425 Get Vs. Post Requests
426 Defining Express Post Routes
427 Parsing The Request Body
428 Intro to REST
429 RESTful Comments Overview
430 RESTful Comments Index
431 RESTful Comments New
432 Express Redirects
433 RESTful Comments Show
434 The UUID Package
435 RESTful Comments Update
436 Express Method Override
437 RESTful Comments Delete
Our First Database MongoDB
438 What Matters In This Section
439 Introduction to Databases
440 SQL Vs. NoSQL Databases
441 Why We_re Learning Mongo
442 Installing Mongo MacOS
443 Installing Mongo Windows Installation Tutorial
444 IMPORTANT NOTE About The Mongo Shell
445 The Mongo Shell
446 What On Earth Is BSON
447 Inserting With Mongo
448 Finding With Mongo
449 Updating With Mongo
450 Deleting With Mongo
451 Additional Mongo Operators
Connecting To Mongo With Mongoose
452 What Matters In This Section
453 What is Mongoose
454 A note about solving mongoose connection issues
455 Connecting Mongoose to Mongo
456 A note about the node .load index.js command issue
457 Our First Mongoose Model
458 Insert Many
459 Finding With Mongoose
460 Updating With Mongoose
461 Deleting With Mongoose!
462 Mongoose Schema Validations
463 Additional Schema Constraints
464 Validating Mongoose Updates
465 Mongoose Validation Errors
466 Model Instance Methods
467 Adding Model Static Methods
468 Mongoose Virtuals
469 Defining Mongoose Middleware
Putting It All Together Mongoose With Express
470 What Matters In This Section
471 Express + Mongoose Basic Setup
472 Creating Our Model
473 Products Index
474 Product Details
475 Creating Products
476 Updating Products
477 Tangent On Category Selector
478 Deleting Products
479 BONUS Filtering By Category
YelpCamp Campgrounds CRUD
480 Introducing YelpCamp Our Massive Project
481 How to Access YelpCamp Code
482 Creating the Basic Express App
483 Campground Model Basics
484 Seeding Campgrounds
485 Campground Index
486 Campground Show
487 Campground New & Create
488 Campground Edit & Update
489 Campground Delete
Middleware The Key To Express
490 What Matters In This Section
491 Intro to Express Middleware
492 Using Morgan – Logger Middleware
493 Defining Our Own Middleware
494 More Middleware Practice
495 Setting Up A 404 Route
496 Password Middleware Demo (NOT REAL AUTH)
497 Protecting Specific Routes
YelpCamp Adding Basic Styles
498 A New EJS Tool For Layouts
499 Bootstrap5! Boilerplate
500 Navbar Partial
501 Footer Partial
502 IMPORTANT NOTE About Adding Images — FIX FOR SEEDED IMAGES NOT WORKING
503 Adding Images
504 Styling Campgrounds Index
505 Styling The New Form
506 Styling Edit Form
507 Styling Show Page
Handling Errors In Express Apps
508 What Matters In This Section
509 Express_ Built-In Error Handler
510 Defining Custom Error Handlers
511 Our Custom Error Class
512 Handling Async Errors
513 Handling More Async Errors!
514 Defining An Async Utility
515 Differentiating Mongoose Errors
YelpCamp Errors & Validating Data
516 Where To Next With YelpCamp
517 Client-Side Form Validations
518 Basic Error Handler
519 Defining ExpressError Class
520 More Errors
521 Defining Error Template
522 JOI Schema Validations
523 JOI Validation Middleware
Data Relationships With Mongo
524 What Matters In This Section
525 Introduction to Mongo Relationships
526 SQL Relationships Overview
527 Note Solving an upcoming code issue with mongoose version 7
528 One to Few
529 One to Many
530 Mongoose Populate
531 One to Bajillions
532 Mongo Schema Design
Mongo Relationships With Express
533 What Matters In This Section
534 Defining Our Farm & Product Models
535 Note about Farm model
536 Creating New Farms
537 Farms Show Page
538 Creating Products For A Farm
539 Finishing Touches
540 Deletion Mongoose Middleware
YelpCamp Adding The Reviews Model
541 Defining The Review Model
542 Adding The Review Form
543 Creating Reviews
544 Validating Reviews
545 Displaying Reviews
546 Styling Reviews
547 Deleting Reviews
548 Campground Delete Middleware
Express Router & Cookies
549 What Matters In This Section
550 Express Router Intro
551 Express Router & Middleware
552 Introducing Cookies
553 Sending Cookies
554 Cookie Parser Middleware
555 Signing Cookies
556 OPTIONAL HMAC Signing
Express Session & Flash
557 What Matters In This Section
558 Introduction to Sessions
559 Express Session
560 More Express Session
561 Intro to Flash
562 Res.locals & Flash
YelpCamp Restructuring & Flash
563 Breaking Out Campground Routes
564 Breaking Out Review Routes
565 Serving Static Assets
566 Configuring Session
567 Setting Up Flash
568 Flash Success Partial
569 Flash Errors Partial
Authentication From Scratch
570 What Matters In This Section
571 Authentication Vs. Authorization
572 How to (not) Store Passwords
573 Cryptographic Hashing Functions
574 Password Salts
575 Intro to Bcrypt
576 Auth Demo Setup
577 Auth Demo Registering
578 Auth Demo Login
579 Auth Demo Staying Logged In With Session
580 Auth Demo Logout
581 Auth Demo Require Login Middleware
582 Auth Demo Refactoring To Model Methods
YelpCamp Adding In Authentication
583 Introduction to Passport
584 Creating Our User Model
585 Configuring Passport
586 Register Form
587 Register Route Logic
588 Login Routes
589 isLoggedIn Middleware
590 IMPORTANT Fixing Logout
591 Adding Logout
592 currentUser Helper
593 Fixing Register Route
594 IMPORTANT Passport.js Updates — Fixing The returnToRedirect Issue
595 ReturnTo Behavior
YelpCamp Basic Authorization
596 Adding an Author to Campground
597 Showing and Hiding EditDelete
598 Campground Permissions
599 Authorization Middleware
600 Reviews Permissions
601 More Reviews Authorization
YelpCamp Controllers & Star Ratings
602 Refactoring To Campgrounds Controller
603 Adding a Reviews Controller
604 A Fancy Way To Restructure Routes
605 Displaying Star Ratings
606 Star Rating Form
YelpCamp Image Upload
607 Intro To Image Upload Process
608 The Multer Middleware
609 Cloudinary Registration
610 Environment Variables with dotenv
611 IMPORTANT NOTE Fixing npm install Issues In The Next Lecture
612 Uploading To Cloudinary Basics
613 Storing Uploaded Image Links In Mongo
614 Displaying Images In A Carousel
615 Fixing Our Seeds
616 Adding Upload to Edit Page
617 Customizing File Input
618 A Word Of Warning!
619 Deleting Images Form
620 Deleting Images Backend
621 Adding a Thumbnail Virtual Property
YelpCamp Adding Maps
622 YelpCamp Maps MapTiler — Replacement for Mapbox
623 Registering For Mapbox
624 Geocoding Our Locations
625 Working With GeoJSON
626 Displaying A Map
627 Centering The Map On A Campground
628 Fixing Our Seeds Bug
629 Customizing Map Popup
YelpCamp Fancy Cluster Map
630 Intro To Our Cluster Map
631 Adding Earthquake Cluster Map
632 Reseeding Our Database (again)
633 Basic Clustering Campgrounds
634 Tweaking Clustering Code
635 Changing Cluster Size and Color
636 Adding Custom Popups
YelpCamp Styles Clean Up
637 Styling Home Page
638 Additional Home Page Styling
639 Styling Login Form
640 Styling Register Form
641 Spacing Campgrounds
642 Removing Inline Map Styles
643 Adding Map Controls
YelpCamp Common Security Issues
644 Mongo Injection
645 Cross Site Scripting (XSS)
646 Sanitizing HTML w JOI
647 Minor Changes to SessionCookies
648 Hiding Errors
649 IMPORTANT Helmet Updates — Fixing Issues
650 Using Helmet
651 NOTE! If you switched from Mapbox to MapTiler Cloud for maps in YelpCamp
652 Content Security Policy Fun
YelpCamp Deploying
653 Setting Up Mongo Atlas
654 IMPORTANT connect-mongo — Handling Updates
655 Using Mongo For Our Session Store
656 Render — A free alternative for deploying your app
657 Heroku Setup
658 Pushing to Heroku
659 Fixing Heroku Errors
660 Configuring Heroku Env Variables
Introducing React
661 How The React Content Works
662 React Content Slides
663 Introducing React
664 Setting Up Code Sand Box
665 The Basics of JSX
666 Basic React App Structure
667 Our First React Component
JSX In Detail
668 Importing and Exporting Components
669 The Rules of JSX
670 React Fragments
671 Evaluating JS Expressions in JSX
672 Creating. a Die Component
673 Component Decomposition
674 Styling Components
675 Random PokeCard Exercise
676 GET THE POKEMON IMAGE URL HERE
Local React Apps With Vite
677 Creating React Apps With Vite
678 A Note About Create React App
679 A Tour of A Vite App
Working With Props
680 Introducing Props
681 Non-String Props
682 Setting Default Prop Values
683 Passing Arrays and Objects
684 React Conditionals
685 The React Developer Tools
686 Adding Dynamic Component Styles
687 Rendering Arrays With Map
688 Slot Machine Exercise
Shopping List Demo keys, prop types, and more!
689 Creating A Shopping List Component
690 The Key Prop
691 The Shopping List Item Component
692 Rental Property Exercise
693 Rental Properties Exercise STARTER DATA
694 Configuring ESLint
695 PropTypes Library Crash Course
React Events
696 Intro to React Events
697 Non-Click Events
698 Working With The Event Object
699 Clicker Exercise
The Basics of React State
700 Introducing State
701 Working With The useState() Hook
702 Creating a Toggler Component
703 Multiple Pieces of State In A Component
704 useState() and Rendering
705 Color Box Exercise INTRO
706 Color Box Exercise SOLUTION
Intermediate State Concepts
707 Setting State With An Updater Function
708 State Initializer Functions
709 When Does React Re-Render
710 Working With Objects In State
711 Arrays In State
712 Generating Ids with UUID
713 Deleting From Arrays The React Way
714 Common Array Updating Patterns
715 Updating All Elements In An Array
716 Score Keeper Exercise
Component Design
717 Introducing The Lucky7 Game
718 Formulating Our Component Gameplan
719 Building Die and Dice Components
720 The LuckyN Component
721 State As Props
722 Passing Functions As Props
723 Passing Functions That Update State
724 Practice Passing State Updating Functions
React Forms
725 Controlled Components
726 The htmlFor Property
727 Working With Multiple Inputs
728 A Better Signup Form
729 Computed Property Names in HandleChange()
730 Creating a Shopping List Form
731 Shopping List Component
732 Finishing The Shopping List Component
733 Form Validation From Scratch
734 Validations using React Hook Form
Effects
735 Introducing Effects
736 The useEffect Hook
737 useEffect Dependencies
738 Fetching Initial Data From an API
739 Adding a Loader
740 Github Profile Search
Material UI
741 Introducing Material UI
742 Installing Material UI
743 The Rating Component
744 Material Forms
745 The SX Prop and Custom Styles
Building a Todo List With Material UI & Local Storage
746 Creating The Application
747 The TodoList Component
748 Removing Todos
749 Toggling Todos
750 The New Todo Form
751 Adding LocalStorage
752 Tweaking the Todo Icons and Ids
753 Final Styles
BONUS Fancy, More Advanced Todolist
754 Check Out This Fancy Todo List
The End (
755 What_s Next and Goodbye!
LEGACY CONTENT (The Old Version Of This Course)
756 LEGACY Download Introduction To This Course
757 LEGACY Download Introduction To Front End Development
758 LEGACY Download Introduction to HTML
759 LEGACY Download Intermediate HTML
760 LEGACY Download Introduction to CSS
761 LEGACY Download Intermediate CSS
762 LEGACY Download Bootstrap
763 LEGACY Download Bootstrap 4
764 LEGACY Download Bootstrap 4 Flexbox & Layout
765 LEGACY Download Introduction to JavaScript
766 LEGACY Download JavaScript Basics Control Flow
767 LEGACY Download JavaScript Basics Functions
768 LEGACY Download JavaScript Basics Arrays
769 LEGACY Download JavaScript Basics Objects
770 LEGACY Download DOM Manipulation
771 LEGACY Download Advanced DOM Manipulation
772 LEGACY Download Color Game Project
773 LEGACY Download Intro to jQuery
774 LEGACY Download Advanced jQuery
775 LEGACY Download Todo List Projects
776 LEGACY Download Patatap Clone
777 LEGACY Download Backend Basics
778 LEGACY Download The Command Line
779 LEGACY Download Node JS
780 LEGACY Download Server Side Frameworks
781 LEGACY Download Intermediate Express
782 LEGACY Download Working With APIs
783 LEGACY Download YelpCamp Basics
784 LEGACY Download Databases
785 LEGACY Download YelpCamp Data Persistence
786 LEGACY Download RESTful Routing
787 LEGACY Download Data Associations
788 LEGACY Download YelpCamp Comments
789 LEGACY Download Authentication
790 LEGACY Download YelpCamp Adding Authentication
791 LEGACY Download YelpCamp Cleaning Up
Resolve the captcha to access the links!