We may earn an affiliate commission when you visit our partners.
Course image
Brad Traversy

This is a 36+ hour in-depth course that will take you from the absolute beginning of JavaScript, learning about data types, functions and loops to learning DOM manipulation, asynchronous JS with promises, async/await and much more. You will even learn how to write unit tests for algorithms. We go into how JavaScript works under the hood including execution context, the call stack, event loop, etc. We learn about Webpack tooling and how to create a modern development environment. At the end, we build a Node.js/Express API with a custom Webpack frontend.

Read more

This is a 36+ hour in-depth course that will take you from the absolute beginning of JavaScript, learning about data types, functions and loops to learning DOM manipulation, asynchronous JS with promises, async/await and much more. You will even learn how to write unit tests for algorithms. We go into how JavaScript works under the hood including execution context, the call stack, event loop, etc. We learn about Webpack tooling and how to create a modern development environment. At the end, we build a Node.js/Express API with a custom Webpack frontend.

All of the code in the learning modules will go into a folder called "JavaScript Sandbox". This is so we can keep things organized and you can always refer back to it for any code snippets that you may need. All of the final and starter code for the projects is included as well as links to the GitHub Repos.

WHAT YOU WILL LEARN

  • Basics & Fundamentals: Data types, let & const variables, functions, conditionals, loops, object literals, etc

  • Data Structures - Arrays, objects, maps, sets as well as custom data structures like stacks and queues

  • DOM Manipulation - Selectors, traversing the DOM, show/hide, creating & removing elements, event listeners

  • OOP - Constructor functions, prototypes, inheritance, classes, protected properties, getters/setters

  • Async JS - Ajax & XHR, Fetch API, callbacks, promises, async / await

  • Error Handling - Try...Catch, HTTP errors

  • Web & Browser APIs - Canvas, geolocation, audio/video, web animations API

  • Modules & Tooling - CommonJS & ES Modules, Webpack,  plugins, loaders, modern dev environment &  workflow

  • Unit Testing Algorithms - Learn the Jest testing library and algorithms like palindromes and anagrams

  • Node.js & Express - Learn about Node modules, NPM packages and build a REST API with Express & MongoDB

  • Full Stack Development - We build an API with Express and a frontend with Webpack. No frontend frameworks.

  • So So Much More.

COURSE PROJECTS & MINI-PROJECTS

  1. Shopping List

  2. Flix Movie App

  3. Tracalorie OOP Project

  4. Tracalorie Webpack Refactor

  5. Chuck Norris Joke Generator

  6. RandomIdeas Full Stack APP - API & Frontend

  7. Webpack Starter Project

  8. Keycode Mini-Project

  9. Random User Generator

  10. Music Player

  11. Video Player

  12. Drum Machine

  13. Profile Scroller

  14. Polling App

  15. Joke Generator

  16. Ball Animation

  17. Animated Clock

  18. Typicode Todos

  19. Text To Speech

Enroll now

What's inside

Learning objectives

  • Learn the fundamentals (variables, loops, functions, etc)
  • Learn how javascript works (execution context, call stack, async js)
  • Master the document object model & events (interactivity)
  • Asynchronous javascript (callbacks, promises, fetch, ajax)
  • Oop (constructors, prototypes, classes)
  • Modern tooling & workflow (webpack, babel, file structure, npm, plugins & loaders)
  • Full stack project with webpack, node, express & mongodb
  • 5 real world projects & 10+ mini-projects

Syllabus

