100 天编程 - 2024 年 Web 开发训练营
上次更新时间：2024-11-26
课程售价: 2.9 元
联系右侧微信客服充值或购买课程
课程内容
01 - Introduction [Day 1]
- 001 Welcome to This Course! [Day 1] (免费)
- 002 What Is Web Development _ How Does The Web Work [Day 1] (免费)
- 003 The Three Key Programming Languages [Day 1]
- 004 How The Web Works A Deep Dive [Day 1]
- 006 The 100 Days of Code Challenge! [Day 1]
- 007 How To Get The Most Out Of This Course [Day 1]
- 008 Stuck in the Course We Got you Covered! [Day 1]
02 - Building a First Website HTML _ CSS Basics [Days 1 - 5]
- 001 Module Introduction [Day 1]
- 002 How to Create a Website [Day 1]
- 003 Creating our First HTML Page [Day 1]
- 004 Setting Up a Development Environment [Day 2]
- 005 Why Visual Studio Code [Day 2]
- 006 Understanding HTML Elements [Day 2]
- 007 Which HTML Elements Exist [Day 2]
- 008 Adding Another HTML Element [Day 2]
- 009 Exploring HTML Attributes [Day 2]
- 011 Getting Started with CSS (Day 2)
- 012 More CSS Styling [Day 2]
- 013 Working with Colors [Day 3]
- 014 Formatting our Code [Day 3]
- 015 Working with the Browser Developer Tools [Day 3]
- 016 Adding a Link [Day 3]
- 017 You can Nest HTML Elements! [Day 3]
- 018 Using Global CSS Styles [Day 3]
- 020 The HTML Document Skeleton _ Metadata [Day 3]
- 021 Visual Studio Code Shortcuts _ Tricks [Day 3]
- 023 First Summary [Day 3]
- 025 Styling the Anchor Element Also with Pseudo Hover [Day 4]
- 026 Why it_s Called Cascading Style Sheets [Day 4]
- 027 Storing CSS Code in External Files [Day 4]
- 028 The Void Element Syntax [Day 4]
- 029 Multiple Files _ Requests [Day 4]
- 030 Selecting Single Elements with the ID Selector [Day 4]
- 031 Working with font-size and px [Day 4]
- 032 Using Other Fonts from Google Fonts [Day 4]
- 034 Adding an Image [Day 5]
- 035 Styling the Image _ Using the Body Tag [Day 5]
- 036 Styling the Overall Page Background [Day 5]
- 037 Adding a Second HTML File [Day 5]
- 040 Using a Shared CSS File [Day 5]
- 041 Organizing Source Files in Folders [Day 5]
- 042 Summary [Day 5]
03 - Diving Deeper Into HTML _ CSS [Days 6 - 8]
- 001 Module Introduction [Day 6]
- 002 Using the Live Server Extension [Day 6]
- 004 Understanding Lists [Day 6]
- 005 Creating Lists [Day 6]
- 006 Understanding Parents, Children, Containers _ More [Day 6]
- 007 Understanding Cascading, Inheritance _ Specificity [Day 6]
- 008 Styling the Full Week Page [Day 6]
- 009 Introducing the CSS Box Model [Day 7]
- 010 Using the CSS Box Model [Day 7]
- 011 Creating HTML Layouts [Day 7]
- 012 Theory Selectors _ Combinators [Day 7]
- 013 Using Selectors _ Combinators [Day 7]
- 014 Understanding Classes [Day 7]
- 015 Block vs Inline Elements [Day 7]
- 016 Styling Differences Between Block _ Inline Elements [Day 8]
- 017 Understanding Margin Collapsing [Day 8]
- 018 The box-shadow Property [Day 8]
- 019 Your Challenge! [Day 8]
- 020 Creating the HTML Layout [Day 8]
- 021 Styling the Main Section [Day 8]
- 022 Styling Images _ Working with Negative Margins [Day 8]
- 023 Finishing Touches [Day 8]
- 024 Module Summary [Day 8]
04 - HTML _ CSS - Practice _ Summary [Days 9 - 10]
- 001 Module Introduction [Day 9]
- 002 Your Task! [Day 9]
- 003 Creating the Core Structure [Day 9]
- 004 Adding the Header Content [Day 9]
- 005 Adding Header Styling [Day 9]
- 006 Spacing _ the CSS Box Model [Day 9]
- 007 Adding the Main Content [Day 9]
- 008 Styling the Main Content [Day 10]
- 009 Styling List Items _ Links [Day 10]
- 010 Adding the Footer [Day 10]
- 011 Introducing New HTML Elements [Day 10]
- 012 Organizing our Files [Day 10]
- 013 Module Summary [Day 10]
05 - Serving A Website (Hosting _ Deployment) [Day 11]
06 - Introducing Version Control with Git _ GitHub [Days 11 - 14]
- 001 Module Introduction [Day 11]
- 002 What are Git _ GitHub [Day 11]
- 003 Command Line Interface (CLI) vs Graphical User Interface (GUI) [Day 11]
- 004 Optional MacOS Terminal (z Shell) Crash Course [Day 11]
- 005 Optional Windows Command Prompt (cmd) Crash Course [Day 12]
- 006 Git MacOS Installation [Day 12]
- 007 Git Windows Installation [Day 12]
- 008 Understanding the Git Basics [Day 12]
- 009 Initializing the Repository _ Creating our First Commit [Day 12]
- 011 Understanding Branches, Merging _ Fixing Merge Conflicts [Day 13]
- 012 Deleting Branches _ Commits, Reverting Staged _ Unstaged Changes [Day 13]
- 013 Onwards to GitHub - What _ Why [Day 13]
- 014 Creating a GitHub Account _ a Remote Repository [Day 13]
- 016 Understanding the Personal Access Token _ git clone [Day 14]
- 017 Collaborating on Projects - Collaborators _ Organizations [Day 14]
- 018 Contributing to Projects - Forks _ Pull Requests [Day 14]
- 019 Wrap Up [Day 14]
07 - Understanding HTML _ CSS Layouts _ Positioning [Days 15 - 20]
- 001 Module Introduction [Day 15]
- 002 Project Overview - What we Will Build [Day 15]
- 003 Project Setup [Day 15]
- 004 Creating the Landing Page Structure [Day 15]
- 005 Adding the Page Logo [Day 15]
- 006 Adding the Page Navigation [Day 15]
- 007 Introducing CSS Flexbox [Day 15]
- 008 Aligning Flex Items [Day 15]
- 009 Your Flexbox Challenge! [Day 16]
- 010 Adding Flexbox to our Project [Day 16]
- 011 Adding a Background Image [Day 16]
- 012 Creating a Container for the Hero-Content [Day 16]
- 013 Positioning Elements [Day 16]
- 014 Styling the Hero Content [Day 16]
- 015 Understanding Fixed _ Absolute Positioning [Day 16]
- 016 Working with _ Units _ Creating a Top Navigation Bar [Day 17]
- 017 Finishing the Header [Day 17]
- 018 Introducing the Highlights Section [Day 17]
- 019 Creating the HTML Code [Day 17]
- 020 Building the Flex Container [Day 17]
- 021 Flex Item Layout [Day 17]
- 022 Styling Images with object-fit [Day 17]
- 023 Styling Text [Day 17]
- 025 Understanding Parent - Child Margin Collapsing [Day 18]
- 026 Working with CSS Functions - Linear Gradients [Day 18]
- 027 The Next Step [Day 18]
- 028 Creating a Footer Section [Day 18]
- 029 Styling the Footer [Day 18]
- 030 Places Page - Overview _ Preparations [Day 18]
- 031 Creating the Card Content [Day 18]
- 032 Using position static [Day 18]
- 033 Creating the Card Look [Day 19]
- 034 Understanding overflow _ Your Challenge! [Day 19]
- 035 Solving the Challenge [Day 19]
- 036 Creating all Cards [Day 19]
- 037 The CSS Grid - Theory [Day 19]
- 038 Understanding the nth-type Selector _ grid-template-columns [Day 19]
- 039 Your Grid Challenge [Day 20]
- 040 Working with Unicode UTF-8 [Day 20]
- 041 Finishing Touches [Day 20]
- 042 Module Summary [Day 20]
08 - Understanding Responsive Web Design [Days 20 - 24]
- 001 Module Introduction [Day 20]
- 002 Project Overview [Day 20]
- 004 Optional Your Challenge - Creating the HTML Structure [Day 20]
- 005 Optional Challenge Solution - The HTML Structure [Day 20]
- 006 Optional Styling the Header [Day 21]
- 007 Optional Styling the main Section [Day 21]
- 008 What is Responsive Design [Day 21]
- 009 The Problem with Pixels [Day 21]
- 010 Introducing em _ rem [Day 21]
- 011 Applying em _ rem for the Font Size [Day 22]
- 012 Deep Dive em vs rem vs _ [Day 22]
- 013 Updating the Project Units [Day 22]
- 014 Comparing Desktop _ Mobile First Design [Day 22]
- 015 Understanding Media Queries [Day 22]
- 016 Adding Media Queries to the Project [Day 23]
- 017 Your Media Queries Challenge! [Day 23]
- 018 Side Drawer _ Hamburger Icon - Theory [Day 23]
- 019 Creating the Hamburger Button [Day 23]
- 020 Creating the Side Drawer [Day 23]
- 021 Understanding HTML Fragments [Day 23]
- 022 Understanding the Target Selector [Day 24]
- 023 Finishing the Side Drawer [Day 24]
- 025 Module Summary [Day 24]
09 - Creating Beautiful Websites [Days 24 - 25]
- 001 Module Introduction [Day 24]
- 002 Three Things to Keep in Mind [Day 24]
- 003 Introducing the Module Project [Day 24]
- 004 Sizing _ Spacing [Day 24]
- 005 Choosing the Right Font [Day 24]
- 006 Understanding The Importance of Grey, Primary _ Accent Colors [Day 24]
- 007 Introducing CSS Variables CSS Custom Properties [Day 25]
- 008 CSS Variables in Action [Day 25]
- 009 Comparing root vs html vs Selectors [Day 25]
- 010 Understanding CSS Transformations [Day 25]
- 011 Adding CSS Transitions [Day 25]
- 012 Working with SVGs [Day 25]
10 - Adding Forms To Websites [Days 26 - 29]
- 001 Module Introduction [Day 26]
- 002 What _ Why [Day 26]
- 003 Important Form HTML Elements [Day 26]
- 004 Our First Input Element [Day 26]
- 005 Adding a Button [Day 26]
- 006 The Form Element, Form Submission _ Different Types of Requests [Day 26]
- 007 Styling the Form Element [Day 27]
- 008 Adding Labels [Day 27]
- 009 More Detailed Forms Styling [Day 27]
- 010 Understanding Different Input Types [Day 27]
- 011 Understanding Email, Numbers, Password _ Date Types [Day 27]
- 012 Working with Radio Buttons [Day 27]
- 013 Using Checkboxes [Day 28]
- 014 The Textarea Element For Longer Text [Day 28]
- 015 Adding a Dropdown [Day 28]
- 016 Forms _ Semantics (Structuring Forms) [Day 28]
- 017 More on Form Buttons [Day 28]
- 018 Validation Attributes [Day 28]
- 019 More Input _ Form Attributes [Day 28]
- 020 Your Challenge! [Day 29]
- 021 Challenge Base Page Structure _ Styling [Day 29]
- 023 Challenge First Set of Input Elements [Day 29]
- 024 Challenge Adding Remaining Elements [Day 29]
- 025 Challenge Submission _ Validation [Day 29]
- 026 Challenge Styling [Day 29]
11 - Understanding the JavaScript Basics [Days 29 - 33]
- 001 Module Introduction [Day 29]
- 002 What is JavaScript _ Why would we use it [Day 29]
- 003 What You Will Learn In this Module [Day 29]
- 004 Introducing Values _ Variables [Day 29]
- 005 Adding the script HTML Element [Day 30]
- 006 Working with Values _ Basic JavaScript Commands [Day 30]
- 007 Introducing Variables (Data Containers) [Day 30]
- 008 A Closer Look At The JavaScript Syntax [Day 30]
- 009 A Second Variable _ Practice Time! [Day 30]
- 010 Outsourcing JavaScript Code Into External Files [Day 30]
- 011 Introducing Arrays (Managing Lists Of Data) [Day 30]
- 012 Introducing Objects (Grouping Related Data) [Day 30]
- 013 Splitting Code Across Multiple Lines [Day 31]
- 014 Accessing Object Properties [Day 31]
- 015 Performing Operations [Day 31]
- 016 Onwards To Custom Commands! [Day 31]
- 017 Introducing Functions [Day 31]
- 018 Functions _ Variables [Day 31]
- 019 Returning Values In Functions [Day 31]
- 020 Passing Data Into Functions With Parameters [Day 31]
- 021 Functions - A Summary [Day 31]
- 022 Time To Practice The Problem [Day 32]
- 023 Time To Practice The Solution [Day 32]
- 024 Introducing Methods [Day 32]
- 025 Making Our Developer Life Easier (Logging with console.log()) [Day 32]
- 026 Math Operations _ Working With Different Kinds Of Values [Day 32]
- 027 The Modulus Operator [Day 32]
- 028 Math Operations _ Math Rules [Day 32]
- 029 Performing String (Text) Operations [Day 32]
- 031 String Operations _ String Methods [Day 32]
- 032 Basic Array Operations [Day 33]
- 034 Module Summary [Day 33]
12 - Advanced JavaScript Working with the DOM [Days 33 - 37]
- 001 Module Introduction [Day 33]
- 002 Our Starting Setup [Day 33]
- 003 The Global window _ document Objects [Day 33]
- 004 What Is The DOM [Day 33]
- 005 Exploring The DOM [Day 33]
- 006 Drilling Into The DOM To Select _ Change HTML Elements [Day 33]
- 007 Loading Our Script Correctly [Day 33]
- 008 The DOM Tree _ DOM Traversal [Day 33]
- 009 Drilling Into The DOM _ Exploring Text Nodes [Day 34]
- 010 DOM Drilling Limitations [Day 34]
- 011 Searching The DOM For Elements [Day 34]
- 012 Querying Elements [Day 34]
- 014 Time to Practice The Problem [Day 34]
- 015 Time to Practice The Solution [Day 34]
- 016 Next Steps [Day 34]
- 017 Inserting New HTML Elements via JavaScript [Day 34]
- 018 Deleting DOM Elements [Day 35]
- 019 Moving Existing Elements Around [Day 35]
- 020 Working with innerHTML [Day 35]
- 022 Introducing Events [Day 35]
- 023 Adding a First click Event Listener [Day 35]
- 024 Listening To User Input Events [Day 35]
- 025 The event Object [Day 35]
- 027 A More Realistic Demo _ Example [Day 36]
- 028 Introducing Constant Variables (Constants) [Day 36]
- 029 Changing Element Styles With JavaScript [Day 36]
- 030 Managing CSS Classes With JavaScript [Day 36]
- 031 Module Summary [Day 36]
- 032 Time to Practice The Problem [Day 37]
- 033 Time to Practice The Solution [Day 37]
13 - Advanced JavaScript Control Structures [Days 37 - 39]
- 001 Module Introduction [Day 37]
- 002 Getting Started with Control Structures [Day 37]
- 003 Introducing Boolean Values (Booleans) _ Comparison Operators [Day 37]
- 004 Booleans _ Comparison Operators In Action [Day 37]
- 005 Using Booleans In if Statements (Conditional Code Execution) [Day 37]
- 006 A Real Example [Day 38]
- 007 Alternatives with else and else if [Day 38]
- 008 More on Boolean Values [Day 38]
- 009 Truthy _ Falsy Values [Day 38]
- 011 Introducing Loops (Repeated Code Execution) [Day 38]
- 012 The Regular for Loop [Day 38]
- 013 The for-of Loop (for Arrays) [Day 38]
- 015 The for-in Loop (for Objects) [Day 38]
- 016 The while Loop [Day 38]
- 017 Practice Time Setup _ The for Loop [Day 39]
- 018 Practice Time The for-of Loop [Day 39]
- 019 Practice Time The for-in Loop [Day 39]
- 020 Practice Time The while Loop [Day 39]
- 021 Module Summary [Day 39]
14 - Milestone Project Building a Tic-Tac-Toe Game [Days 40 - 44]
- 001 Module Introduction [Day 40]
- 002 Planning The Project [Day 40]
- 003 Creating The HTML Structure [Day 40]
- 004 Adding Base Page Styles [Day 40]
- 005 Adding Styling For The Game Configuration Area [Day 41]
- 006 Styling The Game Board [Day 41]
- 007 Adding JavaScript, Script Files _ First Event Listeners [Day 41]
- 008 Showing _ Hiding The Configuration Modal (Overlay) [Day 41]
- 009 Handling Form Submission With JavaScript [Day 42]
- 010 Validating User Input With JavaScript [Day 42]
- 011 Storing _ Managing Submitted Data [Day 42]
- 012 Adding Logic For Starting A Game [Day 43]
- 013 Managing Game Rounds (Turns) _ Field Selection [Day 43]
- 014 Tracking Selected Fields On The Game Board [Day 43]
- 015 Checking For A Winner Or Draw [Day 44]
- 016 Ending The Game _ Adding Restart Logic [Day 44]
- 017 Module Summary [Day 44]
15 - Working with Third-Party Packages [Days 45 - 46]
- 001 Module Introduction [Day 45]
- 002 What _ Why [Day 45]
- 003 Third-Party Code vs Custom Code (Your Own Code) [Day 45]
- 004 First Example Adding Bootstrap For Some Default Styling [Day 45]
- 005 Adding _ Using the Bootstrap CSS Package [Day 45]
- 006 Adding a JavaScript Package [Day 45]
- 007 Adding an Image Carousel Gallery with a Third-Party Package [Day 45]
- 008 Combining Third-Party Packages With Custom Code [Day 45]
- 009 More Bootstrap Examples [Day 45]
- 010 Exercise Solution _ First Summary [Day 45]
- 011 Another Example Preparing a Parallax Page [Day 45]
- 012 Adding A Parallax Effect Package [Day 46]
- 013 Viewing Third-Party Source Code _ Module Summary [Day 46]
16 - Onwards To Backend Development [Day 46]
17 - NodeJS Introduction - Getting Started With Backend Development [Day 47]
18 - Enhancing NodeJS with ExpressJS [Days 48 - 49]
- 001 Module Introduction [Day 48]
- 002 Installing Express with npm [Day 48]
- 003 Creating a Server with Express _ Handling Requests + Responses [Day 48]
- 004 Parsing User Data With Express [Day 48]
- 005 Storing Data in (Server-side) Files [Day 48]
- 007 Reading File Data _ Returning Dynamic Responses (Dynamic HTML Code) [Day 49]
- 008 Enhancing the Developer Workflow with nodemon [Day 49]
- 009 Summary [Day 49]
19 - More Express Static _ Dynamic Content with Templates (EJS) [Days 49 - 51]
- 001 Module Introduction [Day 49]
- 002 Creating a Starting Project _ What Needs To Change [Day 49]
- 003 Setting Up A Basic Express App (incl. Practice) [Day 49]
- 004 Serving HTML Files With Node _ Express [Day 49]
- 005 Serving Static Files (CSS _ JavaScript) [Day 50]
- 006 Parsing Form Data _ Redirecting Requests [Day 50]
- 007 Adding the EJS Template Engine [Day 50]
- 008 Rendering Dynamic Content With Templates [Day 50]
- 009 Outputting Repeated Content With EJS _ Loops [Day 50]
- 010 Rendering Conditional Content [Day 50]
- 011 Including Partial Content [Day 51]
- 012 EJS _ IDE Support [Day 51]
- 013 Module Summary [Day 51]
20 - Handling Dynamic Routes (URLs), Errors _ Manag. Bigger Express Projects [51-53]
- 001 Module Introduction [Day 51]
- 002 Introducing Dynamic Routes [Day 51]
- 003 Managing Data with Unique IDs [Day 51]
- 004 Loading _ Displaying Detail Data [Day 52]
- 005 Showing a 404 Page For Not Found Cases [Day 52]
- 006 More 404 Page Usage (Non-Existent Routes) [Day 52]
- 007 Handling Server-Side Errors (500 Status Code) [Day 52]
- 008 Working With Status Codes [Day 52]
- 009 Code Refactoring _ Adding More Functions [Day 52]
- 010 Importing _ Exporting Code In NodeJS [Day 53]
- 011 Using The Express Router To Split The Route Configuration [Day 53]
- 012 Introducing Query Parameters (_ Hidden Form Fields) [Day 53]
- 014 Module Summary [Day 53]
21 - Exploring More Advanced JavaScript Concepts [Days 54 - 56]
- 001 Module Introduction [Day 54]
- 002 Functions _ Default Parameters [Day 54]
- 003 Rest Parameters _ The Spread Operator [Day 54]
- 004 Functions Are Objects! [Day 54]
- 005 Working with Template Literals [Day 54]
- 006 Primitive vs Reference Values [Day 54]
- 007 Custom Error Handling With try catch [Day 55]
- 009 Variable Scoping _ Shadowing [Day 55]
- 011 Introducing Classes As Object Blueprints [Day 55]
- 012 Classes _ Methods (and this) [Day 55]
- 013 Destructuring Objects _ Arrays [Day 55]
- 015 Diving Into Asynchronous Code _ Callback Functions [Day 56]
- 016 Introducing Promises [Day 56]
- 017 Asynchronous Code _ Error Handling [Day 56]
- 018 Improving Code With async await [Day 56]
- 020 Module Summary [Day 56]
22 - Onwards To Databases [Days 56 - 57]
23 - SQL Databases - Introduction _ Core Concepts [Days 57 - 59]
- 001 Module Introduction [Day 57]
- 002 What _ Why [Day 57]
- 003 RDBMS Options [Day 57]
- 004 Installing MySQL _ Setup Steps [Day 57]
- 005 Database Server vs Databases vs Tables [Day 57]
- 006 Writing Our First SQL Code _ Creating a Database [Day 57]
- 007 Creating a Table _ Table Structure [Day 58]
- 008 Inserting Data Into A Table [Day 58]
- 009 Reading Data From A Table (incl. Filtering) [Day 58]
- 010 Updating _ Deleting Data [Day 58]
- 011 Designing A More Complex Database [Day 58]
- 012 Adding A New Table [Day 58]
- 013 Implementing A More Complex Design With Relations [Day 59]
- 014 Inserting Related Data [Day 59]
- 015 Practice Inserting Related Data [Day 59]
- 016 Querying _ Joining Related Data [Day 59]
- 017 Practice Joining Data [Day 59]
- 018 Module Summary _ More On Relationships [Day 59]
24 - Using MySQL In NodeJS _ Express Websites [Days 60 - 62]
- 001 Module Introduction [Day 60]
- 002 Why Should Database-Accessing Code Run On The Backend [Day 60]
- 003 What We_ll Build In This Section [Day 60]
- 004 Planning Our Database Structure [Day 60]
- 005 Database Initialization [Day 60]
- 006 Project Setup [Day 60]
- 007 Creating Our First Routes [Day 60]
- 008 Connecting To The Database _ Querying Data [Day 61]
- 009 Inserting Data With Placeholders (Injecting Dynamic Data) [Day 61]
- 010 Fetching _ Displaying a List Of Blog Posts [Day 61]
- 011 Fetching _ Displaying a Single Blog Post [Day 62]
- 012 Formatting _ Transforming Fetched Data [Day 62]
- 013 Preparing The Update Post Page [Day 62]
- 014 Updating Posts [Day 62]
- 015 Deleting Posts [Day 62]
- 016 Module Summary [Day 62]
25 - NoSQL _ MongoDB - An Introduction [Days 63 - 64]
- 001 Module Introduction [Day 63]
- 002 The Idea Behind NoSQL Database Systems [Day 63]
- 003 Introducing MongoDB [Day 63]
- 004 General Setup Instructions _ Installing MongoDB on macOS [Day 63]
- 005 Installing MongoDB on Windows [Day 63]
- 006 Installing the MongoDB Shell [Day 63]
- 007 Inserting Data with MongoDB [Day 63]
- 008 Reading _ Filtering Data [Day 64]
- 009 Updating Documents In A MongoDB Database [Day 64]
- 010 Deleting Documents With MongoDB [Day 64]
- 011 Planning a Complete Database Design Layout [Day 64]
- 012 Implementing the Planned Design _ Layout [Day 64]
- 013 Practice Time _ More Filtering Operators [Day 64]
26 - NodeJS _ MongoDB (NoSQL) [Days 65 - 67]
- 001 Module Introduction [Day 65]
- 002 Planning the Database Structure _ Layout [Day 65]
- 003 Project _ Database Initialization [Day 65]
- 005 Connecting to MongoDB (from inside NodeJS) [Day 65]
- 006 Fetching _ Displaying A List Of Authors [Day 65]
- 007 Inserting Documents (New Posts) [Day 65]
- 008 Fetching _ Displaying Documents [Day 66]
- 010 Fetching a Single Document [Day 66]
- 011 Transforming _ Preparing Data [Day 66]
- 012 Updating Documents [Day 66]
- 013 Deleting Documents [Day 66]
- 014 ExpressJS _ Handling Asynchronous Code Errors [Day 67]
27 - Adding File Upload To A Website [Days 67 - 68]
- 001 Module Introduction [Day 67]
- 002 The Two Sides Of Uploading Files _ Setting Up A Starting Project [Day 67]
- 003 Adding A File Picker To A Form [Day 67]
- 004 Parsing Incoming File Uploads With The multer Package [Day 67]
- 005 How To Store Files On A Backend [Day 67]
- 006 Configuring Multer In-Depth [Day 67]
- 007 Storing File Data In A Database (And What NOT To Store) [Day 68]
- 008 Serving Uploaded Files To Website Visitors [Day 68]
- 009 Adding An Image Preview Feature [Day 68]
- 010 Module Summary [Day 68]
28 - Ajax _ Asynchronous JS-driven Http Requests [Days 68 - 70]
- 001 Module Introduction [Day 68]
- 002 What Is Ajax And Why Would We Need It [Day 68]
- 003 What is Ajax [Day 68]
- 004 The Starting Project _ A Problem [Day 69]
- 005 Sending _ Handling a GET Ajax Request [Day 69]
- 006 Updating The DOM Based On The Response [Day 69]
- 007 Preparing The POST Request Data [Day 69]
- 008 Sending _ Handling a POST Ajax Request [Day 69]
- 009 Improving The User Experience (UX) [Day 70]
- 010 Handling Errors (Server-side _ Technical) [Day 70]
- 011 We Now Have More HTTP Methods! [Day 70]
- 012 Module Summary [Day 70]
29 - User Authentication _ Working With Sessions [Days 70 - 73]
- 001 Module Introduction [Day 70]
- 002 What is Authentication _ Why Would You Want To Add It To A Website [Day 70]
- 003 Our Starting Project [Day 70]
- 004 Adding a Basic Signup Functionality [Day 70]
- 005 Must-Do Hashing Passwords [Day 71]
- 006 Adding User Login Functionality [Day 71]
- 007 Validating Signup Information [Day 71]
- 008 Introducing Sessions _ Cookies - The Stars Of Authentication [Day 71]
- 009 Adding Sessions Support To Our Website [Day 71]
- 010 Storing Authentication Data In Sessions [Day 72]
- 011 Using Sessions _ Cookies For Controlling Access [Day 72]
- 012 Adding The Logout Functionality [Day 72]
- 013 A Closer Look At Cookies [Day 72]
- 014 Diving Deeper Into Sessions (Beyond Authentication) [Day 72]
- 015 Authorization vs Authentication [Day 73]
- 016 Practicing Sessions _ Working With Sessions [Day 73]
- 017 Writing Custom Middlewares _ Using res.locals [Day 73]
- 018 Module Summary [Day 73]
30 - Security [Days 74 - 75]
- 001 Module Introduction [Day 74]
- 002 Authentication vs Website Security [Day 74]
- 003 Understanding CSRF Attacks [Day 74]
- 004 Partial CSRF Protection With Same-Site Cookies [Day 74]
- 005 Implementing A Better CSRF Protection [Day 74]
- 007 Understanding XSS Attacks [Day 74]
- 008 Protecting Against XSS Attacks [Day 74]
- 009 Understanding SQL Injection Attacks [Day 75]
- 010 Protecting Against SQL Injection Attacks [Day 75]
- 011 A Word About NoSQL Injection [Day 75]
- 012 Module Summary [Day 75]
- 013 Avoid Exposing Your Server-side Code or Data Accidentally! [Day 75]
31 - Writing Good Code, Refactoring _ The MVC Pattern [Days 75 - 78]
- 001 Module Introduction [Day 75]
- 002 Our Starting Project (Deep Dive) [Day 75]
- 003 What_s Wrong With Our Code [Day 75]
- 004 Splitting Our Routes [Day 76]
- 005 Extracting Configuration Settings [Day 76]
- 006 Extracting Custom Middleware [Day 76]
- 007 An Introduction To The MVC Pattern [Day 76]
- 008 Creating Our First Model [Day 76]
- 009 Adding Update _ Delete Functionalities To The Model [Day 76]
- 010 Adding Fetch Functionalities To The Model [Day 76]
- 011 Adding A First Controller _ Controller Actions [Day 77]
- 012 Refactoring The Sessions _ Input Validation Errors Functionality [Day 77]
- 013 Refactoring The CSRF Token Handling [Day 77]
- 014 Migrating The Authentication Functionality To MVC [Day 77]
- 015 Improving Asynchronous Error Handling [Day 78]
- 016 Protecting Routes With Custom Middleware [Day 78]
32 - Milestone Project A Complete Online Shop (From A to Z!) [Days 78 - 92]
- 001 Module Introduction [Day 78]
- 002 Planning The Project [Day 78]
- 003 Your Challenge! [Day 78]
- 004 Course Project Setup [Day 78]
- 005 Creating Folders, Files _ A First Set Of Routes [Day 78]
- 006 Adding EJS _ First Views [Day 79]
- 007 Populating _ Rendering The First View [Day 79]
- 008 Adding Base CSS Files _ Static File Serving [Day 79]
- 009 Adding CSS Variables _ A Website Theme [Day 79]
- 010 More Base CSS Styles For The Website [Day 80]
- 011 Styling First Form Elements [Day 80]
- 012 Adding A MongoDB Database Server _ Connection [Day 80]
- 013 Adding User Signup [Day 81]
- 014 Security Time Adding CSRF Protection [Day 81]
- 015 Implementing Proper Error Handling With The Error Handling Middleware [Day 81]
- 016 Introducing Sessions _ Configuring Sessions [Day 81]
- 017 Implementing Authentication _ User Login [Day 82]
- 018 Finishing Authentication _ Checking The Auth Status (Custom Middleware) [Day 82]
- 019 Adding Logout Functionality [Day 82]
- 020 Handling Errors In Asynchronous Code [Day 82]
- 021 Adding User Input Validation [Day 82]
- 022 Flashing Errors _ Input Data Onto Sessions [Day 83]
- 023 Displaying Error Messages _ Saving User Input [Day 83]
- 024 Admin Authorization _ Protected Navigation [Day 83]
- 025 Setting Up Base Navigation Styles [Day 83]
- 026 Building a Responsive Website [Day 84]
- 027 Frontend JavaScript For Toggling The Mobile Menu [Day 84]
- 028 Adding Product Admin Pages _ Forms [Day 84]
- 029 Adding The Image Upload Functionality [Day 85]
- 030 More Data Adding a Product Model _ Storing Products In The Database [Day 85]
- 031 Fetching _ Outputting Product Items [Day 85]
- 032 Styling Product Items [Day 86]
- 033 Adding the Product Details (Single Product) Page [Day 86]
- 034 Updating Products (As Administrator) [Day 86]
- 035 Adding a File Upload Preview [Day 87]
- 036 Making Products Deletable [Day 87]
- 037 Using Ajax Frontend JS Requests _ Updating The DOM [Day 87]
- 038 Various Fixes _ Proper Route Protection [Day 88]
- 039 Outputting Products For Customers [Day 88]
- 040 Outputting Product Details [Day 88]
- 041 Adding A Cart Model [Day 89]
- 042 Working On The Shopping Cart Logic [Day 89]
- 043 Adding Cart Items Via Ajax Requests [Day 89]
- 044 Adding A Cart Page [Day 90]
- 045 Styling The Cart Page [Day 90]
- 046 Updating Cart Items (Changing Quantities) [Day 90]
- 047 Updating Carts Via Ajax Requests (PATCH Requests) [Day 90]
- 048 Updating The DOM After Cart Item Updates [Day 91]
- 050 Adding The Order Controller _ A Basic Order Model [Day 91]
- 051 Saving Orders In The Database [Day 91]
33 - Working With Services _ APIs (e.g. Adding Stripe Payments) [Day 93]
- 001 Module Introduction [Day 93]
- 002 What Are Services _ APIs [Day 93]
- 003 Why Would You Use Services _ APIs [Day 93]
- 004 Introducing Stripe [Day 93]
- 005 Creating A Stripe Account [Day 93]
- 006 Setting Up A Stripe API Request [Day 93]
- 007 Configuring The Stripe Request _ Handling Payments [Day 93]
- 008 Module Summary [Day 93]
34 - Deploying (Publishing) Websites [Days 94 - 95]
- 001 Module Introduction [Day 94]
- 002 How Are Websites Made Available To The Public [Day 94]
- 003 Static vs Dynamic Websites [Day 94]
- 004 Hosting Database Servers [Day 94]
- 005 Deployment (Preparation) Steps [Day 94]
- 006 The Example Projects [Day 94]
- 007 Testing _ Code Preparation (incl. Environment Variables) [Day 94]
- 008 Evaluating Cross-Browser Support [Day 94]
- 009 Search Engine Optimization (SEO) [Day 94]
- 011 Improving Performance _ Shrinking Assets (JS, Images) [Day 95]
- 012 Deployment Example Static Websites (Refresher) [Day 95]
- 013 Deployment Example Dynamic Website With Backend Code [Day 95]
- 014 Deploying A MongoDB Database With Atlas [Day 95]
- 015 Finishing Dynamic Website Deployment [Day 95]
35 - Web Services _ Building Custom (REST) APIs [Days 95 - 97]
- 001 Module Introduction [Day 95]
- 002 APIs _ Services What _ Why [Day 95]
- 003 JS Packages vs URL-based APIs What We Will Build Here [Day 95]
- 004 APIs vs Traditional Websites [Day 95]
- 005 Introducing REST APIs [Day 96]
- 006 Building A First Basic REST API [Day 96]
- 007 Enhancing The API _ Making It More Realistic [Day 96]
- 008 A More Complex REST API First Steps [Day 96]
- 009 Finishing The First API Endpoints [Day 97]
- 010 Testing APIs With Postman [Day 97]
- 011 Adding PATCH _ DELETE Routes Endpoints [Day 97]
- 012 Adding A Decoupled Frontend Website (SPA) [Day 97]
- 013 Why Would You Use A Decoupled Frontend SPA [Day 97]
- 014 Understanding CORS Errors [Day 97]
- 015 Fixing CORS Errors _ Connecting The Frontend SPA To The REST API [Day 97]
36 - Working With Frontend JavaScript Frameworks _ Introducing Vue.js [Days 98 - 99]
- 001 Module Introduction [Day 98]
- 002 Why Would You Use Frontend JavaScript UI Frameworks [Day 98]
- 003 React vs Vue vs Angular Which Framework Should You Use [Day 98]
- 004 Getting Started With Vue.js (Vue) [Day 98]
- 005 Listening To Events _ Updating Data + the DOM [Day 98]
- 006 Introducing Two-Way-Binding [Day 98]
- 007 Outputting Lists Of Data [Day 99]
- 008 Outputting Content Conditionally [Day 99]
- 009 Updating Data [Day 99]
- 010 Deleting Data [Day 99]
- 011 Sending a POST Http Request [Day 99]
- 012 Loading Data _ Managing Loading States [Day 99]
- 013 Loading Vue Differently [Day 99]
- 014 Sending PATCH + DELETE Requests _ Module Summary [Day 99]
37 - Course Summary _ Where To Go Next [Day 100]
课程内容
37个章节 , 608个讲座
01 - Introduction [Day 1]
- 001 Welcome to This Course! [Day 1] (免费)
- 002 What Is Web Development _ How Does The Web Work [Day 1] (免费)
- 003 The Three Key Programming Languages [Day 1]
- 004 How The Web Works A Deep Dive [Day 1]
- 006 The 100 Days of Code Challenge! [Day 1]
- 007 How To Get The Most Out Of This Course [Day 1]
- 008 Stuck in the Course We Got you Covered! [Day 1]
02 - Building a First Website HTML _ CSS Basics [Days 1 - 5]
- 001 Module Introduction [Day 1]
- 002 How to Create a Website [Day 1]
- 003 Creating our First HTML Page [Day 1]
- 004 Setting Up a Development Environment [Day 2]
- 005 Why Visual Studio Code [Day 2]
- 006 Understanding HTML Elements [Day 2]
- 007 Which HTML Elements Exist [Day 2]
- 008 Adding Another HTML Element [Day 2]
- 009 Exploring HTML Attributes [Day 2]
- 011 Getting Started with CSS (Day 2)
- 012 More CSS Styling [Day 2]
- 013 Working with Colors [Day 3]
- 014 Formatting our Code [Day 3]
- 015 Working with the Browser Developer Tools [Day 3]
- 016 Adding a Link [Day 3]
- 017 You can Nest HTML Elements! [Day 3]
- 018 Using Global CSS Styles [Day 3]
- 020 The HTML Document Skeleton _ Metadata [Day 3]
- 021 Visual Studio Code Shortcuts _ Tricks [Day 3]
- 023 First Summary [Day 3]
- 025 Styling the Anchor Element Also with Pseudo Hover [Day 4]
- 026 Why it_s Called Cascading Style Sheets [Day 4]
- 027 Storing CSS Code in External Files [Day 4]
- 028 The Void Element Syntax [Day 4]
- 029 Multiple Files _ Requests [Day 4]
- 030 Selecting Single Elements with the ID Selector [Day 4]
- 031 Working with font-size and px [Day 4]
- 032 Using Other Fonts from Google Fonts [Day 4]
- 034 Adding an Image [Day 5]
- 035 Styling the Image _ Using the Body Tag [Day 5]
- 036 Styling the Overall Page Background [Day 5]
- 037 Adding a Second HTML File [Day 5]
- 040 Using a Shared CSS File [Day 5]
- 041 Organizing Source Files in Folders [Day 5]
- 042 Summary [Day 5]
03 - Diving Deeper Into HTML _ CSS [Days 6 - 8]
- 001 Module Introduction [Day 6]
- 002 Using the Live Server Extension [Day 6]
- 004 Understanding Lists [Day 6]
- 005 Creating Lists [Day 6]
- 006 Understanding Parents, Children, Containers _ More [Day 6]
- 007 Understanding Cascading, Inheritance _ Specificity [Day 6]
- 008 Styling the Full Week Page [Day 6]
- 009 Introducing the CSS Box Model [Day 7]
- 010 Using the CSS Box Model [Day 7]
- 011 Creating HTML Layouts [Day 7]
- 012 Theory Selectors _ Combinators [Day 7]
- 013 Using Selectors _ Combinators [Day 7]
- 014 Understanding Classes [Day 7]
- 015 Block vs Inline Elements [Day 7]
- 016 Styling Differences Between Block _ Inline Elements [Day 8]
- 017 Understanding Margin Collapsing [Day 8]
- 018 The box-shadow Property [Day 8]
- 019 Your Challenge! [Day 8]
- 020 Creating the HTML Layout [Day 8]
- 021 Styling the Main Section [Day 8]
- 022 Styling Images _ Working with Negative Margins [Day 8]
- 023 Finishing Touches [Day 8]
- 024 Module Summary [Day 8]
04 - HTML _ CSS - Practice _ Summary [Days 9 - 10]
- 001 Module Introduction [Day 9]
- 002 Your Task! [Day 9]
- 003 Creating the Core Structure [Day 9]
- 004 Adding the Header Content [Day 9]
- 005 Adding Header Styling [Day 9]
- 006 Spacing _ the CSS Box Model [Day 9]
- 007 Adding the Main Content [Day 9]
- 008 Styling the Main Content [Day 10]
- 009 Styling List Items _ Links [Day 10]
- 010 Adding the Footer [Day 10]
- 011 Introducing New HTML Elements [Day 10]
- 012 Organizing our Files [Day 10]
- 013 Module Summary [Day 10]
05 - Serving A Website (Hosting _ Deployment) [Day 11]
06 - Introducing Version Control with Git _ GitHub [Days 11 - 14]
- 001 Module Introduction [Day 11]
- 002 What are Git _ GitHub [Day 11]
- 003 Command Line Interface (CLI) vs Graphical User Interface (GUI) [Day 11]
- 004 Optional MacOS Terminal (z Shell) Crash Course [Day 11]
- 005 Optional Windows Command Prompt (cmd) Crash Course [Day 12]
- 006 Git MacOS Installation [Day 12]
- 007 Git Windows Installation [Day 12]
- 008 Understanding the Git Basics [Day 12]
- 009 Initializing the Repository _ Creating our First Commit [Day 12]
- 011 Understanding Branches, Merging _ Fixing Merge Conflicts [Day 13]
- 012 Deleting Branches _ Commits, Reverting Staged _ Unstaged Changes [Day 13]
- 013 Onwards to GitHub - What _ Why [Day 13]
- 014 Creating a GitHub Account _ a Remote Repository [Day 13]
- 016 Understanding the Personal Access Token _ git clone [Day 14]
- 017 Collaborating on Projects - Collaborators _ Organizations [Day 14]
- 018 Contributing to Projects - Forks _ Pull Requests [Day 14]
- 019 Wrap Up [Day 14]
07 - Understanding HTML _ CSS Layouts _ Positioning [Days 15 - 20]
- 001 Module Introduction [Day 15]
- 002 Project Overview - What we Will Build [Day 15]
- 003 Project Setup [Day 15]
- 004 Creating the Landing Page Structure [Day 15]
- 005 Adding the Page Logo [Day 15]
- 006 Adding the Page Navigation [Day 15]
- 007 Introducing CSS Flexbox [Day 15]
- 008 Aligning Flex Items [Day 15]
- 009 Your Flexbox Challenge! [Day 16]
- 010 Adding Flexbox to our Project [Day 16]
- 011 Adding a Background Image [Day 16]
- 012 Creating a Container for the Hero-Content [Day 16]
- 013 Positioning Elements [Day 16]
- 014 Styling the Hero Content [Day 16]
- 015 Understanding Fixed _ Absolute Positioning [Day 16]
- 016 Working with _ Units _ Creating a Top Navigation Bar [Day 17]
- 017 Finishing the Header [Day 17]
- 018 Introducing the Highlights Section [Day 17]
- 019 Creating the HTML Code [Day 17]
- 020 Building the Flex Container [Day 17]
- 021 Flex Item Layout [Day 17]
- 022 Styling Images with object-fit [Day 17]
- 023 Styling Text [Day 17]
- 025 Understanding Parent - Child Margin Collapsing [Day 18]
- 026 Working with CSS Functions - Linear Gradients [Day 18]
- 027 The Next Step [Day 18]
- 028 Creating a Footer Section [Day 18]
- 029 Styling the Footer [Day 18]
- 030 Places Page - Overview _ Preparations [Day 18]
- 031 Creating the Card Content [Day 18]
- 032 Using position static [Day 18]
- 033 Creating the Card Look [Day 19]
- 034 Understanding overflow _ Your Challenge! [Day 19]
- 035 Solving the Challenge [Day 19]
- 036 Creating all Cards [Day 19]
- 037 The CSS Grid - Theory [Day 19]
- 038 Understanding the nth-type Selector _ grid-template-columns [Day 19]
- 039 Your Grid Challenge [Day 20]
- 040 Working with Unicode UTF-8 [Day 20]
- 041 Finishing Touches [Day 20]
- 042 Module Summary [Day 20]
08 - Understanding Responsive Web Design [Days 20 - 24]
- 001 Module Introduction [Day 20]
- 002 Project Overview [Day 20]
- 004 Optional Your Challenge - Creating the HTML Structure [Day 20]
- 005 Optional Challenge Solution - The HTML Structure [Day 20]
- 006 Optional Styling the Header [Day 21]
- 007 Optional Styling the main Section [Day 21]
- 008 What is Responsive Design [Day 21]
- 009 The Problem with Pixels [Day 21]
- 010 Introducing em _ rem [Day 21]
- 011 Applying em _ rem for the Font Size [Day 22]
- 012 Deep Dive em vs rem vs _ [Day 22]
- 013 Updating the Project Units [Day 22]
- 014 Comparing Desktop _ Mobile First Design [Day 22]
- 015 Understanding Media Queries [Day 22]
- 016 Adding Media Queries to the Project [Day 23]
- 017 Your Media Queries Challenge! [Day 23]
- 018 Side Drawer _ Hamburger Icon - Theory [Day 23]
- 019 Creating the Hamburger Button [Day 23]
- 020 Creating the Side Drawer [Day 23]
- 021 Understanding HTML Fragments [Day 23]
- 022 Understanding the Target Selector [Day 24]
- 023 Finishing the Side Drawer [Day 24]
- 025 Module Summary [Day 24]
09 - Creating Beautiful Websites [Days 24 - 25]
- 001 Module Introduction [Day 24]
- 002 Three Things to Keep in Mind [Day 24]
- 003 Introducing the Module Project [Day 24]
- 004 Sizing _ Spacing [Day 24]
- 005 Choosing the Right Font [Day 24]
- 006 Understanding The Importance of Grey, Primary _ Accent Colors [Day 24]
- 007 Introducing CSS Variables CSS Custom Properties [Day 25]
- 008 CSS Variables in Action [Day 25]
- 009 Comparing root vs html vs Selectors [Day 25]
- 010 Understanding CSS Transformations [Day 25]
- 011 Adding CSS Transitions [Day 25]
- 012 Working with SVGs [Day 25]
10 - Adding Forms To Websites [Days 26 - 29]
- 001 Module Introduction [Day 26]
- 002 What _ Why [Day 26]
- 003 Important Form HTML Elements [Day 26]
- 004 Our First Input Element [Day 26]
- 005 Adding a Button [Day 26]
- 006 The Form Element, Form Submission _ Different Types of Requests [Day 26]
- 007 Styling the Form Element [Day 27]
- 008 Adding Labels [Day 27]
- 009 More Detailed Forms Styling [Day 27]
- 010 Understanding Different Input Types [Day 27]
- 011 Understanding Email, Numbers, Password _ Date Types [Day 27]
- 012 Working with Radio Buttons [Day 27]
- 013 Using Checkboxes [Day 28]
- 014 The Textarea Element For Longer Text [Day 28]
- 015 Adding a Dropdown [Day 28]
- 016 Forms _ Semantics (Structuring Forms) [Day 28]
- 017 More on Form Buttons [Day 28]
- 018 Validation Attributes [Day 28]
- 019 More Input _ Form Attributes [Day 28]
- 020 Your Challenge! [Day 29]
- 021 Challenge Base Page Structure _ Styling [Day 29]
- 023 Challenge First Set of Input Elements [Day 29]
- 024 Challenge Adding Remaining Elements [Day 29]
- 025 Challenge Submission _ Validation [Day 29]
- 026 Challenge Styling [Day 29]
11 - Understanding the JavaScript Basics [Days 29 - 33]
- 001 Module Introduction [Day 29]
- 002 What is JavaScript _ Why would we use it [Day 29]
- 003 What You Will Learn In this Module [Day 29]
- 004 Introducing Values _ Variables [Day 29]
- 005 Adding the script HTML Element [Day 30]
- 006 Working with Values _ Basic JavaScript Commands [Day 30]
- 007 Introducing Variables (Data Containers) [Day 30]
- 008 A Closer Look At The JavaScript Syntax [Day 30]
- 009 A Second Variable _ Practice Time! [Day 30]
- 010 Outsourcing JavaScript Code Into External Files [Day 30]
- 011 Introducing Arrays (Managing Lists Of Data) [Day 30]
- 012 Introducing Objects (Grouping Related Data) [Day 30]
- 013 Splitting Code Across Multiple Lines [Day 31]
- 014 Accessing Object Properties [Day 31]
- 015 Performing Operations [Day 31]
- 016 Onwards To Custom Commands! [Day 31]
- 017 Introducing Functions [Day 31]
- 018 Functions _ Variables [Day 31]
- 019 Returning Values In Functions [Day 31]
- 020 Passing Data Into Functions With Parameters [Day 31]
- 021 Functions - A Summary [Day 31]
- 022 Time To Practice The Problem [Day 32]
- 023 Time To Practice The Solution [Day 32]
- 024 Introducing Methods [Day 32]
- 025 Making Our Developer Life Easier (Logging with console.log()) [Day 32]
- 026 Math Operations _ Working With Different Kinds Of Values [Day 32]
- 027 The Modulus Operator [Day 32]
- 028 Math Operations _ Math Rules [Day 32]
- 029 Performing String (Text) Operations [Day 32]
- 031 String Operations _ String Methods [Day 32]
- 032 Basic Array Operations [Day 33]
- 034 Module Summary [Day 33]
12 - Advanced JavaScript Working with the DOM [Days 33 - 37]
- 001 Module Introduction [Day 33]
- 002 Our Starting Setup [Day 33]
- 003 The Global window _ document Objects [Day 33]
- 004 What Is The DOM [Day 33]
- 005 Exploring The DOM [Day 33]
- 006 Drilling Into The DOM To Select _ Change HTML Elements [Day 33]
- 007 Loading Our Script Correctly [Day 33]
- 008 The DOM Tree _ DOM Traversal [Day 33]
- 009 Drilling Into The DOM _ Exploring Text Nodes [Day 34]
- 010 DOM Drilling Limitations [Day 34]
- 011 Searching The DOM For Elements [Day 34]
- 012 Querying Elements [Day 34]
- 014 Time to Practice The Problem [Day 34]
- 015 Time to Practice The Solution [Day 34]
- 016 Next Steps [Day 34]
- 017 Inserting New HTML Elements via JavaScript [Day 34]
- 018 Deleting DOM Elements [Day 35]
- 019 Moving Existing Elements Around [Day 35]
- 020 Working with innerHTML [Day 35]
- 022 Introducing Events [Day 35]
- 023 Adding a First click Event Listener [Day 35]
- 024 Listening To User Input Events [Day 35]
- 025 The event Object [Day 35]
- 027 A More Realistic Demo _ Example [Day 36]
- 028 Introducing Constant Variables (Constants) [Day 36]
- 029 Changing Element Styles With JavaScript [Day 36]
- 030 Managing CSS Classes With JavaScript [Day 36]
- 031 Module Summary [Day 36]
- 032 Time to Practice The Problem [Day 37]
- 033 Time to Practice The Solution [Day 37]
13 - Advanced JavaScript Control Structures [Days 37 - 39]
- 001 Module Introduction [Day 37]
- 002 Getting Started with Control Structures [Day 37]
- 003 Introducing Boolean Values (Booleans) _ Comparison Operators [Day 37]
- 004 Booleans _ Comparison Operators In Action [Day 37]
- 005 Using Booleans In if Statements (Conditional Code Execution) [Day 37]
- 006 A Real Example [Day 38]
- 007 Alternatives with else and else if [Day 38]
- 008 More on Boolean Values [Day 38]
- 009 Truthy _ Falsy Values [Day 38]
- 011 Introducing Loops (Repeated Code Execution) [Day 38]
- 012 The Regular for Loop [Day 38]
- 013 The for-of Loop (for Arrays) [Day 38]
- 015 The for-in Loop (for Objects) [Day 38]
- 016 The while Loop [Day 38]
- 017 Practice Time Setup _ The for Loop [Day 39]
- 018 Practice Time The for-of Loop [Day 39]
- 019 Practice Time The for-in Loop [Day 39]
- 020 Practice Time The while Loop [Day 39]
- 021 Module Summary [Day 39]
14 - Milestone Project Building a Tic-Tac-Toe Game [Days 40 - 44]
- 001 Module Introduction [Day 40]
- 002 Planning The Project [Day 40]
- 003 Creating The HTML Structure [Day 40]
- 004 Adding Base Page Styles [Day 40]
- 005 Adding Styling For The Game Configuration Area [Day 41]
- 006 Styling The Game Board [Day 41]
- 007 Adding JavaScript, Script Files _ First Event Listeners [Day 41]
- 008 Showing _ Hiding The Configuration Modal (Overlay) [Day 41]
- 009 Handling Form Submission With JavaScript [Day 42]
- 010 Validating User Input With JavaScript [Day 42]
- 011 Storing _ Managing Submitted Data [Day 42]
- 012 Adding Logic For Starting A Game [Day 43]
- 013 Managing Game Rounds (Turns) _ Field Selection [Day 43]
- 014 Tracking Selected Fields On The Game Board [Day 43]
- 015 Checking For A Winner Or Draw [Day 44]
- 016 Ending The Game _ Adding Restart Logic [Day 44]
- 017 Module Summary [Day 44]
15 - Working with Third-Party Packages [Days 45 - 46]
- 001 Module Introduction [Day 45]
- 002 What _ Why [Day 45]
- 003 Third-Party Code vs Custom Code (Your Own Code) [Day 45]
- 004 First Example Adding Bootstrap For Some Default Styling [Day 45]
- 005 Adding _ Using the Bootstrap CSS Package [Day 45]
- 006 Adding a JavaScript Package [Day 45]
- 007 Adding an Image Carousel Gallery with a Third-Party Package [Day 45]
- 008 Combining Third-Party Packages With Custom Code [Day 45]
- 009 More Bootstrap Examples [Day 45]
- 010 Exercise Solution _ First Summary [Day 45]
- 011 Another Example Preparing a Parallax Page [Day 45]
- 012 Adding A Parallax Effect Package [Day 46]
- 013 Viewing Third-Party Source Code _ Module Summary [Day 46]
16 - Onwards To Backend Development [Day 46]
17 - NodeJS Introduction - Getting Started With Backend Development [Day 47]
18 - Enhancing NodeJS with ExpressJS [Days 48 - 49]
- 001 Module Introduction [Day 48]
- 002 Installing Express with npm [Day 48]
- 003 Creating a Server with Express _ Handling Requests + Responses [Day 48]
- 004 Parsing User Data With Express [Day 48]
- 005 Storing Data in (Server-side) Files [Day 48]
- 007 Reading File Data _ Returning Dynamic Responses (Dynamic HTML Code) [Day 49]
- 008 Enhancing the Developer Workflow with nodemon [Day 49]
- 009 Summary [Day 49]
19 - More Express Static _ Dynamic Content with Templates (EJS) [Days 49 - 51]
- 001 Module Introduction [Day 49]
- 002 Creating a Starting Project _ What Needs To Change [Day 49]
- 003 Setting Up A Basic Express App (incl. Practice) [Day 49]
- 004 Serving HTML Files With Node _ Express [Day 49]
- 005 Serving Static Files (CSS _ JavaScript) [Day 50]
- 006 Parsing Form Data _ Redirecting Requests [Day 50]
- 007 Adding the EJS Template Engine [Day 50]
- 008 Rendering Dynamic Content With Templates [Day 50]
- 009 Outputting Repeated Content With EJS _ Loops [Day 50]
- 010 Rendering Conditional Content [Day 50]
- 011 Including Partial Content [Day 51]
- 012 EJS _ IDE Support [Day 51]
- 013 Module Summary [Day 51]
20 - Handling Dynamic Routes (URLs), Errors _ Manag. Bigger Express Projects [51-53]
- 001 Module Introduction [Day 51]
- 002 Introducing Dynamic Routes [Day 51]
- 003 Managing Data with Unique IDs [Day 51]
- 004 Loading _ Displaying Detail Data [Day 52]
- 005 Showing a 404 Page For Not Found Cases [Day 52]
- 006 More 404 Page Usage (Non-Existent Routes) [Day 52]
- 007 Handling Server-Side Errors (500 Status Code) [Day 52]
- 008 Working With Status Codes [Day 52]
- 009 Code Refactoring _ Adding More Functions [Day 52]
- 010 Importing _ Exporting Code In NodeJS [Day 53]
- 011 Using The Express Router To Split The Route Configuration [Day 53]
- 012 Introducing Query Parameters (_ Hidden Form Fields) [Day 53]
- 014 Module Summary [Day 53]
21 - Exploring More Advanced JavaScript Concepts [Days 54 - 56]
- 001 Module Introduction [Day 54]
- 002 Functions _ Default Parameters [Day 54]
- 003 Rest Parameters _ The Spread Operator [Day 54]
- 004 Functions Are Objects! [Day 54]
- 005 Working with Template Literals [Day 54]
- 006 Primitive vs Reference Values [Day 54]
- 007 Custom Error Handling With try catch [Day 55]
- 009 Variable Scoping _ Shadowing [Day 55]
- 011 Introducing Classes As Object Blueprints [Day 55]
- 012 Classes _ Methods (and this) [Day 55]
- 013 Destructuring Objects _ Arrays [Day 55]
- 015 Diving Into Asynchronous Code _ Callback Functions [Day 56]
- 016 Introducing Promises [Day 56]
- 017 Asynchronous Code _ Error Handling [Day 56]
- 018 Improving Code With async await [Day 56]
- 020 Module Summary [Day 56]
22 - Onwards To Databases [Days 56 - 57]
23 - SQL Databases - Introduction _ Core Concepts [Days 57 - 59]
- 001 Module Introduction [Day 57]
- 002 What _ Why [Day 57]
- 003 RDBMS Options [Day 57]
- 004 Installing MySQL _ Setup Steps [Day 57]
- 005 Database Server vs Databases vs Tables [Day 57]
- 006 Writing Our First SQL Code _ Creating a Database [Day 57]
- 007 Creating a Table _ Table Structure [Day 58]
- 008 Inserting Data Into A Table [Day 58]
- 009 Reading Data From A Table (incl. Filtering) [Day 58]
- 010 Updating _ Deleting Data [Day 58]
- 011 Designing A More Complex Database [Day 58]
- 012 Adding A New Table [Day 58]
- 013 Implementing A More Complex Design With Relations [Day 59]
- 014 Inserting Related Data [Day 59]
- 015 Practice Inserting Related Data [Day 59]
- 016 Querying _ Joining Related Data [Day 59]
- 017 Practice Joining Data [Day 59]
- 018 Module Summary _ More On Relationships [Day 59]
24 - Using MySQL In NodeJS _ Express Websites [Days 60 - 62]
- 001 Module Introduction [Day 60]
- 002 Why Should Database-Accessing Code Run On The Backend [Day 60]
- 003 What We_ll Build In This Section [Day 60]
- 004 Planning Our Database Structure [Day 60]
- 005 Database Initialization [Day 60]
- 006 Project Setup [Day 60]
- 007 Creating Our First Routes [Day 60]
- 008 Connecting To The Database _ Querying Data [Day 61]
- 009 Inserting Data With Placeholders (Injecting Dynamic Data) [Day 61]
- 010 Fetching _ Displaying a List Of Blog Posts [Day 61]
- 011 Fetching _ Displaying a Single Blog Post [Day 62]
- 012 Formatting _ Transforming Fetched Data [Day 62]
- 013 Preparing The Update Post Page [Day 62]
- 014 Updating Posts [Day 62]
- 015 Deleting Posts [Day 62]
- 016 Module Summary [Day 62]
25 - NoSQL _ MongoDB - An Introduction [Days 63 - 64]
- 001 Module Introduction [Day 63]
- 002 The Idea Behind NoSQL Database Systems [Day 63]
- 003 Introducing MongoDB [Day 63]
- 004 General Setup Instructions _ Installing MongoDB on macOS [Day 63]
- 005 Installing MongoDB on Windows [Day 63]
- 006 Installing the MongoDB Shell [Day 63]
- 007 Inserting Data with MongoDB [Day 63]
- 008 Reading _ Filtering Data [Day 64]
- 009 Updating Documents In A MongoDB Database [Day 64]
- 010 Deleting Documents With MongoDB [Day 64]
- 011 Planning a Complete Database Design Layout [Day 64]
- 012 Implementing the Planned Design _ Layout [Day 64]
- 013 Practice Time _ More Filtering Operators [Day 64]
26 - NodeJS _ MongoDB (NoSQL) [Days 65 - 67]
- 001 Module Introduction [Day 65]
- 002 Planning the Database Structure _ Layout [Day 65]
- 003 Project _ Database Initialization [Day 65]
- 005 Connecting to MongoDB (from inside NodeJS) [Day 65]
- 006 Fetching _ Displaying A List Of Authors [Day 65]
- 007 Inserting Documents (New Posts) [Day 65]
- 008 Fetching _ Displaying Documents [Day 66]
- 010 Fetching a Single Document [Day 66]
- 011 Transforming _ Preparing Data [Day 66]
- 012 Updating Documents [Day 66]
- 013 Deleting Documents [Day 66]
- 014 ExpressJS _ Handling Asynchronous Code Errors [Day 67]
27 - Adding File Upload To A Website [Days 67 - 68]
- 001 Module Introduction [Day 67]
- 002 The Two Sides Of Uploading Files _ Setting Up A Starting Project [Day 67]
- 003 Adding A File Picker To A Form [Day 67]
- 004 Parsing Incoming File Uploads With The multer Package [Day 67]
- 005 How To Store Files On A Backend [Day 67]
- 006 Configuring Multer In-Depth [Day 67]
- 007 Storing File Data In A Database (And What NOT To Store) [Day 68]
- 008 Serving Uploaded Files To Website Visitors [Day 68]
- 009 Adding An Image Preview Feature [Day 68]
- 010 Module Summary [Day 68]
28 - Ajax _ Asynchronous JS-driven Http Requests [Days 68 - 70]
- 001 Module Introduction [Day 68]
- 002 What Is Ajax And Why Would We Need It [Day 68]
- 003 What is Ajax [Day 68]
- 004 The Starting Project _ A Problem [Day 69]
- 005 Sending _ Handling a GET Ajax Request [Day 69]
- 006 Updating The DOM Based On The Response [Day 69]
- 007 Preparing The POST Request Data [Day 69]
- 008 Sending _ Handling a POST Ajax Request [Day 69]
- 009 Improving The User Experience (UX) [Day 70]
- 010 Handling Errors (Server-side _ Technical) [Day 70]
- 011 We Now Have More HTTP Methods! [Day 70]
- 012 Module Summary [Day 70]
29 - User Authentication _ Working With Sessions [Days 70 - 73]
- 001 Module Introduction [Day 70]
- 002 What is Authentication _ Why Would You Want To Add It To A Website [Day 70]
- 003 Our Starting Project [Day 70]
- 004 Adding a Basic Signup Functionality [Day 70]
- 005 Must-Do Hashing Passwords [Day 71]
- 006 Adding User Login Functionality [Day 71]
- 007 Validating Signup Information [Day 71]
- 008 Introducing Sessions _ Cookies - The Stars Of Authentication [Day 71]
- 009 Adding Sessions Support To Our Website [Day 71]
- 010 Storing Authentication Data In Sessions [Day 72]
- 011 Using Sessions _ Cookies For Controlling Access [Day 72]
- 012 Adding The Logout Functionality [Day 72]
- 013 A Closer Look At Cookies [Day 72]
- 014 Diving Deeper Into Sessions (Beyond Authentication) [Day 72]
- 015 Authorization vs Authentication [Day 73]
- 016 Practicing Sessions _ Working With Sessions [Day 73]
- 017 Writing Custom Middlewares _ Using res.locals [Day 73]
- 018 Module Summary [Day 73]
30 - Security [Days 74 - 75]
- 001 Module Introduction [Day 74]
- 002 Authentication vs Website Security [Day 74]
- 003 Understanding CSRF Attacks [Day 74]
- 004 Partial CSRF Protection With Same-Site Cookies [Day 74]
- 005 Implementing A Better CSRF Protection [Day 74]
- 007 Understanding XSS Attacks [Day 74]
- 008 Protecting Against XSS Attacks [Day 74]
- 009 Understanding SQL Injection Attacks [Day 75]
- 010 Protecting Against SQL Injection Attacks [Day 75]
- 011 A Word About NoSQL Injection [Day 75]
- 012 Module Summary [Day 75]
- 013 Avoid Exposing Your Server-side Code or Data Accidentally! [Day 75]
31 - Writing Good Code, Refactoring _ The MVC Pattern [Days 75 - 78]
- 001 Module Introduction [Day 75]
- 002 Our Starting Project (Deep Dive) [Day 75]
- 003 What_s Wrong With Our Code [Day 75]
- 004 Splitting Our Routes [Day 76]
- 005 Extracting Configuration Settings [Day 76]
- 006 Extracting Custom Middleware [Day 76]
- 007 An Introduction To The MVC Pattern [Day 76]
- 008 Creating Our First Model [Day 76]
- 009 Adding Update _ Delete Functionalities To The Model [Day 76]
- 010 Adding Fetch Functionalities To The Model [Day 76]
- 011 Adding A First Controller _ Controller Actions [Day 77]
- 012 Refactoring The Sessions _ Input Validation Errors Functionality [Day 77]
- 013 Refactoring The CSRF Token Handling [Day 77]
- 014 Migrating The Authentication Functionality To MVC [Day 77]
- 015 Improving Asynchronous Error Handling [Day 78]
- 016 Protecting Routes With Custom Middleware [Day 78]
32 - Milestone Project A Complete Online Shop (From A to Z!) [Days 78 - 92]
- 001 Module Introduction [Day 78]
- 002 Planning The Project [Day 78]
- 003 Your Challenge! [Day 78]
- 004 Course Project Setup [Day 78]
- 005 Creating Folders, Files _ A First Set Of Routes [Day 78]
- 006 Adding EJS _ First Views [Day 79]
- 007 Populating _ Rendering The First View [Day 79]
- 008 Adding Base CSS Files _ Static File Serving [Day 79]
- 009 Adding CSS Variables _ A Website Theme [Day 79]
- 010 More Base CSS Styles For The Website [Day 80]
- 011 Styling First Form Elements [Day 80]
- 012 Adding A MongoDB Database Server _ Connection [Day 80]
- 013 Adding User Signup [Day 81]
- 014 Security Time Adding CSRF Protection [Day 81]
- 015 Implementing Proper Error Handling With The Error Handling Middleware [Day 81]
- 016 Introducing Sessions _ Configuring Sessions [Day 81]
- 017 Implementing Authentication _ User Login [Day 82]
- 018 Finishing Authentication _ Checking The Auth Status (Custom Middleware) [Day 82]
- 019 Adding Logout Functionality [Day 82]
- 020 Handling Errors In Asynchronous Code [Day 82]
- 021 Adding User Input Validation [Day 82]
- 022 Flashing Errors _ Input Data Onto Sessions [Day 83]
- 023 Displaying Error Messages _ Saving User Input [Day 83]
- 024 Admin Authorization _ Protected Navigation [Day 83]
- 025 Setting Up Base Navigation Styles [Day 83]
- 026 Building a Responsive Website [Day 84]
- 027 Frontend JavaScript For Toggling The Mobile Menu [Day 84]
- 028 Adding Product Admin Pages _ Forms [Day 84]
- 029 Adding The Image Upload Functionality [Day 85]
- 030 More Data Adding a Product Model _ Storing Products In The Database [Day 85]
- 031 Fetching _ Outputting Product Items [Day 85]
- 032 Styling Product Items [Day 86]
- 033 Adding the Product Details (Single Product) Page [Day 86]
- 034 Updating Products (As Administrator) [Day 86]
- 035 Adding a File Upload Preview [Day 87]
- 036 Making Products Deletable [Day 87]
- 037 Using Ajax Frontend JS Requests _ Updating The DOM [Day 87]
- 038 Various Fixes _ Proper Route Protection [Day 88]
- 039 Outputting Products For Customers [Day 88]
- 040 Outputting Product Details [Day 88]
- 041 Adding A Cart Model [Day 89]
- 042 Working On The Shopping Cart Logic [Day 89]
- 043 Adding Cart Items Via Ajax Requests [Day 89]
- 044 Adding A Cart Page [Day 90]
- 045 Styling The Cart Page [Day 90]
- 046 Updating Cart Items (Changing Quantities) [Day 90]
- 047 Updating Carts Via Ajax Requests (PATCH Requests) [Day 90]
- 048 Updating The DOM After Cart Item Updates [Day 91]
- 050 Adding The Order Controller _ A Basic Order Model [Day 91]
- 051 Saving Orders In The Database [Day 91]
33 - Working With Services _ APIs (e.g. Adding Stripe Payments) [Day 93]
- 001 Module Introduction [Day 93]
- 002 What Are Services _ APIs [Day 93]
- 003 Why Would You Use Services _ APIs [Day 93]
- 004 Introducing Stripe [Day 93]
- 005 Creating A Stripe Account [Day 93]
- 006 Setting Up A Stripe API Request [Day 93]
- 007 Configuring The Stripe Request _ Handling Payments [Day 93]
- 008 Module Summary [Day 93]
34 - Deploying (Publishing) Websites [Days 94 - 95]
- 001 Module Introduction [Day 94]
- 002 How Are Websites Made Available To The Public [Day 94]
- 003 Static vs Dynamic Websites [Day 94]
- 004 Hosting Database Servers [Day 94]
- 005 Deployment (Preparation) Steps [Day 94]
- 006 The Example Projects [Day 94]
- 007 Testing _ Code Preparation (incl. Environment Variables) [Day 94]
- 008 Evaluating Cross-Browser Support [Day 94]
- 009 Search Engine Optimization (SEO) [Day 94]
- 011 Improving Performance _ Shrinking Assets (JS, Images) [Day 95]
- 012 Deployment Example Static Websites (Refresher) [Day 95]
- 013 Deployment Example Dynamic Website With Backend Code [Day 95]
- 014 Deploying A MongoDB Database With Atlas [Day 95]
- 015 Finishing Dynamic Website Deployment [Day 95]
35 - Web Services _ Building Custom (REST) APIs [Days 95 - 97]
- 001 Module Introduction [Day 95]
- 002 APIs _ Services What _ Why [Day 95]
- 003 JS Packages vs URL-based APIs What We Will Build Here [Day 95]
- 004 APIs vs Traditional Websites [Day 95]
- 005 Introducing REST APIs [Day 96]
- 006 Building A First Basic REST API [Day 96]
- 007 Enhancing The API _ Making It More Realistic [Day 96]
- 008 A More Complex REST API First Steps [Day 96]
- 009 Finishing The First API Endpoints [Day 97]
- 010 Testing APIs With Postman [Day 97]
- 011 Adding PATCH _ DELETE Routes Endpoints [Day 97]
- 012 Adding A Decoupled Frontend Website (SPA) [Day 97]
- 013 Why Would You Use A Decoupled Frontend SPA [Day 97]
- 014 Understanding CORS Errors [Day 97]
- 015 Fixing CORS Errors _ Connecting The Frontend SPA To The REST API [Day 97]
36 - Working With Frontend JavaScript Frameworks _ Introducing Vue.js [Days 98 - 99]
- 001 Module Introduction [Day 98]
- 002 Why Would You Use Frontend JavaScript UI Frameworks [Day 98]
- 003 React vs Vue vs Angular Which Framework Should You Use [Day 98]
- 004 Getting Started With Vue.js (Vue) [Day 98]
- 005 Listening To Events _ Updating Data + the DOM [Day 98]
- 006 Introducing Two-Way-Binding [Day 98]
- 007 Outputting Lists Of Data [Day 99]
- 008 Outputting Content Conditionally [Day 99]
- 009 Updating Data [Day 99]
- 010 Deleting Data [Day 99]
- 011 Sending a POST Http Request [Day 99]
- 012 Loading Data _ Managing Loading States [Day 99]
- 013 Loading Vue Differently [Day 99]
- 014 Sending PATCH + DELETE Requests _ Module Summary [Day 99]