JavaScript for beginners: Create 27 projects from scratch

Learn JavaScript with practical and useful step by step hands-on projects

4.60 (185 reviews)
Udemy
platform
English
language
Web Development
category
26,995
students
17.5 hours
content
Jun 2021
last update
$49.99
regular price

What you will learn

Install and use a text editor

Understand Data Types

Understand Variables

Understand Constants

Understand Arrays

Understand Functions

Understand Conditional statements

Understand Arrow functions

Use comments

Build 27 projects

Description

JavaScript is the most popular scripting language in the world. It is responsible for the interactivity like games, online forms or surveys and other activities user’s can engage with on a website. Most dynamic if not all website contains some element of JavaScript.

JavaScript programming language drives millions of interactive web sites, powers fast web servers and can even be used to build desktop and mobile applications

In this course we will together create 27 beginner JavaScript projects from scratch. The projects are listed below:

Analogue Clock
Mortgage| Loan Calculator
Quote of the day app
BMI Calculator
Weight Coversion App
Theme color changer
2d breakout game
Digital calculator
Digital clock
Event countdown timer
Tip calculator
Word count tool
Contact form
Day of week app
Background color changer
Image slider
Addition game
Todo List App
Interactive Quiz App
Countdown Timer
Baloon Popping Game
RRS NewsFeed
Number guessing game
Light switch effect
Greeting message
Height Conversion App
Wack a mole game

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  a mixture of text editors for this course  .

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

Content

Getting Started

Introduction
What is JavaScript
Plain-Text Editors
Installing Sublime Text Editor
Installing Brackets
Where to Place JavaScript
JavaScript Syntax

Some JavaScript Basics

Data Types
JavaScript Operators
Variables
Const Variable
Arrays
Functions
Conditional statements
Arrow functions
Undefined
Null
Object
Typeof Operator
JavaScript Events
JavaScript Comments
Using Mozilla Console and Scratch-Pad

Project 1: Analogue Clock

What we will create
Creating project folder and HTML
Creating Canvas Object
Creating the clock face
Drawing the clock numbers
Drawing the time and hand

Project 2: Mortgage | Loan Calculator

What we will create
Creating the directory and HTML Structure
Creating the Logic
Adding CSS

Project 3: Quote of the day App

What we will create
Creating directory and HTML
Adding CSS
Adding JavaScript functions

Project 4: BMI Calculator

What we will create
Creating project directory and HTML
Adding CSS
Adding JavaScript

Project 5: Weight Conversion Tool

What we will create
Creating project directory and HTML
Adding JavaScript Functionality
Adding CSS
Converting pounds to kilograms

Project 6: Theme Color Changer

What we will create
Creating the project directory and HTML
Adding CSS
Adding JavaScript

Project 7: 2d canvas game

What is canvas
Understanding co-ordinates
What we will create
Creating the canvas
Accessing the canvas
Creating the ball
Making the ball move
Removing obstructions
Making the ball bounce Part 1
Making the ball bounce Part 2
Creating variables
Create functions for the paddle
Creating event listeners and events
Creating functions to control events
Creating more variables
Moving the paddle
Game end logic
Creating the variables for the bricks
Creating arrays for the bricks
Creating functions to draw the bricks
Implementing collision detection
Activating collision detection
Creating scoring logic
Creating mouse controls

Project 8: Creating a calculator

Overview
What we will create
Creating directories and files
creating the app structure
Styling the app
Creating the functionality

Project 9: Creating a digital clock

Overview
What we will create
Creating project directory and files
Creating app structure
Styling the app
Adding functionality

Project 10: Event Countdown Timer

What we will create
Creating project directory and HTML Structure
Creating the logic part 1
Creating the logic part 2
Adding CSS

Project 11 : Creating a percentage tip calculator

Overview
What we will create
Creating a directory and files
Creating the app structure
Adding CSS
Adding functionality

Project 12 : Creating a word count tool

Overview
Creating project directory and files
Creating app structure
Adding css
Adding functionality

Project 13: Creating a Contact Form

Overview
What we will create
Creating a directory and files
Creating the app structure
Add CSS
Adding Functioanlity

Project 14: Day of the week App

Overview
What we will create
Creating project directory and files
Adding CSS
Adding functionality

