Build 18 Real World JavaScript Development Projects Bootcamp

Build a ballast application to reorder a list of top 10 richest people, scramble items, and verify order with green or red cues while mastering JavaScript functions and event listeners.

Scramble a JavaScript list in real time using map and sort by a random key, then map objects back to names after drag-and-drop to form the correct order.

Add drag and drop functionality to a JavaScript app by wiring drag events, tracking start and index, handling drag over and drop, swapping items, and applying visual cues.

Press the check button to run a function that compares each list item's index to the original sequence and marks matches green or mismatches red.

Build an analogue clock application using pure JavaScript, mastering clock math, hand movement, and styling with transform while linking IDs with JavaScript for a live, accurate time display.

Learn to build and display failure alerts with vanilla JavaScript by creating a div, applying bootstrap alert classes, and inserting it between the heading and form.

Build a client-side book list app with object-oriented JavaScript, using classes for books, a UI handler, and local storage, featuring a bootstrap-styled form, table display, and add/delete with validations.

Set up a Visual Studio Code music player project, organize folders for images and songs, create index.html, style.css, and script.js, and integrate material icons with a live server preview.

Import the poppins font from google fonts, define color variables, and style the body and wrapper to build a music player with hover effects, a now playing area, and a gradient progress bar.

Learn to update the current time by clicking the progress bar with an event listener, using offsetX and duration, and manage play, repeat, repeat one, and shuffle with a playlist.

Build a real-world dictionary web app with JavaScript by fetching meanings and synonyms from a dictionary API, displaying them in a scrollable card, and enabling pronunciation playback.

Learn to fetch word data from an API using async/await, parse JSON, and extract phonetics, meanings, and synonyms. Implement DOM updates to show results when a user types a word.

Create and structure a dynamic to-do list app using html and bootstrap, including a form with input and add button, and tabbed all and completed sections.

Learn to store and fetch to-do items in local storage by creating functions to save, retrieve, and display an array of task objects in a JavaScript project.

Build a retro-look snake game in pure JavaScript, move with arrow keys to collect items at random positions, grow the snake, and track score and high score when hitting walls.

Define the snake head and food with X and Y coordinates on an 18 by 18 grid, and render the head and tail as the snake moves with keyboard input.

Develop collision logic for a snake game by detecting head-to-body and wall collisions using x and y coordinates, trigger game over, and update score with local storage high score.

Increase the score each time the snake eats food, track the high score on game over, regenerate food at random positions, and display the score with a styled score card.

Build a pure JavaScript quiz app with a dynamic question board, scorecard, and leaderboard, and learn DOM manipulation, event listeners, arrow functions, and higher-order methods across multiple files.

Design the background of a vintage style app by integrating Font Awesome icons, Google Font Nova Square, and responsive CSS using flex layout to center content.

Design and style the quiz page by building a responsive choices container with hover effects and a progress bar, while preparing JavaScript to apply correct and incorrect colors to options.

Create a dog quiz game using an arrow function, initialize questions with the spread operator, fetch new questions at random, and store the score in local storage.