How do I make structure SPA and SSR with Laravel? - laravel

I'am using Laravel + Nuxt for current project.
Web app has user pages and admin pages.
user pages are working in Laravel + Nuxt SPA but admin pages should works on pure Laravel SSR.
I dont know how to make project structure.
Thank you in advance.

I found answer in this package
https://github.com/m2sd/nuxt-laravel
Main point is route web.php
It redirects SPA requests to Nuxt router
Admin dashboard router should be extracted into new file(ex. admin.php)
Correct answer is following to above article.

Related

Sanctum not working with subdomain SPA with vue3

i am using sanctum with multiple subdomain dynamically created on user creation but when I am using test.localhost/project_name subdomain sanctum auth not working but when i am using localhost/project_name its working fine. i have added
SESSION_DOMAIN=.localhost
SANCTUM_STATEFUL_DOMAINS=umer.localhost:8000,umer.localhost:3000
but no any solution got. if you have any solution please share with me.

Laravel + Vue restrict access to some api routes

I have laravel 8 backend app, serving as API for frontend using Vue 3
In my routes/api.php I have
Route::post('/teachers', [TeacherController::class, 'index'])->name('teachers');
This will return list of teachers to be used in VueJS.
How do I restrict so that only my VueJS app can access api/teachers ? I successfully hitting the api above using POSTMAN, which I expect it to be failed.
I have laravel sanctum installed, although i'm not so sure whether this is something sanctum can help with.
Thanks

connect nuxtJS with laravel

I'm new in LARAVEL and nuxtJS, So sorry for my question if it somehow silly. I'm working on a project that developed by anthor one. There is no implementation. The client gave me two folder one for frontend developed by nuxtJS and one for backend developed by laravel.
I tried to run a project. But I fails. Could anyone to help me in that. I installed npm for nuxtJS and composer for laravel.
please ask me for anypart of a code which can help. And I'll post it
Thak you.
Assuming Laravel is intended as an API, treat each folder as a separate app. Startup your nuxt application like any other nuxt application. Startup your Laravel application like any other Laravel application. Then using axios or some other fetch library inside your nuxt app, make requests to your Laravel url.
Say you have nuxt running on http://localhost:3000 and you have Laravel running on https://localhost:8000. Inside your nuxt app, where you need to connect to Larvel, you can use axios to get access to your data from Laravel (e.g. axios.get('http://localhost:8000/api/some/resource'))
The docs on asyncData has a good example of making API calls https://nuxtjs.org/guide/async-data

Connect backend and frontend

How to connect frontend to backend?
The site was Laravel 5.7 + VUE. Now was completely written from scratch in JS frontend (self-written).
I. e. it is necessary to leave the old backend (Laravel 5.7) + API and connect the new frontend to it.
As I understand it, you need to rewrite the old backend for a new frontend or not?
New frontend only. The task is to connect the old backend and API to the new frontend.
It's not necessary to rewrite your backend, in fact a would try to leave it as it is, and just try to connect new frontend with existing backend API (endpoints). Or is there any specific reason for changing the backenend codebase?
VUE is a Javascript frontend framework and Laravel is a framework for PHP so you do not need to rewrite the backend. What you need to do is configure your frontend to match the
Laravel codebase in the backend.

How should I authenticate in SPA using VueJS and Vue Router?

I am building a SPA website with Laravel for back-end and VueJS for front-end. And now I want to authenticate users in my website. So I used Laravel Passport for that. My question is that how should I keep user access token and refresh token in vue to make another requests for authentication required routes? Thanks in advance :)

Resources