Theming

Use Vite to Start a Decoupled React Application for Drupal 11

Using Vite we can scaffold a stand-alone React application with modern tooling, instant dev-server startup, and hot module replacement. It's a great way to get started with React and works perfectly for decoupled apps that talk to Drupal's JSON:API. After creating the scaffold, we'll port code from previous tutorials to the new structure.

In this tutorial we'll:

  • Use Vite to scaffold a new React project
  • Refactor existing code into Vite's project structure
  • Confirm that our code runs

By the end of this tutorial, you'll know what Vite is and how to get started using it for a decoupled React app.

Decoupled Headless Drupal