Complete Web Design: HTML, CSS, Javascript, jQuery, Vue, Git

Focused View

Ivan Lourenço Gomes

31:26:02

111 View

01 - First Steps with HTML & CSS

001 Downloading Visual Studio Code.mp4

03:33

002 Basic Structure of an HTML Document.mp4

06:03

003 HTML Elements (Tags).mp4

05:16

003 Link-to-Prototype-Projects-1-2-and-3.pdf

004 Lists and Links.mp4

07:25

005 Images and Videos.mp4

06:28

006 Styles.mp4

06:37

007 HTML5 Semantic Elements.mp4

08:14

008 The Developer Tools & More CSS Properties (Part 1).mp4

10:21

009 The Developer Tools & More CSS Properties (Part 2).mp4

08:53

010 Classes, IDs, and CSS Selectors.mp4

09:53

011 Styling the Content of the Article.mp4

06:11

012 Styling the List of Links.mp4

09:58

013 Fonts.mp4

04:58

014 Styling the Social Links.mp4

11:08

015 Colors.mp4

08:00

015 Project-1.zip

015 Project-1-Invision-File.zip

02 - Diving Deeper Into HTML & CSS

001 Introducing the Next Project & Setup.mp4

09:39

001 Link-to-Prototype-Projects-1-2-and-3.pdf

002 Starting with the Header.mp4

09:41

003 Alignment of Header Items With Flexbox.mp4

10:19

004 Fixed Position on Header.mp4

11:31

005 Doing the Logo in HTML & CSS.mp4

08:27

006 Background Image of Hero Section.mp4

09:56

007 Text Area of Hero Section (Part 1).mp4

08:47

008 Text Area of Hero Section (Part 2).mp4

17:16

009 Starting the Best Sellers Area.mp4

09:53

010 The 3 Products Section.mp4

11:23

011 Individual Product Boxes.mp4

06:34

012 Product information.mp4

06:39

013 Applying the New Tag.mp4

13:56

014 Discounted price.mp4

04:41

015 Newsletter Section.mp4

07:47

016 Styling the newsletter elements.mp4

13:49

017 The Footer Element.mp4

07:14

018 Bottom Navigation.mp4

13:39

019 HTML Entities.mp4

06:12

020 Hover states.mp4

13:13

external-links.txt

03 - Responsive Design with CSS Media Queries

001 Intro to CSS Media Queries.mp4

10:56

001 Link-to-Prototype-Projects-1-2-and-3.pdf

002 Setting up the Breakpoints.mp4

13:49

003 A Note About Media Queries Organization.mp4

08:06

004 Designing the Header Navigation.mp4

17:15

005 Designing the Hero Section.mp4

12:54

006 Responsive Images with HTML5s Picture Element.mp4

10:36

007 The Best Sellers Section.mp4

14:11

007 styles-responsive-finished.zip

008 Newsletter and Footer.mp4

11:43

009 Internal Links.mp4

13:59

009 Project-2-Tech-Homepage.zip

009 Project-2-Tech-Shop-Invision.zip

04 - Hosting & Domain - Publishing Our Website Online

001 Hosting and Domain - A Brief Explanation.mp4

05:12

002 Using a Free Hosting Service.mp4

11:45

003 Configuring FTP.mp4

07:56

004 Using a Paid Hosting Service.mp4

11:03

005 Setting up a Customized .COM Domain Name.mp4

10:01

05 - Javascript Basics

001 Javascript Course Intro.mp4

06:23

001 javascript-course.zip

002 First Steps With Javascript.mp4

08:45

003 Javascript Syntax.mp4

07:00

004 DOM - Document Object Model.mp4

02:56

005 Working With The DOM.mp4

08:50

006 Variables.mp4

13:59

007 Data Types Strings.mp4

09:15

008 Data Types Numbers (Part 1).mp4

10:39

009 Data Types Numbers (Part 2).mp4

06:16

010 Data Types Booleans.mp4

11:25

011 Data Types Null and Undefined.mp4

05:38

012 List Of Exercises # 1.mp4

05:58

013 List Of Exercises # 1 (Solution - Part 1).mp4

14:26

014 List Of Exercises # 1 (Solution - Part 2).mp4

10:28

015 Functions.mp4

09:41

016 Data Types Arrays.mp4

12:58

017 Data Types Objects.mp4

10:23

018 Objects Methods.mp4

08:09

019 List Of Exercises # 2.mp4

03:21

020 List Of Exercises # 2 (Solution - Part 1).mp4

17:45

021 List Of Exercises # 2 (Solution - Part 2).mp4

09:56

06 - Diving Deeper into Javascript

001 Events.mp4

17:00

002 CSS Manipulation.mp4

09:45

003 More getElement Methods.mp4

06:13

004 For and For in Loops.mp4

17:55

