Mô tả

Overview

In this course, you will learn the basic fundamentals of how to build websites from the ground up. No previous knowledge is required to take this course, you will learn from the absolute beginning and start coding in a short time.

This is an exclusive course, which includes the 6 most important languages ​​and technologies in Front-End Web Development and its main topics:


  • HTML5

  • CSS3

  • Semantic elements

  • Complete Guide to Colors and Fonts in CSS

  • Flexbox

  • Responsive design and CSS media queries

  • Working with Figma design prototypes

  • FTP, Domain and Hosting

  • Javascript from Zero to Advanced

  • Data Types in-depth

  • Functions, loops and conditionals

  • Javascript best practices

  • Image galleries and product filters in Javascript

  • HTTP requests with the Fetch method

  • Working with external APIs

  • Vue JS from Zero to Advanced

  • Composition API

  • State Management with Pinia

  • Multi-page apps with Vue Router

  • Vue Dev Tools

  • Vue CLI and Vite

  • Git from Zero to Advanced

  • Best practices in version control

  • Git on the command line, VS Code source control and GUI applications

  • Complete Guide to Branches

  • Github and other remote servers

  • Github Desktop App


Our Hands-on Method

With our hands-on step-by-step method with real-life projects, challenges and exercises you will learn how to build beautiful web pages in a fun and intuitive way.

This course offers 170 lessons with 32 hours of video, 9 real-life projects, several lists of exercises and complete course material for download.

Start your career as a Web Developer!

Whether you are aiming at starting a career in the tech industry or you are a freelance web designer who wants to learn front-end development, or even if you just want to learn how to build websites as a hobby, this course will take you there fast.

Being the building blocks of the world wide web, HTML, CSS, Javascript, jQuery, Vue JS & Git are fundamental skills for any IT professional.

With these skills, you can build your own digital products, work as a freelancer or pursue a successful career in a big tech company. No matter the path you choose, this course is going to provide you with high-quality content and a great learning experience to help you achieve all your goals.

Join 20,000+ students worldwide in this highest-rated course. and Enroll now and let's start building amazing websites and web applications!

Bạn sẽ học được gì

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

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

Yêu cầu

  • No previous knowledge in programming is required, we'll teach you everything from the beginning
  • No paid software required

Nội dung khoá học

19 sections

First Steps with HTML & CSS

17 lectures
Downloading Visual Studio Code
03:33
Basic Structure of an HTML Document
06:03
HTML Elements (Tags)
05:16
Lists and Links
07:25
An Ordered List of Links
1 question
Images and Videos
06:28
Styles
06:37
HTML5 Semantic Elements
08:14
The Developer Tools & More CSS Properties (Part 1)
10:21
The Developer Tools & More CSS Properties (Part 2)
08:53
Styling Elements with CSS
1 question
Classes, IDs, and CSS Selectors
09:53
Styling the Content of the Article
06:11
Styling the List of Links
09:58
Fonts
04:58
Styling the Social Links
11:08
Colors
08:00

Diving Deeper Into HTML & CSS

20 lectures
Introducing the Next Project & Setup
09:38
Starting with the Header
09:40
Alignment of Header Items With Flexbox
10:19
Fixed Position on Header
11:30
Doing the Logo in HTML & CSS
08:27
Background Image of Hero Section
09:56
Text Area of Hero Section (Part 1)
08:47
Text Area of Hero Section (Part 2)
17:16
Starting the Best Sellers Area
09:53
The 3 Products Section
11:23
Individual Product Boxes
06:34
Product information
06:39
Applying the New Tag
13:56
Discounted price
04:40
Newsletter Section
07:46
Styling the newsletter elements
13:49
The Footer Element
07:13
Bottom Navigation
13:39
HTML Entities
06:12
Hover states
13:12

Responsive Design with CSS Media Queries

9 lectures
Intro to CSS Media Queries
10:56
Setting up the Breakpoints
13:49
A Note About Media Queries Organization
08:06
Designing the Header Navigation
17:15
Designing the Hero Section
12:54
Responsive Images with HTML5's Picture Element
10:36
The Best Sellers Section
14:11
Newsletter and Footer
11:43
Internal Links
13:59

Hosting & Domain - Publishing Our Website Online

5 lectures
Hosting and Domain - A Brief Explanation
05:12
Using a Free Hosting Service
11:45
Configuring FTP
07:56
Using a Paid Hosting Service
11:03
Setting up a Customized .COM Domain Name
10:01

Javascript Basics

24 lectures
Javascript Course Intro
06:23
First Steps With Javascript
08:45
Javascript Syntax
07:00
DOM - Document Object Model
02:56
Working With The DOM
08:50
Manipulate HTML elements
1 question
Variables
13:59
Data Types: Strings
09:15
Working With Strings
1 question
Data Types: Numbers (Part 1)
10:39
Data Types: Numbers (Part 2)
06:15
Data Types: Booleans
11:25
Data Types: Null and Undefined
05:37
List Of Exercises # 1
05:58
List Of Exercises # 1 (Solution - Part 1)
14:26
List Of Exercises # 1 (Solution - Part 2)
10:28
Functions
09:40
Functions
1 question
Data Types: Arrays
12:58
Data Types: Objects
10:23
Objects Methods
08:09
List Of Exercises # 2
03:21
List Of Exercises # 2 (Solution - Part 1)
17:45
List Of Exercises # 2 (Solution - Part 2)
09:55

Diving Deeper into Javascript

