JavaScript 30

• Build 30 real-world JavaScript projects without using frameworks, compilers, or libraries, deepening your understanding of vanilla JavaScript and DOM manipulation.
• Learn fundamental JavaScript concepts, including working with browser APIs, event handling, and interactive interfaces.
• Improve problem-solving skills through practical exercises that cover various aspects of modern web development, including animations, audio/video manipulation, and user interactions.
• Strengthen your understanding of key JavaScript features like arrays, objects, localStorage, and asynchronous operations through diverse, hands-on projects.
• Gain the confidence to tackle new projects and learn by applying JavaScript concepts in real-world scenarios.

JavaScript30 is a 30-day coding challenge that helps you build 30 projects in 30 days using only vanilla JavaScript, without the need for frameworks, compilers, or libraries. The course emphasizes learning by doing, offering a wide range of practical exercises that explore different aspects of JavaScript and DOM manipulation. Each day introduces a new project, with starter files provided, and includes step-by-step tutorials to guide you through building interactive and engaging web applications.

• Beginner to Intermediate Developers: Already familiar with basic JavaScript concepts like variables, functions, and arrays.
• Developers stuck in console.log land: Ready to explore real-world browser APIs and build interactive user interfaces.
• Designers: Looking to improve JavaScript skills and work more effectively with the DOM.
• Self-learners: Those who prefer learning by building hands-on projects, rather than following tutorials with too much theory.

• Basic knowledge of JavaScript (this is not a beginner course, but you should know variables, functions, and objects).
• Familiarity with HTML and CSS is helpful but not required.

• JavaScript Drum Kit: Create a keyboard-driven drum kit using audio elements and event listeners.
• CSS + JS Clock: Build an animated clock using JavaScript to update DOM elements.
• Playing with CSS Variables and JS: Manipulate CSS variables in real-time through JavaScript.
• Array Cardio: Strengthen your knowledge of array methods through practical exercises.
• Flex Panels Image Gallery: Build a flexbox image gallery that expands on click using CSS and JS.
• Ajax Type Ahead: Create an interactive search field that provides real-time results with Ajax.
• Fun with HTML5 Canvas: Draw and animate on an HTML5 canvas using JavaScript.
• Native Speech Recognition: Build an app that responds to voice commands using the Web Speech API.
• Sticky Nav: Implement a sticky navigation bar that stays at the top of the page on scroll.
• Whack-a-Mole Game: Create an interactive browser game, combining event handling and timing functions.