005 While Loops.mp4

05:07

006 Conditionals.mp4

09:53

007 Conditionals (Part 2).mp4

10:01

008 Nested Loops and Conditionals.mp4

15:07

009 Variable Scope.mp4

14:37

010 List Of Exercises # 3.mp4

04:39

011 List Of Exercises # 3 (Solution - Part 1).mp4

10:59

012 List Of Exercises # 3 (Solution - Part 2).mp4

15:07

013 List Of Exercises # 3 (Solution - Part 3).mp4

12:36

014 BOM - Browser Object Model.mp4

09:16

015 Date & Time.mp4

11:00

016 Challenge - Calculating Date Intervals.mp4

06:35

017 Time Methods.mp4

13:25

018 Clock Challenge.mp4

09:50

019 Break and Continue.mp4

08:35

020 Forms.mp4

14:55

021 Forms (Part 2).mp4

09:18

022 The onchange Event.mp4

14:57

023 List Of Exercises # 4.mp4

03:53

024 List Of Exercises # 4 (Solution - Part 1).mp4

13:59

025 List Of Exercises # 4 (Solution - Part 2).mp4

14:29

026 List Of Exercises # 4 (Solution - Part 3).mp4

12:04

027 List Of Exercises # 4 (Solution - Part 4).mp4

11:02

028 List Of Exercises # 4 (Solution - Part 5).mp4

17:47

07 - Project # 3 - WeDesign Website

001 Presentation.mp4

06:23

001 Wedesign-en.zip

002 Mobile Menu.mp4

05:15

003 About Us Section.mp4

13:26

004 Our Services Sections.mp4

14:14

005 Contact Form.mp4

15:34

006 Copyright Year on Footer.mp4

03:39

006 Wedesign-solved.zip

08 - jQuery

001 jQuery Intro.mp4

06:52

002 jQuery Syntax.mp4

11:06

003 DOM Manipulation.mp4

12:01

004 Forms.mp4

13:06

005 Forms (Part 2).mp4

08:35

006 CSS Classes Manipulation.mp4

05:20

007 Events.mp4

09:52

008 Events Challenge.mp4

07:35

009 Effects.mp4

12:46

010 The Animate Method.mp4

08:30

011 Download The scripts.js File Used Throughout The Course.html

09 - Project # 4 - Online T-Shirt Store

001 Presentation of the project.mp4

06:38

001 tshirts.zip

002 Getting the Search Parameters.mp4

11:36

003 Update Order Details.mp4

15:38

004 Calculate the Price.mp4

14:16

005 Update the Product Photo.mp4

04:40

006 The Change Event For The Quantity and Style Filters.mp4

05:05

007 The Change Event For The Color and Quality Filters.mp4

13:46

008 Formatting the Price.mp4

12:33

008 tshirts-solved.zip

10 - Vue JS Basics - Project #5

001 Setting up the Workspace.mp4

07:13

001 Vue-Course-Material.zip

002 Declarative Rendering and Data Objects.mp4

09:40

003 Setting up Vue Dev Tools.mp4

06:31

004 Directives and For Loops.mp4

10:40

005 Event Handlers - The v-on Directive.mp4

10:05

006 A Bug in Chrome Dev Tools.mp4

03:10

007 Event Modifiers (Stop Propagation) and Attribute Binding.mp4

07:20

008 Filling up The Order Details Section.mp4

07:28

009 Working with Methods.mp4

12:49

010 User Input and Two-Way Data Binding (Part 1).mp4

09:20

011 User Input and Two-Way Data Binding (Part 2).mp4

06:41

11 - Project #6 - To-Do List App

001 Project Presentation - To-Do List App.mp4

05:10

002 Setting up Vue JS.mp4

07:53

003 Adding To-Dos.mp4

07:35

004 Setting the Done & Undone Functionality.mp4

06:55

005 Using Localstorage to Load To-dos.mp4

07:38

006 Lifecycle Hooks.mp4

12:00

007 Loading Data from Localstorage.mp4

04:43

008 Updating Localstorage on Clear and Update.mp4

11:18

12 - Project #7 - Quiz Game Project using the Vue CLI

001 Project Presentation - Quiz Game.mp4

09:22

002 Create a Vue JS Application with the Vue CLI.mp4

13:15

003 The Application Boiler Plate.mp4

13:53

004 Clean up Unused Component and HTML Structure.mp4

10:55

005 HTTP Requests with Axios.mp4

09:44

006 Making Requests to the Open Trivia API.mp4

05:51

007 Showing the Question Data on the Page.mp4

08:22

008 The Answers Array - Computed Properties.mp4

08:46

009 Shuffling the Answers Array.mp4

11:10

010 Rendering the Answers Radio Buttons.mp4

13:54

011 Submitting the Answer.mp4

09:36

