Laravel

Day 6 Now that I have a new user, I will update the frontend to talk to the new backend. I started by updating the original logIn.tsx file to use the login function provided in https://github.com/laravel/breeze-next/blob/master/src/hooks/auth.js (same as the file I used in the registering flow). It was a lot easier this time around because I had been through the process with the registering flow. I replaced the calls to my existing login logic with the new login function. Then I updated how the errors are shown. They are now arrays, so I updated the code to reflect that. ...

Day 5 Updating the request data to send what Laravel expects I get a 422 from the /api/register endpoint when sending this data: { "email": "[email protected]", "password": "bbbbbb", "username": "a" } The response helpfully tells me { "message": "The name field is required. (and 2 more errors)", "errors": { "name": ["The name field is required."], "password": [ "The password field confirmation does not match.", "The password field must be at least 8 characters." ] } } +1 for developer experience because the data is validated out of the box and clear error messages are provided. ...

Day 4 Sessions Table doesn’t exist I was getting an error about the sessions table not existing. I fixed it by running the migrations. sail artisan migrate 419 Page Expired Laravel is now returning the cookie with the call to /sanctum/csrf-cookie. However, I get a 419 Page Expired error immediately after when calling /register. Possibilities investigated: The call is sending the Set-Cookie header to the server. I was calling the CSRF endpoint twice (once in a console.log) and once for real. I wondered if that was the problem, but nothing changed once I updated it to only call once. According to docs for Sanctum, “[i]f your JavaScript HTTP library does not set the value for you, you will need to manually set the X-XSRF-TOKEN header to match the URL decoded value of the XSRF-TOKEN cookie that is set by this route.” I am going to try to get the cookie and set the header manually. First, I need to figure out how to get the cookie values from the fetch response. Scratch that. I’m just going to use Axios. I didn’t want to bring in such a big dependency, but I cannot recreate Axios’s feature where it can get the cookie from one request response and set it as a header in the next request. It seems like there should be a way to do that in native JS if Axios can do it. Maybe I’ll do some further research later. Axios Once I added Axios, the XSRF token was being sent correctly. I think withXSRFToken is the key to that. ...

Day 3 I did some more adjusting of the useAuth hook. It’s getting closer. I commented out all the functions except for the register one. I also updated the .env.local to point VITE_API_URL to the laravel backend. In my first tests hitting the csrf endpoint, it returns a laravel error. That’s my next task. SQLSTATE[42P01]: Undefined table: 7 ERROR: relation "sessions" does not exist Next steps I’ll double check the database migrations, because it’s odd the sessions table is missing. ...

Day 2 I guess there are a lot of things I could do at this point. I think integrating Laravel’s auth system with my existing front end would be a good start. I created two directories in my project: frontend/ and backend/. I copied my existing front end into frontend/ and put the new laravel code into backend/. sail up Verified that http://0.0.0.0/up is responding! sail artisan route:list shows me I have various API routes related to auth including register, login, logout, etc. ...

Day 1 I have some experience with Laravel (I built spendweek.com with Laravel and Vue). But it’s been a while since I dove into the ecosystem. I have to say, it’s a lot. You are presented with a lot of options right up front: Blade Livewire Inertia Breeze Jetstream I got a bit of analysis paralysis because I didn’t want to start in the wrong direction. Luckily, I have this project and the clock is ticking. Having a React frontend already built narrowed down the options. Breeze seemd to fit my needs and the constraints of having a React frontend already. Also, this reference implementation gave me confidence I’d have documentation to follow if I got stuck. ...