Intro & Getting Started
Welcome To The Course
Course Outline
What Is JavaScript?
Read more
Tools & Setup
Running JavaScript In The Browser
Course Links
Variables, Data Types & More
Section Intro
The Sandbox Files
Using The Console
Comments & Shortcuts
Variables & Constants
Data Types
Primitive vs Reference Types
Type Conversion
Operators
Type Coercion
Working With Strings
Capitalize Challenge
Working With Numbers
The Math Object
Number Challenge
Dates & Times
Date Methods & DateTimeFormat API
Arrays & Objects
Creating Arrays
Basic Array Methods
Nesting, Concat & Spread Operator
Array Challenge
Object Literals
Object Spread Operator & Methods
Destructuring & Naming
JSON Intro
Object Challenge
Functions, Scope & Execution Context
Function Basics
More on Params & Arguments
Global & Function Scope
Block Scope
Nested Scope
Declaration vs Expression
Arrow Functions
Immediately Invoked Function Expressions
Function Challenges
Execution Context
Execution Context In Action
The Call Stack
Logic & Control Flow
If Statements
If Else & Nesting
Switches
Calculator Challenge
Truthy & Falsy
Logical Operators
Logical Assignment
Ternary Operator
Loops, Iteration & Array Methods
For Loop
Break & Continue
While & Do While Loops
FizzBuzz Challenge
For Of Loop
For In Loop
Array.forEach
Array.filter
Array.map
Array.reduce
Array Method Challenges
Document Object Model
Intro To The DOM
Document Element Properties
DOM Selectors - Single Elements
DOM Selectors - Multiple Elements
Traversing The DOM - Elements
Traversing The DOM - Nodes
Create & Append Elements
InnerHTML vs createElement()
Refactor To Multiple Functions
Insert Elements, Text & HTML
Custom insertAfter Challenge
Replace Elements
Remove Elements
Working With Styles & Classes
Events
Event Listeners
Mouse Events
The Event Object
Keyboard Events & Key Properties
KeyCode Mini-Project
Input Events
Form Submission & FormData Object
Event Bubbling
Event Delegation & Multiple Elements

Good to know

Know what's good
, what to watch for
, and possible dealbreakers
Strengthens an existing foundation for intermediate JavaScript learners
Develops professional skills or deep expertise in JavaScript
Develops core skills for full-stack web development: JavaScript, Node.js, Express
Covers unique perspectives are ideas that may add color to other topics and subjects
Taught by Brad Traversy, who are recognized for their work in Javascript
This course is part of a series of courses designed to provide a comprehensive learning path for JavaScript development

Save this course

Save Modern JavaScript From The Beginning 2.0 (2024) to your list so you can find it easily later:
Save

Reviews summary

Brad is awesome

According to students, Brad is an awesome instructor.

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Modern JavaScript From The Beginning 2.0 (2024) with these activities:
Review JavaScript Fundamentals
Reviewing the fundamentals of JavaScript will help you build a solid foundation for the more advanced concepts covered in the course.
Show steps
  • Read through the course syllabus and identify the key concepts that you need to review.
  • Use online resources or textbooks to brush up on these concepts.
Join a JavaScript Study Group
Joining a JavaScript study group will provide you with a supportive learning environment and allow you to connect with other learners.
Show steps
  • Find a JavaScript study group online or in your local area.
  • Attend regular study sessions and participate in discussions.
  • Share your knowledge and help other members of the group.
Practice Writing JavaScript Functions
Practicing writing JavaScript functions will help you develop your programming skills and prepare you for the coding challenges in the course.
Browse courses on Functions
Show steps
  • Find online coding exercises or create your own.
  • Write JavaScript functions to solve these exercises.
  • Test your functions to make sure they work correctly.
Four other activities
Expand to see all activities and additional details
Show all seven activities
Follow Tutorials on DOM Manipulation
Following tutorials on DOM manipulation will help you learn how to interact with the HTML document and create interactive web pages.
Browse courses on DOM Manipulation
Show steps
  • Find online tutorials or courses on DOM manipulation.
  • Follow the tutorials and complete the exercises.
  • Build a simple web page that uses DOM manipulation to add interactivity.
Participate in a JavaScript Coding Challenge
Participating in a JavaScript coding challenge will test your skills, push you to learn new things, and help you identify areas for improvement.
Browse courses on Coding Challenges
Show steps
  • Find a JavaScript coding challenge to participate in.
  • Study for the challenge and practice your JavaScript skills.
  • Complete the challenge and submit your solution.