012 Presenting the Result.mp4

12:10

013 Getting the Next Question.mp4

09:53

014 The Score Component.mp4

09:35

015 Passing Data to Child Components.mp4

10:03

13 - Project #8 - Vuex & Vue Router

001 Project Presentation - Shopping Bag.mp4

10:47

002 Setting up Vue Router.mp4

10:08

003 Using Axios to Get Products Data.mp4

05:10

004 Working with Vuex.mp4

09:24

005 Setting Up Actions and Mutations - Part 1.mp4

09:51

006 Setting Up Actions and Mutations - Part 2.mp4

06:21

007 Rendering the Products.mp4

07:11

008 Adding Products to Bag.mp4

12:56

009 Avoiding Repeated Items on Shopping Bag.mp4

08:10

010 Removing Items from Bag.mp4

09:24

011 The Mapstate Helper.mp4

09:53

012 Listing items in the Shopping Bag.mp4

11:37

013 Calculating the Order Total.mp4

11:55

14 - Project #9 - Composition API

001 Options API x Composition API.mp4

07:38

002 Project Presentation - Task Manager.mp4

07:03

002 Task-Manager-Initial-and-Final.zip

003 Reactivity with Ref.mp4

05:54

004 Reactivity with Reactive.mp4

08:43

005 Components, Props and Scoped Styles.mp4

08:49

006 Adding IDs to Tasks.mp4

07:53

007 Filtering Tasks By State.mp4

09:38

008 Computed Properties.mp4

04:31

009 Code for the Modal Component.html

010 The Modal Component.mp4

07:02

011 Component Slots.mp4

07:05

15 - State Management with Pinia - The Vuex Replacement

001 What is State.mp4

04:27

002 Getting Started with Pinia.mp4

08:32

003 Completing the Tasks Store.mp4

09:42

004 The New Task Modal Functionality.mp4

08:16

005 Adding the State to the Local Storage.mp4

09:48

16 - Getting Started With Git

001 Introduction.mp4

02:55

002 Git Installation.mp4

05:10

003 How to Run Git.mp4

03:24

004 Create a New Repo.mp4

02:55

005 Add Files to the Staging Area and Create Your First Commit.mp4

07:34

006 When to Commit - Best Practices.mp4

06:16

007 The VS Code Source Control Tab.mp4

03:10

008 Exercise #1.mp4

08:17

17 - Branches

001 The Importance of Branches.mp4

03:36

002 Working with Branches.mp4

10:54

003 Merging Branches.mp4

05:50

004 Resolving Conflicts.mp4

06:44

external-links.txt

18 - Remote Repos

001 Create a Github Account.mp4

10:40

002 Push and Pull From Remote Repos.mp4

08:02

003 Close Features and Update the Remote Repo.mp4

06:28

19 - GUI Clients for Git

001 GUI Clients for Git.mp4

04:13

002 Basic Git Commands on the Github Desktop App.mp4

07:07

003 Resolve Conflicts from the Github Desktop App.mp4

04:35

004 Revert Commits from the Github Desktop App.mp4

04:05

Description

6 Courses in 1! Learn Webdesign and Become a Professional Front End Web Developer! From Complete Beginner to Advanced.

What You'll Learn?

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

Who is this for?

Students aiming at starting a career as a Web Developer

Freelance entrepreneurs willing to start building and selling custom-made websites

Students looking to begin learning to code and taking the first steps on Programming and Web Development

Every person looking to learn new skills & technologies

Web developers who want to master Vue JS to build modern web applications

What You Need to Know?

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

No paid software required

More details

Description
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!
Who this course is for:
Students aiming at starting a career as a Web Developer
Freelance entrepreneurs willing to start building and selling custom-made websites
Students looking to begin learning to code and taking the first steps on Programming and Web Development
Every person looking to learn new skills & technologies
Web developers who want to master Vue JS to build modern web applications

User Reviews

Rating

average 0

Total votes0

Focused display

Ivan is a top Udemy instructor currently teaching 17 courses in 4 languages with 420.000+ students worldwide.He became famous for his hands-on and easy-to-grasp teaching style using techniques that can benefit students from all levels, from complete beginners to advanced professionals.Ivan studied Business in college and has been working for multinational companies since 2004. He has a strong experience in various business areas, such as Sales, Purchasing, Logistics, International Trading, Accounting and Production.In 2014 he made a transition to I.T., where he quickly grew from a Front End Web Developer to the Product Owner and Leader of a Web Development Team at a big e-commerce UK company. Some of his courses include:• HTML / CSS• Javascript• Vue JS, Vue Router and Vuex• PHP• Web Design• Invision Studio• Python• Machine Learning• Microsoft Excel• Email Writing and EtiquetteEnroll now in one of his courses and start learning hot topics in Business, Web Development and Programming!

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.