Discover new courses and celebrate learning with us today. 🎓

Sign Up

Login

Development

Web Development

17 Complete JavaScript projects explained step by step

Enhance your JavaScript skills by building 17 practical projects from scratch! Perfect for beginners with basic HTML and CSS knowledge.

4.9

315,475 rating
11 Lessons
229 Students
Last updated 3 months ago

By Bluelime Learning Solutions

via Udemy

Brief Summary

This beginner-friendly course helps you learn JavaScript through 17 fun projects, ensuring you get hands-on experience while enhancing your web development skills.

Key Points

Build 17 complete JavaScript projects
Learn HTML and CSS fundamentals
Hands-on, practical learning experience

Learning Outcomes

Build functional web applications
Understand the basics of HTML, CSS, and JavaScript
Gain confidence in coding and project creation

About This Course

Learn faster and enhance your JavaScript skills by building 17 complete projects step by step from scratch

The best way for a beginner to enhance their skills is by practicing building various projects.

This course is a beginner course for those who have some basic knowledge of how HTML, CSS and JavaScript works.

Some of the projects you will be creating in this practical hands on course include:

Creating a functional calculator
Creating a digital clock
Creating a word count tool
Creating a button color changer
Creating a percentage tip calculator
Creating a contact form with local storage

HTML will be used to create the structure of these applications.

CSS will be used to apply styling to make the applications look nice and presentable.
Java script creates the functionality for the app and required HTML and CSS to be in place before it can do it's thing.
They are are like a canvas for JavaScript to work on.

In this course you will learn useful and practical steps to creating web based browser apps that will work when viewed with any modern web browser.
I will be using google chrome for this project and i advise you do the same.

A good text editor makes writing code fun and productive.
I will be using sublime text editor for this course. It is a cross platform text editor that will work on any platform like windows and macs.It is free to download and use but recommend that you purchase a full license after trying it out if you enjoy using it.
Another good cross platform text editor is brackets which is open source and completely free to use. By open source i mean developers from around the world can contribute to make it even better.

By the end of this course you will be confident to build more useful projects .

Create practical and useful apps for everyday use
Create a calculator
Create a digital clock

Course Curriculum

Basic Introduction

5 Lectures

Introduction

HTML document structure

Css Syntax Rule

How To Access jQuery Library

Javascript Syntax

Project 1: Creating a Calculator

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with -HTML

Styling the app with - CSS

Creating the functionality with Javascript

Project 2: Creating a digital clock

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Styling the app with - CSS

Adding functionality with - Javascript

Project 3: Creating a Percentage Tip Calculator

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Aplying the the styling with - CSS

Adding the functionality with - Javascript

Project 4: Creating a word length Calculator

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Aplying the the styling with - CSS

Adding the functionality with - Javascript

Project 5: Creating a contact form

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Aplying the the styling with - CSS

Adding the functionality with - Javascript

Project 6: Creating an app to display the day of the week

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Aplying the the styling with - CSS

Adding the functionality with - Javascript

Project 7: Creating a color changing app

6 Lectures

Overview

What we will create

Creating directory and files

Creating the app structure with - HTML

Aplying the the styling with - CSS

Adding the functionality with - Javascript

Project 8: Create an Image Slider

6 Lectures

Overview

What we will create

Creating project directory and files

Creating the structure

Applying the styling

Creating functionality with JavaScript

Project 9: Creating a maths addition game

6 Lectures

Overview

What we will create

Creating the directory and files

Creating the structure

Applying the styling

Creating the functionality

Project 10: Creating a Todo List App

7 Lectures

Overview

What we will create

Create directory and files

Create the structure for the app

Apply the styling

Adding the functionality with javascript

Adding functionality with JavaScript -Part 2

Project 11: Create an interactive quiz

7 Lectures

Overview

What we will create

Creating a directory and files

Creating the structure

Applying the styling

Adding functionality with JavaScript -part 1

Adding functionality with JavaScript -part 2

Project 12 : Create a countdown timer

6 Lectures

Overview