Create a JavaScript Code Snippet Library
Creating a JavaScript code snippet library will help you organize and reuse your code, and it will also serve as a valuable reference.
Browse courses on code snippets
Show steps
  • Collect and organize your JavaScript code snippets.
  • Create a library or repository to store these snippets.
  • Document each snippet with a description and usage instructions.
Contribute to an Open Source JavaScript Project
Contributing to an open source JavaScript project will give you hands-on experience and help you learn from other developers.
Browse courses on Open Source Projects
Show steps
  • Find an open source JavaScript project that you are interested in.
  • Read the project documentation and identify ways you can contribute.
  • Create a pull request or issue to suggest your changes to the project.

Career center

Learners who complete Modern JavaScript From The Beginning 2.0 (2024) will develop knowledge and skills that may be useful to these careers:
JavaScript Developer
JavaScript Developers focus on developing and implementing JavaScript-based solutions for web and mobile applications. This course provides a comprehensive overview of JavaScript, covering both frontend and backend technologies. By mastering the skills taught in this course, you will become proficient in building and maintaining robust JavaScript applications.
Full-Stack Developer
Full Stack Developers possess expertise in both frontend and backend development, enabling them to handle the entire web development lifecycle. This course provides a comprehensive overview of JavaScript, covering both client-side and server-side technologies. By mastering the concepts taught in this course, you will be well-equipped to build and maintain complex web applications, making you a highly sought-after professional in the industry.
Web Developer
Web Developers specialize in developing and maintaining websites and web applications. This course covers essential JavaScript concepts, including DOM manipulation, event handling, and asynchronous programming. With a strong grasp of these skills, you can create interactive and engaging web experiences, making you a valuable asset to any web development team.
Frontend Developer
Frontend Developers focus on the client-side of web development, ensuring that websites and web applications are visually appealing and interactive. This course provides a comprehensive foundation in JavaScript, including DOM manipulation, event handling, and asynchronous programming. By mastering these concepts, you can effectively build and maintain user interfaces, making you a valuable asset to any web development team.
Backend Developer
Backend Developers are responsible for the server-side of web development, managing data and business logic. This course covers Node.js and Express, essential technologies for building robust and scalable backend applications. With a deep understanding of JavaScript, you can seamlessly connect frontend and backend components, leading to a well-rounded skillset as a Backend Developer.
Mobile Developer
Mobile Developers specialize in developing and maintaining mobile applications for smartphones and tablets. This course covers JavaScript, a widely used language for mobile development. By mastering JavaScript, you can leverage cross-platform frameworks like React Native and Ionic to build high-quality mobile apps, increasing your employability in the mobile development industry.
Software Engineer
Software Engineers apply engineering principles to the design, development, deployment, and maintenance of software systems. This course provides a solid foundation in JavaScript, a widely used programming language in software development. By honing your JavaScript skills, you can contribute to the creation of innovative and reliable software solutions, opening up opportunities in various industries.
UX Designer
UX Designers focus on enhancing the user experience of websites and applications by optimizing usability, accessibility, and overall user satisfaction. This course covers JavaScript, a language that plays a crucial role in creating interactive and intuitive user interfaces. By understanding how JavaScript works and how it can be used to manipulate the DOM, you can contribute to the design and development of user-centric products.
Data Scientist
Data Scientists use scientific methods and algorithms to extract insights from data, providing valuable information to businesses and organizations. This course covers JavaScript, a language that is increasingly used for data analysis and visualization. By mastering JavaScript, you can enhance your data science toolkit, enabling you to handle complex data and communicate insights effectively.
Business Analyst
Business Analysts bridge the gap between business and technology, translating business requirements into technical specifications. This course covers JavaScript, a language that is commonly used in web and mobile development. By understanding the fundamentals of JavaScript, you can effectively communicate with technical teams and contribute to the development of software solutions that meet business objectives.
Quality Assurance Engineer
Quality Assurance Engineers test and evaluate software to ensure that it meets quality standards. This course may provide valuable insights into JavaScript, a language that is commonly used in web and mobile development. By understanding the fundamentals of JavaScript, you can effectively test and debug software, contributing to the delivery of high-quality products.
Project Manager
Project Managers oversee the planning, execution, and delivery of projects. This course may provide valuable insights into JavaScript, a language that is commonly used in web and software development. By understanding the basics of JavaScript, you can better manage technical projects, communicate effectively with developers, and ensure that projects are delivered on time and within budget.
Technical Writer
Technical Writers create and maintain documentation for software and technology products. This course may provide a solid foundation in JavaScript, a language that is widely used in web development. By understanding JavaScript, you can effectively convey technical concepts and instructions to users, ensuring that products are well-documented and easy to use.
Computer Programmer
Computer Programmers write and maintain code for software applications. This course may provide a foundation in JavaScript, a language that is widely used in web development. By understanding the basics of JavaScript, you can contribute to the development of software applications and enhance your programming skills.
IT Support Specialist
IT Support Specialists provide technical assistance to users and resolve computer-related issues. This course may provide a basic understanding of JavaScript, a language that is used in web development. By understanding the basics of JavaScript, you can better troubleshoot web-related issues and provide support to users.

