Complete Web Development Course: HTML, Vue.js, PHP, MySQL
4.5 (1,003 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
4,671 students enrolled

Complete Web Development Course: HTML, Vue.js, PHP, MySQL

HTML5, CSS3, JavaScript, jQuery, Responsive Web Page, VueJS, AJAX, PHP, CLI, NPM, Babel, Webpack, MySQL, OOP, Express.js
4.5 (1,003 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
4,671 students enrolled
Created by OnlyKiosk Tech
Last updated 2/2020
English
English [Auto]
Current price: $139.99 Original price: $199.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 32.5 hours on-demand video
  • 123 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Develop the ability of solving problems by yourself
  • Master HTML, CSS, JS, and Vue.js
  • Create 12+ Front-end APPs using HTML, CSS, JS, jQuery and Vue.js
  • Create 12+ Back-end APPs using PHP and MySQL
  • Create responsive and retina-ready web pages
  • Operate MySQL database
  • Master advanced MySQL operation such as transaction, prepared statement, pagination, etc.
  • Create a memebership system
  • Master image-processing skills like CAPTCHA, thumbnail, watermark and image cropper
  • Master Command Line Instrument
  • Master NPM
  • Master Babel
  • Master Webpack
  • Being able to create modern front-end apps using single-file components
  • Master Vue
  • TCP/IP protocol suite
  • Data structure
Course content
Expand all 600 lectures 32:36:01
+ Basic TCP/IP knowledge
8 lectures 28:05
TCP/IP introduction and the four layers
02:29
The application layer and how COOKIE works
06:56
The transport layer: three-way handshake
03:38
The transport layer: four-way wave
02:42
The transport layer: HTTP Keep-Alive vs. TCP keepalive
00:58
The internet layer
04:10
Port and scoket
03:18
The full process
03:54
+ Basic web hardware knowledge
4 lectures 13:08
Cables
04:33
Hub and switch
03:17
Bridge and router
02:31
NAT and DHCP
02:47
+ Start coding and working on the invisible part
8 lectures 21:30

What is version declaration?

How to read version declaration of XHTML?

How to declare and read version declaration of HTML 5?

Watch this lesson to find out. 

The first line of your HTML code: version declaration
03:19

Browser has a high tolerance for bad HTML codes. But this does not mean you should write bad HTML codes. Watch this lesson to find out what kinds of rules you need to follow. 

HTML Rules and Grammars
03:30

<html>,<head>,<body>, and <title>

They are the four indispensable tags for every HTML file you create.

The four indispensable HTML tags
01:13

In this lesson, we will show you how to create a standard and decent HTML file.

Create your first standard HTML file
02:25

Have you ever wondered what the small icon image is on the tab of your browser window?

Do you want to know how to create and install that icon image?

Watch this lesson to find out how. 

Adding a Favicon
05:09

META is the hidden hero that contributes to your web page in silence, behind the scene. Because of this, many people tend to overlook the importance of META.

In this lesson, we will show you the important role played by META in achieving good SEO results. 

Use META to achieve better SEO results
02:28

If you are running a multi-lingual web page, META is particularly as it is what we use to set language encoding. 


Use META for multilingual web pages
02:18

META allows us to control the behaviour of web page, for example, we can set auto-renewal using it. 

Use META for page behaviour control: auto page renewal, etc.
01:08
+ Creating the visible part
3 lectures 06:21

What it feels like developing front-end program for dynamic websites?

Front-end development for dynamic websites
01:58

Analyze page structure: header, footer, main area, etc.

Page Structure Analysis
02:22

Text is one of the most important element in a web page. So it is imperative that you know how to handle texts properly. In this lesson, we will show you the basic rules you must follow when displaying texts. 

How to display texts properly
02:01
+ CSS: Cascading Style Sheet
7 lectures 19:11

What is Cascading Style Sheet


CSS Introduction
01:59

What is inline CSS?

How to use STYLE attribute?

Basic structure of CSS property.

Inline CSS: Part 1
03:26

What is inline CSS?

How to use STYLE attribute?

Basic structure of CSS property.

Inline CSS: Part 2
01:34

Internal CSS and type selector.

Internal CSS and CSS Type Selector: Part 1
03:03
Internal CSS and CSS Type Selector: Part 2
02:22

Class Selector and ID Selector: giving you a more accurate control

Class and ID Selector-- More Accurate Control
03:09

The priority order.

When ID, Class, and Type selectors are styling the same HTML element, whose order will be followed in the end? 

The Priority Order of CSS Selectors
03:38
+ Vital Difference between BLOCK and INLINE tags
8 lectures 18:57

Learn a new tag: SPAN and the new tag belongs to a new category: inline.

SPAN and the concept of BLOCK and INLINE tags
02:32

Discover and compare the difference between block and inline.

The Difference between BLOCK and INLINE Tags PART 1
01:47

Discover and compare the difference between block and inline.

The Difference between BLOCK and INLINE Tags PART 2
03:10

Discover and compare the difference between block and inline.

The Difference between BLOCK and INLINE Tags PART 3
01:37

Get rid of default CSS styles so that our own design will not be affected.

Initialising CSS: Getting Rid of Default CSS Styles
02:41
Miscellansous Issues about Styling Texts
01:02

How to use your own font file in your web project

Use Your Own Font
02:35

EM: control all font size

For Responsive Web Design: Using EM, Not Pixel
03:33
+ Image Display and things you should pay attention to
8 lectures 17:24

How to display images and security measures you should take. 

Display Image: Part 1
02:24

How to display images and security measures you should take. 

Image Display Part 2
01:41

The new category: inline-block.

Inline-block allows you to set its width and height but is also willing to share its line with others. 

The INLINE-BLOCK Type
01:33

Creating a window using DIV.

Fill this window with image using the background property.

This is how you display an icon.

Display ICON Part-1
03:02
Display ICON Part-2
01:25
Display ICON Part-3
02:05
Display ICON Part-4
01:42
+ Collect data: FORM and INPUT
3 lectures 07:09
INPUT Part-1
01:56
INPUT Part-2
03:17
INPUT Part-3
01:56
+ URL, External CSS and Comments
5 lectures 10:49

What is relative URL and why we need it.

Preview 01:13
Relative URL-Part 2
03:35
Relative URL-Part 3
01:11
External CSS
03:27
Comments
01:23
Requirements
  • A smart phone with a decent camera is recommended for taking notes
  • A computer (PC/Mac) with internet access is needed
  • All software needed in the class is free of charge and easy to install and run
  • No previous coding experience needed
Description

What you will learn from this course:

  1. HTML   

  2. CSS

  3. JavaScript   

  4. Responsive Web Page

  5. Ajax

  6. jQuery   

  7. font awesome   

  8. Vue.js

  9. animate.css

  10. PHP   

  11. MySQL   

  12. Command Line

  13. NPM

  14. Babel

  15. Webpack

  16. ES6 Import and export

  17. VueJS CLI

  18. Vue.js single-file components

  19. Vue Router

  20. Advanced JavaScript: scope, scope chain, JavaScript Garbage Collection, Closure, IIFE(Instantly Invoked Function Expression), THIS, etc. 

  21. Express.js

All subjects are taught from ground zero. Therefore, no previous coding experience is needed. 

Based on user feedback and tech development, we will keep adding new contents to our course. For example, we just added contents teaching Vue.js.   

For better user experience, all course contents are voiced by professional voice-over artists. Therefore, new contents may be voiced by a different voice artist.  

Why not learn from free YouTube videos, manuals and online tech blogs?  

Web development has been a popular area for years. The internet has accumulated tons of free tutoring videos and materials. Some of them are actually really good!  

Even if you are stuck with questions you cannot solve, just post them on stackoverflow, you will have your answers within a few minutes. The answers you get are also really great!  

With all the free tutoring materials and teachers, what is the point of creating this paid online course?  

It depends on your own situation and what you want.  

If you already have lots of coding experience, then learning web development is actually very simple for you. All you need is to familiarize yourself with a new set of coding grammars and functions.  

But if you have no coding experience before, then learning to code can be rather challenging. In this case, you will find that learning from a well-designed course can make your life a lot easier. You will make faster progress as well.  

If you just want to have a rough idea of how web apps work and create some basic programs, then there is really no need for you to pay for any courses. Free internet information is more than enough to meet your demands.  

If you want to be able to turn your design and idea into programs that are also safe and efficient enough to be applied in real life, and most importantly, you want to do this as soon as possible, then learning from a well-designed and considerate course is your best choice.  

You will be shown directly where the best route is. With all the detours being avoided, you can therefore save lots of time and efforts.  

Why us:  

Most online students can only devote partly to their study. They still have other things going on in their life. Their study will often be interrupted.  

We believe this is also situation most of our students are facing.  

Therefore, when designing course contents, we have arranged lots of review sessions. In our Vue course, we even ask you to take photos of screenshots.  

All our projects will be broken into small bits. We only focus on one bit at a time. In the end, we will combine everything together and create complicated APPs.  

Every time previous knowledge is needed, we will either remind you to review previous lessons or directly give you a review to fresh your memory.  

In this way, we can keep strengthening foundation while putting more weight on it. Eventually, you will master everything we cover in this course.  

In summary, explaining new knowledge to you is NOT our goal. Our goal is to help you master new knowledge as well and fast as possible. 

Who this course is for:
  • Anyone who wants to learn web development
  • Anyone who wants to learn to Vue.js
  • Anyone who wants to earn a living by becoming a web developer
  • Anyone who wants to start their own business
  • Anyone who wants to be their own boss by becoming a freelance web developer
  • Anyone who wants to strengthen their fundamental skills
  • Anyone who wants to enhance their skills and go higher
  • Anyone who wants to learn how to use Command Line, NPM, and Babel
  • Anyone who wants to learn how to use webpack
  • Anyone who wants to learn TCP/IP