29 lectures
Events
17:00
CSS Manipulation
09:45
More getElement Methods
06:13
For and For in Loops
17:55
While Loops
05:07
Conditionals
09:53
Conditionals (Part 2)
10:01
Nested Loops and Conditionals
15:07
Variable Scope
14:37
List Of Exercises # 3
04:39
List Of Exercises # 3 (Solution - Part 1)
10:58
List Of Exercises # 3 (Solution - Part 2)
15:07
List Of Exercises # 3 (Solution - Part 3)
12:36
BOM - Browser Object Model
09:16
Date & Time
11:00
Date & Time
1 question
Challenge - Calculating Date Intervals
06:35
Time Methods
13:25
Clock Challenge
09:50
Break and Continue
08:35
Forms
14:55
Forms (Part 2)
09:18
The onchange Event
14:57
List Of Exercises # 4
03:53
List Of Exercises # 4 (Solution - Part 1)
13:58
List Of Exercises # 4 (Solution - Part 2)
14:29
List Of Exercises # 4 (Solution - Part 3)
12:04
List Of Exercises # 4 (Solution - Part 4)
11:02
List Of Exercises # 4 (Solution - Part 5)
17:47

Project # 3 - WeDesign Website

6 lectures
Presentation
06:23
Mobile Menu
05:14
About Us Section
13:26
Our Services Sections
14:14
Contact Form
15:34
Copyright Year on Footer
03:39

jQuery

11 lectures
jQuery Intro
06:52
jQuery Syntax
11:06
DOM Manipulation
12:01
Forms
13:06
Forms (Part 2)
08:34
CSS Classes Manipulation
05:20
Events
09:52
Events Challenge
07:34
Effects
12:46
The Animate Method
08:30
Download The scripts.js File Used Throughout The Course
00:00

Project # 4 - Online T-Shirt Store

8 lectures
Presentation of the project
06:38
Getting the Search Parameters
11:36
Update Order Details
15:38
Calculate the Price
14:15
Update the Product Photo
04:40
The Change Event For The Quantity and Style Filters
05:05
The Change Event For The Color and Quality Filters
13:46
Formatting the Price
12:33

Vue JS Basics - Project #5

11 lectures
Setting up the Workspace
07:13
Declarative Rendering and Data Objects
09:39
Setting up Vue Dev Tools
06:31
Directives and For Loops
10:40
Event Handlers - The v-on Directive
10:04
A Bug in Chrome Dev Tools
03:10
Event Modifiers (Stop Propagation) and Attribute Binding
07:20
Filling up The Order Details Section
07:27
Working with Methods
12:49
User Input and Two-Way Data Binding (Part 1)
09:20
User Input and Two-Way Data Binding (Part 2)
06:41

Project #6 - To-Do List App

8 lectures
Project Presentation - To-Do List App
05:10
Setting up Vue JS
07:53
Adding To-Dos
07:35
Setting the Done & Undone Functionality
06:54
Using Localstorage to Load To-dos
07:38
Lifecycle Hooks
12:00
Loading Data from Localstorage
04:42
Updating Localstorage on Clear and Update
11:18

Project #7 - Quiz Game Project using the Vue CLI

15 lectures
Project Presentation - Quiz Game
09:22
Create a Vue JS Application with the Vue CLI
13:15
The Application Boiler Plate
13:53
Clean up Unused Component and HTML Structure
10:55
HTTP Requests with Axios
09:44
Making Requests to the Open Trivia API
05:51
Showing the Question Data on the Page
08:21
The Answers Array - Computed Properties
08:46
Shuffling the Answers Array
11:09
Rendering the Answers Radio Buttons
13:54
Submitting the Answer
09:36
Presenting the Result
12:10
Getting the Next Question
09:53
The Score Component
09:35
Passing Data to Child Components
10:03

Project #8 - Vuex & Vue Router

13 lectures
Project Presentation - Shopping Bag
10:47
Setting up Vue Router
10:08
Using Axios to Get Products Data
05:10
Working with Vuex
09:24
Setting Up Actions and Mutations - Part 1
09:51
Setting Up Actions and Mutations - Part 2
06:21
Rendering the Products
07:10
Adding Products to Bag
12:56
Avoiding Repeated Items on Shopping Bag
08:10
Removing Items from Bag
09:23
The Mapstate Helper
09:53
Listing items in the Shopping Bag
11:37
Calculating the Order Total
11:55

Project #9 - Composition API

11 lectures
Options API x Composition API
07:38
Project Presentation - Task Manager
07:03
Reactivity with Ref
05:54
Reactivity with Reactive
08:43
Components, Props and Scoped Styles
08:49
Adding IDs to Tasks
07:53
Filtering Tasks By State
09:38
Computed Properties
04:30
Code for the Modal Component
00:57
The Modal Component
07:02
Component Slots
07:05

State Management with Pinia - The Vuex Replacement

5 lectures
What is State?
04:26
Getting Started with Pinia
08:32
Completing the Tasks Store
09:42
The New Task Modal Functionality
08:16
Adding the State to the Local Storage
09:48

Getting Started With Git

8 lectures
Introduction
02:55
Git Installation
05:10
How to Run Git
03:24
Create a New Repo
02:55
Add Files to the Staging Area and Create Your First Commit
07:34
When to Commit - Best Practices
06:16
The VS Code Source Control Tab
03:09
Exercise #1
08:17

Branches

4 lectures
The Importance of Branches
03:36
Working with Branches
10:54
Merging Branches
05:50
Resolving Conflicts
06:44

Remote Repos

3 lectures
Create a Github Account
10:40
Push and Pull From Remote Repos
08:02
Close Features and Update the Remote Repo
06:28

GUI Clients for Git

4 lectures
GUI Clients for Git
04:13
Basic Git Commands on the Github Desktop App
07:07
Resolve Conflicts from the Github Desktop App
04:35
Revert Commits from the Github Desktop App
04:05

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.