codedamn logo
codedamn
Course image for JavaScript DOM Projects

JavaScript DOM Projects

Make your webpages come to life with JavaScript and DOM interaction Loaded with Useful Projects in JavaScript

11 hours+ of total content
3.9
11 ratings
195 students enrolled
Course Creator: Laurence Svekis

Hang on...

 

Heads up!

This is an official course from Full Stack Web Developer Learning Path learning path.

Goals

  • JavaScript

Description

Do you want to add interaction or dynamic content to your web pages, this is the course for you!

JavaScript can bring your web pages to life - interact with the DOM.   Select page elements, make changes and update them as needed.  Power up your web pages!!!

Create amazing content on your pages, driven dynamically with JavaScript.  Projects within this course are designed to help you learn more about JavaScript and interacting with the DOM.  Learn by example, course is loaded with fun projects to help you learn and demonstrate what can be done with JavaScript

Source Code is included so that you can try the code, and build your own version of the web applications.

Please note that HTML and CSS are prerequisite to the course, as well fundamental JavaScript is required as we are covering JavaScript within web pages.

JavaScript Projects within the DOM - Document Object Model

Explore how to create Interactive Dynamic web pages

Introduction  to the DOM and how JavaScript can create page interactions - Explore how to write JavaScript code, select page elements and more.  Loaded with useful projects to help you learn more about creating interactive and dynamic web content with JavaScript.

Course covers everything you need to know in a step by step format so  that you can start coding JavaScript and creating amazing things with code.

Web Developer Setup use of Editor for JavaScript Code

JavaScript Projects DOM Interactive Dynamic web pages Introduction web development Course Resource Guide.

Getting started with JavaScript DOM coding and development

  • Web Developer Setup use of Editor for JavaScript Code
  • JavaScript Resources to explore more about JavaScript
  • JavaScript DOM Object Selecting Page elements and more
  • JavaScript querySelectorAll Get Page Elements Select ALL
  • Page Events Element Event Listener access page content with JavaScript
  • JavaScript and Page Input Values from Page Elements
  • How to use JavaScript Request Animation Frame

JavaScript Starter Projects DOM Simple Projects to Start Coding

How to make Interactive DOM list saving to localstorage

JavaScript Component Create a Star Rating Project

JavaScript Game within the DOM Coin Toss Game Project

JavaScript Typing Challenge Game with JavaScript DOM

JavaScript DOM fun with Page Elements Moving Storing Keypress

JavaScript Combo Guessing Game Exercise

JavaScript Shape Clicker Game Click the shape quickly to win

JavaScript Number Guessing Game with Game Logic

JavaScript DOM Interactive Components and Useful Projects

Pure JavaScript Accordion hide and show page elements

JavaScript Drag and Drop Simple Boxes Component

Dynamic Drag and Drop

JavaScript Email Extractor Mini Project

Create a Quiz with Javascript JSON quiz tracker

JavaScript Image Preview File Reader Example

JavaScript Interactive Dice Game with Page elements

JavaScript Dice Game Challenge Lesson

JavaScript DOM Fun Projects Interactive DOM Elements

JavaScript Tip Calculator Project

Tip Calculator Project Part 1

Tip Calculator Project Part 2

Pure JavaScript Calculator DOM page elements Project

JavaScript Calculator Part 1

JavaScript Calculator Part 2

JavaScript Calculator Part 3

JavaScript Bubble Popping DOM Game Coding project

How to move a Page Element With JavaScript DOM Mover Example

Collision Detection between Page elements with JavaScript DOM

JavaScript DOM Interactive Game

JavaScript in action - use of pure JavaScript to create amazing interactive content on your web pages.

Source code included

Build your own version of the projects

Learn more about JavaScript and DOM page element manipulation.

No libraries, no shortcuts just learning JavaScript making it DYNAMIC and INTERACTIVE web application.

Step by step learning with all steps included.

Beginner JavaScript knowledge is required as the course covers only JavaScript relevant to the building of the game.  Also HTML and CSS knowledge is essential as scope of this course is all JavaScript focused.  

Along with friendly support in the Q&A to help you learn and answer any questions you may have.

Try it now you have nothing to lose, comes with a 30 day money back guarantee.  

Start building and creating with JavaScript today!!!!

Course Structure

43 lectures 11:17:12 total duration

  Introduction to JavaScript and the DOM creating interactive web pages (Watch video)
03:18
  Source Code (Read article)
00:07
  Web Developer Setup use of Editor for JavaScript Code (Watch video)
09:00
  JavaScript Resources to explore more about JavaScript (Watch video)
02:00
  JavaScript DOM Object Selecting Page elements and more (Watch video)
12:04
  JavaScript querySelectorAll Get Page Elements Select ALL (Watch video)
11:45
  Page Events Element Event Listener access page content with JavaScript (Watch video)
10:10
  JavaScript and Page Input Values from Page Elements (Watch video)
11:13
  How to use JavaScript Request Animation Frame (Watch video)
13:51

Student feedback

3.9
Course Rating

55%

9%

18%

9%

9%

Reviews

profile pic for Sayed Aslam Shah
Feb 23, 2022
This is great course to learn JS, explained with real world examples
profile pic for Zyad Ahmed Afifi
Feb 19, 2022
weak teaching way
profile pic for ashwin kashyap
Feb 18, 2022
amazing course
profile pic for Syed Alwaz Asif
Feb 18, 2022
Fine.

Your Course Instructor

Course Instructor Image

Laurence Svekis

Best selling Course Instructor

Content creator Web Development Google Developer Expert

Upgrade to codedamn Pro Plan and unlock more courses for accelerated learning. Unlimited courses, interactive learning and more.

Free

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Full learning path unlocked
  • Unlimited hands-on practice

Pro

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • All exclusive courses unlocked
  • Unlimited hands-on practice
Try codedamn Pro (14-day free refund)