React Jukebox Front-End Lab

About

Welcome to Reactville, a constantly evolving virtual metropolis. Let’s build this digital town together, one component at a time.

The community center of Reactville is launching an exciting project—a public jukebox! Your task is to help them build an interactive user interface where everyone can collaborate to manage the track library. Users will be able to add, update, and remove tracks, creating a dynamic playlist that all residents can enjoy at town events!

By the end of this lab, students will have developed a frontend that interacts with a RESTful API, enabling users to perform create, read, update, and delete (CRUD) operations on track data. This lab provides a practical application for consuming an API with React.

🚨 This module requires an existing API to perform CRUD operations on a music track resource.

Content

• Setup
• Exercise
• Enhance the Jukebox

Internal

Prerequisites

• Controlled Forms in React
• Lifting State in React
• Fetching Data in React
• Express API - Jukebox Back-End Lab

Time to complete

Estimated time to complete core lab exercise: 8 hours

Starter code

• This module requires an existing API to perform CRUD operations on a music track resource.

Solution code

🏁 Solution code

Course landing pages

• SEB - Software Engineering Bootcamp
• Fallback

Resources

✏️ Instructor Guide

🎥 Video Hub

🏗️ Release Notes

Find a 👾 bug 👾 or have suggestions? Let us know!