What we will create

Create project directory and files

Create the structure with HTML

Apply styling with CSS

Create the functionality with Javascript

Project 13: Create a balloon popping game

5 Lectures

Overview

What we will create

Create the structure with HTML

Create the styling with CSS

Create the functionality with Javascript

Project 14: Create RRS News Feed

5 Lectures

Overview

What we will create

Creating the project directory and files

Create the structure with HTML

Applying the styling and functionality

Project 15: Create a number guessing game

7 Lectures

Overview

What we will create

Create directory and files

Create the structure with HTML

Create the styling with CSS

Create the functionality - Part 1

Create the functionality - Part 2

Project 16: Create a light bulb switch effect

4 Lectures

Overview

What we will create

Create directory and files

Creating the structure and functionality

Project 17: Create a greetings message

6 Lectures

Overview

What we will create

Create directory and files for the project

Create the structure with HTML

Create the styling with CSS

Create the functionality with JavaScript

Bonus Project ( Mortgage | Loan Calculator)

4 Lectures

What we will create

Creating a directory and HTML Structure

Add Javascript Logic

Adding CSS

Instructor

Bluelime Learning Solutions

4.9

315,475 Reviews
345 Students
34 Course

Welcome to the vibrant learning hub of Bluelime Learning Solutions! Based in the UK, we are dedicated to crafting high-quality, easily digestible eLearning experiences. With a robust following of over 776,000 students and backed by more than 43,000 reviews, we take pride in delivering educational content that not only enlightens but also empowers.At Bluelime Learning Solutions, our approach is simple:...

More Courses By Bluelime Learning Solutions

Javascript for beginners

Javascript for beginners

4.9

(230)

HTML Made Simple For Beginners: Create a One Page Website

HTML Made Simple For Beginners: Create a One Page Website

4.9

(230)

SQL For Databases : A Beginner's Quick Introduction

SQL For Databases : A Beginner's Quick Introduction

4.9

(230)

Css For Beginners

Css For Beginners

4.9

(230)

Css Positioning For Absolute Beginners: A Basic Introduction

Css Positioning For Absolute Beginners: A Basic Introduction

4.9

(230)

Review

4.9 course rating

4K ratings

Syed

5.0

2 years ago

Good

Helpful
Not helpful

Jason D.

5.0

2 years ago

loading the code and then explaining what each part is doing works perfectly instead of explaining each part step by step.

Helpful
Not helpful

Metin A.

4.5

2 years ago

nice4

Helpful
Not helpful

Kladi P.

4.5

3 years ago

Amazing course

Helpful
Not helpful

Rogi

1.0

4 years ago

Unstructured mess!

The projects are way too easy, they look awful and don't teach you javascript! Furthermore, he copy-pastes code then explains what "he" did not in-depth. Would not recommend this JS course for anyone.

Helpful
Not helpful

Ty G.

4.0

4 years ago

Started out a little more basic than I was expecting.

Helpful
Not helpful

Fero H.

4.0

5 years ago

Half-way thru the course. The guy takes it really slow to explain things so even a dummy like myself can follow. Very simple projects - just what I needed. Great beginners' practice.

Helpful
Not helpful

Michael N.

4.5

5 years ago

relaxing and fun

Helpful
Not helpful

Rohan G.

4.0

5 years ago

Hello
Overall structure of course is well arranged, but some more complexity can be added which can help intermediate level people to enhance their skills.

Helpful
Not helpful

Vinni P.

5.0

5 years ago

unbelievably awesome

Helpful
Not helpful

1
2
3
4

Leave A Reply

Your email address will not be published. Required fields are marked *

Ratings

17 Complete JavaScript projects explained step by step

This course includes:

54.5 hours on-demand video
3 articles
249 downloadable resources
Access on mobile and TV
Full lifetime access
Certificate of completion

Courses You May Like

Lorem ipsum dolor sit amet elit

Show More Courses

Become a Certified Web Developer: HTML, CSS and JavaScript

4.9

(230)

By: Carolyn Welborn