What you'll learn
In the 'Complete Website Development' course, delve into HTML, CSS, and JavaScript foundations, progressing to advanced technologies like Node.js, React for dynamic interfaces, PostgreSQL for robust databases, Web3 for blockchain integration, and DApps (Decentralized Applications). Master the entire web development process, from designing responsive layouts to implementing cutting-edge technologies. Learn to create seamless user experiences, deploy scalable websites, and harness the power of blockchain in your applications. By the end, you'll possess a holistic skill set, empowering you to develop feature-rich websites and stay at the forefront of the rapidly evolving web development landscape. Elevate your coding proficiency with this comprehensive course.
Table of contents
- What is HTML?
- HTML Workflow
- Heading Elements
- VSCode Tip: Autocomplete
- Creating HTML Comments
- Proper Document Structure
- The Strong Element
- The 'Bring Attention To' Element
- The Emphasis Element
- The 'Idiomatic Text' Element
- Nesting Elements
- Superscript and Subscript
- Creating Lists
- Nesting Lists
- Inline Vs. Block Elements
- Creating Relative Links
- Linking To Page Elements
- Mailto and Telephone Links
- Creating Image Elements
- The Alt Attribute
- Working with table, tr, and td
- Creating Table Headers
- Structuring Tables With Thead, Tbody, and Tfoot
- Adding Captions To Tables
- Adding Captions To Tables
- Working With Colspan and Rowspan
- The Form Element
- Creating Buttons
- Email, URL & Number Inputs
- Creating Input Labels
- Divs
- The Required Attribute
- Creating Text Areas
- Working With Checkboxes
- The Range (Slider) Input
- Making Dropdowns with Select and Options
- Creating Radio Button Groups
- Other Input Types
- The Disabled Attribute
- Fieldsets and Legends
- The Span Element
- Introducing Semantic Markup
- Exploring Semantic Elements
- Audio Element
- Creating Video Elements
- What is CSS?
- Adding CSS to our Project with Inline Styles
- Understanding the 'style' Tag & Creating a .css File
- Applying Additional Styles & Importing Google Fonts
- Selectors & Combinators
- CSS Box Model
- Margin Collapsing and Removing Default Margins
- Working with Shorthand Properties
- Height & Width Properties
- display: none vs visibility: hidden
- Applying the Display Property & Styling our Navigation Bar
- Working with "text-decoration" & "vertical-align"
- Styling Anchor Tags
- Adding Pseudo Classes
- Adding a Background Image
- Classes or IDs?
- CSS & Browser Support
- Adding "float"
- Hover Effect
- Creating a Fixed Navigation Bar
- Understanding the Z-Index
- Styling & Positioning our Badge with "absolute" and "relative"
- Working with "overflow" and Relative Positioning
- Introducing "sticky" Positioning
- Understanding Linear Gradients
- Applying Radial Gradients
- Adding & Styling SVGs
- Comparing the Viewport Metatag (HTML) and Media Queries (CSS)
- Designing Websites "Mobile First"
- CSS "transition" Property Deep Dive
- Using CSS Animations
- Introduction to Javascript
- Javascript Alerts - Adding Behaviour to Websites
- Data Types
- Javascript Variables
- Naming and Naming Conventions for Javascript Variables
- String Concatenation
- String Lengths and Retrieving the Number of Characters
- Slicing and Extracting Parts of a String
- Basic Arithmetic and the Modulo Operator in Javascript
- Increment and Decrement Expressions
- Creating and Calling Functions
- Parameters and Arguments
- Outputs & Return Values
- Random Number Generation in Javascript
- Control Statements: Using If-Else Conditionals & Logic
- Comparators and Equality
- Combining Comparators
- Working with Javascript Arrays
- Control Statements: While Loops
- Control Statements: For Loops
- Adding Javascript to Websites
- Document Object Model (DOM)
- Selecting HTML Elements with Javascript
- Manipulating and Changing Styles of HTML Elements with Javascript
- Adding Event Listeners to a Button
- Higher Order Functions and Passing Functions as Arguments
- How to Play Sounds on a Website
- How to Use Switch Statements in Javascript
- Objects, their Methods and the Dot Notation
- Using Keyboard Event Listeners to Check for Key Presses
- Understanding Callbacks and How to Respond to Events
- Adding Animation to Websites
- What is React?
- Introduction to Code Sandbox and the Structure of the Module
- Introduction to JSX and Babel
- Javascript Expressions in JSX & ES6 Template Literals
- JSX Attributes & Styling React Elements
- Inline Styling for React Elements
- React Styling
- React Components
- Javascript ES6 - Import, Export and Modules
- [Windows] Local Environment Setup for React Development
- [Mac] Local Environment Setup for React Development
- React Props
- React DevTools
- Mapping Data to Components
- Javascript ES6 Map/Filter/Reduce
- Javascript ES6 Arrow functions
- React Conditional Rendering with the Ternary Operator & AND Operator
- State in React - Declarative vs. Imperative Programming
- React Hooks - useState
- Javascript ES6 Object & Array Destructuring
- Event Handling in React
- React Forms
- Class Components vs. Functional Components
- Changing Complex State
- Javascript ES6 Spread Operator
- Managing a Component Tree
- Introduction to Postgres
- How to Install PostgreSQL and pgAdmin
- Understand how to use keys, Postgres types and keywords
- Use pgAdmin to CREATE a TABLE
- READ data from a Postgres database
- Query data using SELECT, WHERE, and LIKE
- UNIQUE and NOT NULL
- INSERT and add Data
- One to One Relationships & Inner Joins
- One to Many Relationships
- Many to Many Relationships & Aliases
- How to update and delete data & tables