Project 15 : Color changing app

Overview
What we will create
Creating project directory and files
Creating app structure
Adding CSS
Adding JavaScript

Project 16: Creating an Image Slider

Overview
What we will create
Creating project directory and files
Creating the project structure
Adding css
Adding functionality

Project 17 : Creating Math Addition App

Overview
What we will create
Creating project folders and files
Creating project structure
Adding CSS
Adding functionality

Project 18 : Creating a Todo List App

Overview
What we will create
Creating project directory and files
Creating the project structure
Adding CSS
Adding functionality Part 1
Adding functionality Part 2

Project 19: Creating an Interactive Quiz

Overview
What we will create
Creating project directory and files
Creating the project structure
Adding CSS
Adding functionality Part1
Adding functionality Part2

Project 20 : Create a Count Down Timer

What we will create
Overview
Creating the project directory and files
Creating the project structure
Adding CSS
Adding functionality

Project 21 : Creating a Baloon Popping Game

Overview
What we will create
Creating project structure
Adding CSS
Adding Functionality

Project 22 : Creating a RRS News Feed

Overview
What we will create
Creating the project structure
Add functionality

Project 23 : Creating a Number Guessing Game

Overview
What we will create
Creating directory and files
Creating project structure
Adding CSS
Adding functionality Part1
Adding functionality Part2

Project 24: Creating a light switch effect

Overview
What we will create
Creating project directory and files
Creating project structure and functionality

Project 25 : Create a greeting message

Overview
What we will create
Creating directory and files
Creating the app structure
Adding CSS
Adding functionality

Project 26: Height Conversion Tool

What we will create
Creating a directory and HTML
Adding CSS
Adding JavaScript

Project 27: Wack A Mole

What we will create
Creating the project directory and HTML
Adding CSS
Adding JavaScript -Part 1
Adding JavaScript -Part 2

Screenshots

JavaScript for beginners: Create 27 projects from scratch - Screenshot_01JavaScript for beginners: Create 27 projects from scratch - Screenshot_02JavaScript for beginners: Create 27 projects from scratch - Screenshot_03JavaScript for beginners: Create 27 projects from scratch - Screenshot_04

Reviews

Samuel
July 27, 2021
This is really a good one for me and a perfect match for beginning developers with a lot of opportunities to practice what you learn
Aristóteles
May 26, 2020
O inglês do instrutor é complicado... Não sei de onde é esse sotaque dele mas torna assistir ao conteúdo bem sofrível.
Victoria
May 7, 2020
Multiple errors in code without explanation. Poor feedback for course questions. Hardly explaining anything.
David
November 26, 2019
The 1 project I have done is not working right and nobody is answering my question I left on the message board. If I could leave 0 stars I would.
Romeo
October 8, 2019
Finished the course today. It took me about a month and a half of doing each project on average, for about an hour. Some of the projects were pretty basic, while others, like the Whack a Mole and Brick Breaker were pretty advanced. As a side note, some of the instructor's solutions were coded using jQuery. I coded all my solutions using vanilla JavaScript. All-in-all, the projects gave me lots of JavaScript practice and I enjoyed the course. The 4 stars is because a the RSS project is practically useless now since Google has done away with its RSS Feed Reader API and some solutions aren't correct. Any, I posted all of my own solutions on my project portfolio website, jsbeginners.com. Happy Coding!
Heidi
April 15, 2018
This is a great JavaScript course. The projects are useful and introduce many new concepts, ie learn as you go. The code explanations are extensive but incomplete and often problematic in many cases.
Jordan
December 16, 2017
The lessons were incomplete and the information wasn't always relevant to the topic. Many things were left out. There was also no consistent format for the lectures. Again Bluelime Learning Solutions is garbage.

Coupons

DateDiscountStatus
7/10/2021100% OFF
expired

Charts

Price

JavaScript for beginners: Create 27 projects from scratch - Price chart

Rating

JavaScript for beginners: Create 27 projects from scratch - Ratings chart

Enrollment distribution

JavaScript for beginners: Create 27 projects from scratch - Distribution chart

Related Topics

1420678
udemy ID
11/4/2017
course created date
5/5/2020
course indexed date
Bot
course submited by