Dylan Glockler
Dylan Glockler

Reputation: 1219

How can I use Laravel Herd to host a SPA with Inertia and React via npm run dev and a singular database with a second project?

I'm working on a Mac osx m2 and have been developing a Laravel SPA with React (jsx) and Inertia for what will be a client facing portal while I plan to continue to use a Laravel Blade template site for the administration of the site (not enough time to port everything over). It was becoming a nuisance running one at a time with Docker and Sail, and having separate databases booted up in Docker, but quite effective for the SPA, as I could use the 'npm run dev' command to give me hot reloading that worked so well.

I just discovered Laravel Herd paired with DBngin and TablePlus to access the DB; can I use these three packages as an environment and have multiple sites connect to a single database? I need to have one running with hot reload using 'npm run dev' from command line and another using blade templates via a separate URL.

Upvotes: -2

Views: 1854

Answers (1)

Dylan Glockler
Dylan Glockler

Reputation: 1219

  1. Install Herd and install one one or more sites, using integrated templates right from Laravel
  2. Install DBngin
  3. Install TablePlus
  4. From DBngin click the little right arrow and then 'Open in TablePlus'
  5. Click the little right arrow and then 'Open in TablePlus' to administer the database.
  6. Hit Command + K to open or connect to database and click new
  7. Enter the name of your database and set encoding as necessary. Make sure to select and open the correct database.
  8. Still in TablePlus click File->Import->From SQL Dump.. and select your export from your previous database.
  9. Make sure your .env is pointing to the same db name with user 'root' and no password (or as configured) and be sure DB_HOST=127.0.0.1 (not localhost).
  10. To launch SPA, browse to the directory of the project in terminal (in my case /Users/Dylan/Herd/console.domainname.com) and run the 'npm run dev' command to launch the SPA with hot reload, noting the updated url matching Herd. (This assumes you already have a project with front-end scaffolding or an SPA with the npm command configured).
  11. Open the secondary or any other Herd served URL from the Herd control panel.

This is going to be a game changer for me, hope it helps others.

Upvotes: 0

Related Questions