IIRF Online > Development > No-Code Development > Web Design > Complete Web Design: HTML, CSS, Javascript, Vue, React, Git
Complete Web Design: HTML, CSS, Javascript, Vue, React, Git by Udemy
10 Courses in 1! Learn Webdesign and Become a Professional Front End Web Developer! From Zero to Advanced.
Course Highlights
- Complete HTML5 & CSS3 with 2 projects
- Reponsive Design with CSS Media Queries
- FTP, Hosting, Domain & PHP MyAdmin
- Complete JAVASCRIPT including learning material, 5 lists of exercises & 2 projects
- jQuery basics including learning material & 1 project
- Use Ajax & JSON to work with external APIs
- TYPESCRIPT Basics
- TYPESCRIPT Beginner Project
- Complete VUE JS 3 with 5 projects including Vue Router
- VUE 3 with Options API & Composition API
- VUE 3 State Management with Pinia (2023 Update)
- GIT Beginner to Advanced from command line, VS Code & Git IDEs
- GIT branching system & workflows for software releases
- GITHUB & Other Remote Git Repos
Skills you will learn!
Curriculum
17 Topics
Downloading Visual Studio Code
Basic Structure of an HTML Document
HTML Elements (Tags)
Lists and Links
An Ordered List of Links
Images and Videos
Styles
HTML5 Semantic Elements
The Developer Tools & More CSS Properties (Part 1)
The Developer Tools & More CSS Properties (Part 2)
Styling Elements with CSS
Classes IDs and CSS Selectors
Styling the Content of the Article
Styling the List of Links
Fonts
Styling the Social Links
Colors
20 Topics
Introducing the Next Project & Setup
Starting with the Header
Alignment of Header Items With Flexbox
Fixed Position on Header
Doing the Logo in HTML & CSS
Background Image of Hero Section
Text Area of Hero Section (Part 1)
Text Area of Hero Section (Part 2)
Starting the Best Sellers Area
The 3 Products Section
Individual Product Boxes
Product information
Applying the New Tag
Discounted price
Newsletter Section
Styling the newsletter elements
The Footer Element
Bottom Navigation
HTML Entities
Hover states
9 Topics
Intro to CSS Media Queries
Setting up the Breakpoints
A Note About Media Queries Organization
Designing the Header Navigation
Designing the Hero Section
Responsive Images with HTML5's Picture Element
The Best Sellers Section
Newsletter and Footer
Internal Links
5 Topics
Hosting and Domain - A Brief Explanation
Using a Free Hosting Service
Configuring FTP
Using a Paid Hosting Service
Setting up a Customized .COM Domain Name
24 Topics
Javascript Course Intro
First Steps With Javascript
Javascript Syntax
DOM - Document Object Model
Working With The DOM
Manipulate HTML elements
Variables
Data Types: Strings
Working With Strings
Data Types: Numbers (Part 1)
Data Types: Numbers (Part 2)
Data Types: Booleans
Data Types: Null and Undefined
List Of Exercises # 1
List Of Exercises # 1 (Solution - Part 1)
List Of Exercises # 1 (Solution - Part 2)
Functions
Functions
Data Types: Arrays
Data Types: Objects
Objects Methods
List Of Exercises # 2
List Of Exercises # 2 (Solution - Part 1)
List Of Exercises # 2 (Solution - Part 2)
29 Topics
Events
CSS Manipulation
More getElement Methods
For and For in Loops
While Loops
Conditionals
Conditionals (Part 2)
Nested Loops and Conditionals
Variable Scope
List Of Exercises # 3
List Of Exercises # 3 (Solution - Part 1)
List Of Exercises # 3 (Solution - Part 2)
List Of Exercises # 3 (Solution - Part 3)
BOM - Browser Object Model
Date & Time
Date & Time
Challenge - Calculating Date Intervals
Time Methods
Clock Challenge
Break and Continue
Forms
Forms (Part 2)
The onchange Event
List Of Exercises # 4
List Of Exercises # 4 (Solution - Part 1)
List Of Exercises # 4 (Solution - Part 2)
List Of Exercises # 4 (Solution - Part 3)
List Of Exercises # 4 (Solution - Part 4)
List Of Exercises # 4 (Solution - Part 5)
6 Topics
Presentation
Mobile Menu
About Us Section
Our Services Sections
Contact Form
Copyright Year on Footer
11 Topics
jQuery Intro
jQuery Syntax
DOM Manipulation
Forms
Forms (Part 2)
CSS Classes Manipulation
Events
Events Challenge
Effects
The Animate Method
Download The scripts.js File Used Throughout The Course
8 Topics
Presentation of the project
Getting the Search Parameters
Update Order Details
Calculate the Price
Update the Product Photo
The Change Event For The Quantity and Style Filters
The Change Event For The Color and Quality Filters
Formatting the Price
13 Topics
What is TypeScript and Why We Need It?
Preparing the Workspace
TSC: The TypeScript Compiler
TypeScript Syntax
Primitives Data Types & Functions
Arrays
Objects and Type Aliases
Optional Properties
Interfaces
Union and Literal Types
Null & Undefined
The Any Type
HTML Elements and Type Assertion
6 Topics
Presentation of the Students Project
Defining the Student Interface
Outputting Name & Age of Students
Writing the Logic for the Area of Focus
Outputting the Students' Status
The Reusable Refresh Table Function
11 Topics
Setting up the Workspace
Declarative Rendering and Data Objects
Setting up Vue Dev Tools
Directives and For Loops
Event Handlers - The v-on Directive
A Bug in Chrome Dev Tools
Event Modifiers (Stop Propagation) and Attribute Binding
Filling up The Order Details Section
Working with Methods
User Input and Two-Way Data Binding (Part 1)
User Input and Two-Way Data Binding (Part 2)
8 Topics
Project Presentation - To-Do List App
Setting up Vue JS
Adding To-Dos
Setting the Done & Undone Functionality
Using Localstorage to Load To-dos
Lifecycle Hooks
Loading Data from Localstorage
Updating Localstorage on Clear and Update
15 Topics
Project Presentation - Quiz Game
Create a Vue JS Application with the Vue CLI
The Application Boiler Plate
Clean up Unused Component and HTML Structure
HTTP Requests with Axios
Making Requests to the Open Trivia API
Showing the Question Data on the Page
The Answers Array - Computed Properties
Shuffling the Answers Array
Rendering the Answers Radio Buttons
Submitting the Answer
Presenting the Result
Getting the Next Question
The Score Component
Passing Data to Child Components
13 Topics
Project Presentation - Shopping Bag
Setting up Vue Router
Using Axios to Get Products Data
Working with Vuex
Setting Up Actions and Mutations - Part 1
Setting Up Actions and Mutations - Part 2
Rendering the Products
Adding Products to Bag
Avoiding Repeated Items on Shopping Bag
Removing Items from Bag
The Mapstate Helper
Listing items in the Shopping Bag
Calculating the Order Total
11 Topics
Options API x Composition API
Project Presentation - Task Manager
Reactivity with Ref
Reactivity with Reactive
Components Props and Scoped Styles
Adding IDs to Tasks
Filtering Tasks By State
Computed Properties
Code for the Modal Component
The Modal Component
Component Slots
5 Topics
What is State?
Getting Started with Pinia
Completing the Tasks Store
The New Task Modal Functionality
Adding the State to the Local Storage
8 Topics
Introduction
Git Installation
How to Run Git
Create a New Repo
Add Files to the Staging Area and Create Your First Commit
When to Commit - Best Practices
The VS Code Source Control Tab
Exercise #1
4 Topics
The Importance of Branches
Working with Branches
Merging Branches
Resolving Conflicts
3 Topics
Create a Github Account
Push and Pull From Remote Repos
Close Features and Update the Remote Repo
4 Topics
GUI Clients for Git
Basic Git Commands on the Github Desktop App
Resolve Conflicts from the Github Desktop App
Revert Commits from the Github Desktop App
Complete Web Design: HTML, CSS, Javascript, Vue, React, Git
Related Web Design Courses
Thank You!
Your review has been submitted successfully.