Reading list

We've selected 20 books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Modern JavaScript From The Beginning 2.0 (2024).
Comprehensive guide to JavaScript, covering everything from the basics to advanced topics like functional programming and asynchronous programming. It is written in a clear and concise style, and it is packed with code examples and exercises.
Classic guide to JavaScript, written by one of the most respected JavaScript developers in the world. It covers the essential parts of JavaScript, and it great resource for anyone who wants to learn how to write clean and efficient JavaScript code.
Is the first in a series of books that cover the JavaScript language in depth. It great resource for anyone who wants to learn the fundamentals of JavaScript, and it is also a valuable reference for experienced JavaScript developers.
Provides a detailed explanation of JavaScript, including its internals. It good reference for those who want to understand how JavaScript works.
Comprehensive reference to JavaScript. It good resource for those who want to learn more about the language.
Provides a comprehensive overview of Node.js. It good reference for those who want to learn more about the platform.
Provides a comprehensive overview of algorithms and data structures in JavaScript. It good reference for those who want to learn more about the topic.
Collection of advanced JavaScript techniques, written by one of the most experienced JavaScript developers in the world. It covers a wide range of topics, from performance optimization to debugging.
Fast-paced introduction to JavaScript. It is useful for those who already have some programming experience.
Provides a comprehensive overview of functional programming in JavaScript. It good resource for those who want to learn more about the topic.
Provides techniques for writing high-performance JavaScript code. It is useful for those who want to optimize their code for speed.
Provides a collection of JavaScript design patterns. It is useful for those who want to write maintainable and reusable code.
Comprehensive guide to modern JavaScript development. It covers everything from the basics of JavaScript to advanced topics like React and Node.js.
Comprehensive guide to MongoDB, the popular NoSQL database. It covers everything from the basics of MongoDB to advanced topics like replication and sharding.
Hands-on guide to building web applications with React and Redux. It covers everything from the basics of React to advanced topics like state management and performance optimization.
Comprehensive guide to Vue.js, the popular JavaScript framework. It covers everything from the basics of Vue.js to advanced topics like component development and state management.
Beginner's guide to React, the popular JavaScript library. It covers the basics of React, and it great resource for anyone who wants to learn how to build web applications with React.
Comprehensive guide to Angular, the popular JavaScript framework. It covers everything from the basics of Angular to advanced topics like routing and dependency injection.

Share

Help others find this course page by sharing it with your friends and followers:

Similar courses

Here are nine courses similar to Modern JavaScript From The Beginning 2.0 (2024).
Build a Full Stack App using React and Express
Most relevant
Building a Full Stack App with React 16 and Express 4
Most relevant
Building Data-driven React 17 Applications with Relay,...
Most relevant
Modern JavaScript The Complete Course - Build +15 Projects
Most relevant
Developing Cloud Apps with Node.js and React
Most relevant
React Front To Back
Most relevant
Learn and Understand NodeJS
Most relevant
Building a REST API in JavaScript with Express
Most relevant
JavaScript Module Fundamentals
Most relevant
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2024 OpenCourser