Mini project: A React page that loads data from a Node script

Mini project

Mini project: A React page that loads data from a Node script

Unlock this lesson

Create a free account, then buy the course to open every lesson.

What you will build

You will connect your two projects from this module.

  • In chai-tools, a Node.js script becomes a tiny server. It sends products.json at http://localhost:3001/api/products.
  • In chai-react, the page gets a Load products button. A click fetches the products from your server and shows them as cards.
  • A port is a door number on your computer. Vite uses door 5173. Your server uses door 3001.
  • CORS is a browser safety rule. A page from one port may read data from another port only if that server allows it.

120 minutes Mini project

Everything in Shopify App Developer

  • 28 step-by-step lessons
  • 3 mini projects with solutions
  • A final project for your portfolio
  • Real commands and real output in every lesson
  • Practice task with a solution in each lesson
  • Progress saved to your account