Recommended package for MySQL database?

[jrson83]

Hey,
I'm coming from Laravel (PHP) and the last three weeks I was trying to setup Laravel backend with SSR and React as frontend with spatie SSR package. Since I couldn't reach the desired results I was looking for lightweight react-like packages and found Nano JSX.
I'm thinking about migrating my Laravel website to Nano JSX. At the moment I'm using MariaDB with laravel and have all my website data stored in the database.
Can you give me a little help, how I could best setup Nano JSX to work with the already existing MySQL database? Or is this even a good idea? As far as I understand I just need a database drivers to CRUD with the database.

[yandeu]

Yes, it is as simple as that. You will find a lot of tutorials about express online.

---

You could also use Node.js (nanojsx) and PHP (laravel) together. Keep the routes and the database connection in PHP and fetch the resources you need from Node.js.

For example, in Node.js (just sudo code)

// fetch post nr. 55
const result = await fetch('my-laravel-api.com/posts/55')

// add the post as props to your Post component
const post = renderSSR(<Post data={result.data} />)

// send the html 
res.send(post)

[jrson83]

Thanks for your reply. I needed to think about some days.

When using Laravel with React and Spatie SSR, I followed the examples and didn't use PHP routes, I used react-router-dom.
The SSR extension is used to query data on the initial load and pass it to JavaScript using window state, then the server renderToStrings the initial <div id="app" /> into a Laravel blade.php file and the client grabs the state data and hydrates.

The problem was, on the initial render, the SSR was working when fetching data with Laravel (PHP), but when using the navigation to change the route with react router, the newly fetched data (with Laravel) was rendered server side, but there was no way to rehydrate the client. I didn't use express or Node, since the extension was using Node itself, like I understand.

I really tried for three weeks looking on different tutorials and also deprecated git repositorys but never actually tried to setup routes with Laravel only, cause I thought this was bad practice.

I already tried to setup Nano JSX with Laravel, the way the tutorial does but was stuck on the Node error on initial load:

node:internal/modules/cjs/loader:936 throw err; ^ Error: Cannot find module './app' Require stack

Right now I'm not sure if I want to invest more time again into trying Laravel with Nano JSX. At the moment I'm trying to understand the code of example1 and the nanojsx-template but having some problems understanding the different types of approaches you are using in the repositorys, for SSR and routing.

Maybe Nano JSX is not made for fontend framework beginners, but it would be awesome if there is some more information on how Nano JSX handles render, hydrate, renderToString and the whole SSR stuff.

Also I'm very impressed from the optimization of nanojsx-template in relation to the actual .JS and .CSS file size after running webpack. It would be really cool to have some kind of guide on how you achieving those tiny file size, even with bootstrap 5 added, just growing about 100KB.

Again thanks for your reply and keep up the good work!