YoVDO

Build 6 Web Projects with HTML, CSS, and JavaScript

Offered By: Skillshare

Tags

HTML & CSS Courses Javascript Courses

Course Description

Overview

Welcome to HTML, CSS and JavaScript Course on Skillshare.

"HTML, CSS, JavaScript - Build 6 Creative Projects".

If you want to get your hands dirty in three core technologies - HTML, CSS and JavaScript, then this is the right course for you. You will be able to build 6 modern, beautiful and creative projects. Learn how to create cool CSS animations and awesome 3D effects.

INCLUDED:

Project 1 - Invisible Card

In this project, you will build a nice profile card. You will be able to learn how to manipulate backgrounds and create some cool effects. The project will be built based on HTML and CSS

Project 2 - Sign Up Form

The second project will represent a modern-looking and beautiful sign-up form. The project will consist of two parts. The first part will be a nice banner with little CSS animation and using the banner button you will be navigated to the sign-up form. The project will be created using HTML, CSS, and JavaScript

Project 3 - Profile Cards

In this project, you will build three beautiful profile cards with some cool animations. Besides cards, we will have a heading with typing text animation. It will be created using JavaScript. Also, we will use CSS keyframes to create a nice animated button with a hover effect.

Project 4 - Slideshow

The fourth project is going to be a slideshow. It will consist of two parts. We will have a banner with the header and 3D button. Banner elements will have some really nice and beautiful animations. By clicking the button, we will move on to slideshow. The slideshow will be created using pure CSS. Each slide will represent the famous cities of the world. The project will be based on HTML, CSS, and JavaScript.

Project 5 - Hamburger Menu

In this project, you will be able to learn how to create Hamburger Menu. The project will consist of two parts. The first part is going to be banner, in which you will be able to build a 3D button with a hover effect. By clicking on the Hamburger menu icon, we will be navigated to the second part of the project. It will be Navbar with two different Navigations. In this project, you will learn about how to create really modern and nice 3D effects. The project will be based on HTML, CSS, and JavaScript

Project 6 - Cube

The sixth project will be the most interesting and advanced one. We will create slideshow represented by a 3D cube. The project will be based on HTML, CSS, and JavaScript. We are going to use really advanced stuff from CSS and relatively lots of JavaScript. After building this project you will be capable to create modern, advanced and beautiful projects on your own.

Get fast and friendly support from instructors 24/7.

JOIN US!!!


Syllabus

  • Welcome
  • Introduction
  • Setup
  • Project Invisible Card Overview
  • Invisible Card HTML Markup
  • Invisible Card Style Part 1
  • Invisible Card Style Part 2
  • Invisible Card Style Part 3
  • Invisible Card Style Part 4
  • Project Sign Up Form Overview
  • Sign Up Form HTML Markup
  • Sign Up Form Style Part 1
  • Sign Up Form Style Part 2
  • Sign Up Form Style Part 3
  • Sign Up Form Style Part 4
  • Sign Up Form Style Part 5
  • Sign Up Form Make Project Responsive
  • Project Profile Cards Overview
  • Profile Cards HTML Markup
  • Profile Cards Style Part 1
  • Profile Cards Style Part 2
  • Profile Cards Style Part 3
  • Profile Cards Typed Text
  • Profile Cards Blinking Cursor
  • Profile Cards Make Project Responsive
  • Project Slideshow Overview
  • Slideshow HTML Markup
  • Slideshow Style of Banner Part 1
  • Slideshow Style of Banner Part 2
  • Slideshow Style of Banner Part 3
  • Slideshow Create Slideshow Part 1
  • Slideshow Create Slideshow Part 2
  • Slideshow Make Project Responsive
  • Project Hamburger Menu Overview
  • Hamburger Menu HTML Markup
  • Hamburger Menu Style of Banner
  • Hamburger Menu Create 3D Button
  • Hamburger Menu Layout of Top Nav
  • Hamburger Menu Create 3D Navigation Items
  • Hamburger Menu Layout of Bottom Nav
  • Hamburger Menu Prepare Sicial Media Icons
  • Hamburger Menu Ceate 3D Effect with Social Icons
  • Hamburger Menu Make Hamnurger Menu Work
  • Hamburger Menu Make Project Responsive Part 1
  • Hamburger Menu Make Project Responsive Part 2
  • Project Cube Overview
  • Cube HTML Markup
  • Cube Style Part 1
  • Styling Part 2
  • Styling Part 3
  • Cube Style of Controls
  • Cube Add JavaScript to the Project Part 1
  • Cube Add JavaScript to the Project Part 2
  • Cube Add JavaScript to the Project Part 3

Taught by

Gio LM

Related Courses

Intro to HTML and CSS
Udacity
Responsive Web Design Fundamentals
Google via Udacity
HTML5 and CSS Fundamentals
World Wide Web Consortium (W3C) via edX
CSS Basics
Microsoft via edX
Advanced CSS Concepts
Microsoft via edX