Complete JavaScript Course: Build a Real World App from Scratch

Gain insights into JavaScript with ES6, DOM traversal, event handling, and animation. Learn about building a Social News web app from scratch using HTML, CSS, and JavaScript.

Beginner

277 Lessons

20h

Certificate of Completion

Gain insights into JavaScript with ES6, DOM traversal, event handling, and animation. Learn about building a Social News web app from scratch using HTML, CSS, and JavaScript.

AI-POWERED

Explanations

AI-POWERED

Explanations

This course includes

309 Playgrounds

77 Challenges

23 Quizzes

This course includes

309 Playgrounds

77 Challenges

23 Quizzes

Course Overview

Javascript is one of the most prominent web programming languages that really made a difference. This course aims to be a useful companion for anyone wishing to (re)discover the many facets of JavaScript. Walk with us as we take you on a journey filled with all the wonders of Javascript including: - Basics of JavaScript with ES6 - How to traverse the DOM? - Modify Pages and handle events - Animate elements You will also learn how to build a Social News web application from scratch using the three web tech...Show More

TAKEAWAY SKILLS

Javascript

Programming Language

Learn To Code

Course Content

Introduction

Get familiar with JavaScript's fundamentals, from programming basics to dynamic web development.

About this Course Welcome to Programming How to Create Programs?Introduction to Algorithms

Introducing JavaScript Summary

Basics of JavaScript

Look at the basics of JavaScript: values, types, program structure, and simple coding challenges.

Your First Program

Values and Types

Program Structure Coding Challenge: Presentation Solution: Presentation Coding Challenge: Minimalistic Calculator Solution: Minimalistic Calculator Coding Challenge: Predict the Displayed Values Quiz

Play with Variables

Break apart variables, expressions, type conversions, user interactions, and variable naming.

Variables

Expressions Type Conversions User Interactions Variable Naming Coding Challenge: Improved Hello Solution: Improved Hello Coding Challenge: VAT Calculation Solution: VAT Calculation Coding Challenge: Celsius to Fahrenheit Conversion Solution: Celsius to Fahrenheit Conversion Coding Challenge: Variable Swapping Solution: Variable Swapping Quiz

Add Conditions

Break down complex ideas behind implementing and managing conditions using JavaScript.

What's a Condition?Alternative Conditions Add Additional Logic Multiple Choices Coding Challenge: Following Day Solution: Following Day Coding Challenge: Number Comparison Solution: Number Comparison Coding Challenge: Number of Days in a Month Solution: Number of Days in a Month Coding Challenge: Adding seconds to time Solution: Adding Seconds to Time Quiz

Repeat Statements

Map out the steps for using while and for loops proficiently, avoiding common mistakes.

The While Loop The For Loop Common Mistakes Which Loop to Use?Coding Challenge: Carousel Solution: Carousel Coding Challenge: Use of Modulo Operator Solution: Use of Modulo Operator Coding Challenge: Input Validation Solution: Input Validation Coding Challenge: Multiplication Table Solution: Multiplication Table Coding Challenge: Neither Yes nor No Solution: Neither Yes nor No Coding Challenge: FizzBuzz Solution: FizzBuzz Quiz

Write Functions

15 Lessons

Tackle JavaScript functions to organize code, create reusable components, and solve problems efficiently.

Create your First Object

11 Lessons

Piece together the parts of JavaScript objects, methods, and practical coding challenges.

Store Data in Arrays

15 Lessons

Learn how to use arrays for efficient data storage, manipulation, and iteration in JavaScript.

Work with Strings

13 Lessons

Unpack the core of working with strings, including manipulation, searching, and solving coding challenges.

10.

Understand Object Oriented Programming

11 Lessons

Examine object-oriented principles, classes, prototypes, and combat mechanics in JavaScript.

11.

Discover Functional Programming

15 Lessons

Enhance your skills in functional programming, JavaScript's multi-paradigm nature, and refactoring techniques.

12.

Project 1: A Social News Program

2 Lessons

Solve problems in creating a basic social news app with add and remove features.

13.

Create Interactive Web Pages

3 Lessons

Tackle creating and understanding interactive, web-based applications using HTML, CSS, and JavaScript.

14.

Discover the DOM

5 Lessons

Master the steps to interact with the DOM, navigate nodes, and handle child elements.

15.

Traverse the DOM

11 Lessons

Step through methods to traverse the DOM, select elements, handle attributes and classes.

16.

Modify Page Structure

17 Lessons

Walk through dynamically adjusting web pages using JavaScript's DOM manipulation methods and properties.

17.

React to Events

15 Lessons

Work your way through event-driven programming, handling various events, and completing coding challenges.

18.

Manipulate Forms

14 Lessons

Apply your skills to creating interactive, dynamic, and user-friendly web forms using JavaScript.

19.

Animate Elements

10 Lessons

Take a closer look at animating elements using JavaScript and CSS, covering techniques and practical applications.

20.

Project 2: A Social News Web Page

2 Lessons

Tackle developing a dynamic social news page with enhanced features and responsive design.

21.

Building Web Applications

6 Lessons

Practice using web protocols, dynamic development techniques, and JSON for data exchange.

22.

Query a Web Server

7 Lessons

Learn how to use fetch() for asynchronous HTTP requests and handle JSON data in JavaScript.

23.

Use Web APIs

12 Lessons

Look at the fundamental concepts of Web APIs, key-based authentication, and JavaScript integration.

24.

Send Data to a Web Server

8 Lessons

Work your way through sending data to servers using POST requests, FormData, and JSON.

25.

Discover Node.js

13 Lessons

Grasp the fundamentals of Node.js, modules, packages, NPM, and practical coding challenges.

26.

Create a Web Server

9 Lessons

Dig deeper into creating and managing web servers using JavaScript with Express framework.

27.

Project 3: A Social News Web App

2 Lessons

Tackle developing a social news web app with Node.js, focusing on coding best practices.

28.

Conclusion

1 Lesson

Approach the ongoing journey of mastering JavaScript's versatile, dynamic, and impactful nature.

29.

Appendices

1 Lesson

Get familiar with JavaScript naming conventions, code formatting practices, and linters for quality.

Build a Telegram Bot in Node.js for Web Page Change Detection

Project

Course Author

Show License and Attributions

Trusted by 1.4 million developers working at companies

Anthony Walker

@_webarchitect_

Emma Bostian 🐞

@EmmaBostian

Evan Dunbar

ML Engineer

Carlos Matias La Borde

Software Developer

Souvik Kundu

Front-end Developer

Vinay Krishnaiah

Software Developer

Eric Downs

Musician/Entrepeneur

Kenan Eyvazov

DevOps Engineer

Anthony Walker

@_webarchitect_

Emma Bostian 🐞

@EmmaBostian

Hands-on Learning Powered by AI

See how Educative uses AI to make your learning more immersive than ever before.

Instant Code Feedback

Evaluate and debug your code with the click of a button. Get real-time feedback on test cases, including time and space complexity of your solutions.

AI-Powered Mock Interviews

Put your skills to the test in a simulated interview setting. Receive personalized feedback based on your performance. Available in Premium & Premium Plus plans.

Adaptive Learning

At various checkpoints throughout Educative courses, you will be prompted to take a quick assessment. Receive a condensed curriculum tailored to your strengths and skill gaps.

Explain with AI

Select any text within any Educative course, and get an instant explanation — without ever leaving your browser.

AI Code Mentor

AI Code Mentor helps you quickly identify errors in your code, learn from your mistakes, and nudge you in the right direction — just like a 1:1 tutor!