Boilerplate / Starter kit. Laravel 5.7, Vue CLI 3 — Authentication with Email Verification. REST API.

PHP 78.83% HTML 1.44% Vue 18.56% CSS 1.17%

vue laravel boilerplate authentication authorization auth vue-cli profile

laravel5.7-vue-cli3-boilerplate's Introduction

Boilerplate / Starter kit. Laravel 5.7, Vue CLI 3 SPA with Auth.

Features

Laravel 5.7 Verification via API!
Forgot password and Reset password
Profile with user info
Password change
Auth through tymon/jwt-auth with refresh token functional
Auth route middleware(guest, auth)
Bootstrap 4
vue-notifications (with iziToast) There is no attachment to a particular library!
Vee-validate validation
Package integrating axios in vue: vue-plugin-axios

Installation

git clone https://github.com/iliyaZelenko/laravel5.7-vue-cli3-boilerplate.git
composer install
Copy .env.example to .env and set your database connection details and FRONTEND_URL, APP_URL
Generate the Laravel app key: php artisan key:generate
To make the JWT authorization work: php artisan jwt:secret (it generates JWT_SECRET in .env)
If you want mail verification to work, then configure MAIL_USERNAME and MAIL_PASSWORD in .env
php artisan migrate:fresh --seed make tables and users
cd frontend
Copy .env.example to .env and set your VUE_APP_BACKEND (backend url)
yarn or npm install

Create an issue if you have questions, I will help.

Usage

Frontend is in the folder frontend, the following commands for this folder:

Compiles and hot-reloads for development

yarn serve // OR npm run install

For laravel server you can run php artisan serve(in root directory)

Compiles and minifies for production

yarn build // OR npm run build

You can open your finished build via laravel SpaController! The index file in app/resorces/views/index.blade.php content is generated via vue! Your css, js, img, etc... will be added to the app/public folder!

Lints and fixes files

yarn lint // OR npm run lint

Run your unit tests

yarn test:unit // OR npm run test:unit

Run your end-to-end tests

yarn test:e2e // OR npm run test:e2e

Also i have vuetify and nuxt + vuetify version! Let me know if you are interested in this project.

TODO (support me with a star)

i18n
avatar
select timezone and display date/time for user timezone
socialite
all users have public profile and own settings page
unit and end-to-end tests

laravel5.7-vue-cli3-boilerplate's People

Contributors

Stargazers

Watchers

laravel5.7-vue-cli3-boilerplate's Issues

Unauthorized when dipatch refresh token

Hi there,

Thank you for this tremending boilerplate. I am trying to implement this and I think the last thing where I am failing is the refresh token from vuex.

I don't really get how to implement this as I keep receiving an Unauthorized response from laravel.

Could anyone help?

Implementation in current Laravel Project

Hi, quick questions, how do I implement this in to my current Laravel 5.7 website. Do I just clone it in to my web directory? Or is there a better way?

Currently I have followed what was stated here

https://stackoverflow.com/questions/52362927/laravel-email-verification-5-7-using-rest-api

and everything seems to work, however when I click on the "Verify Email Address" I get transferred to my incorrect login API route (By incorrect I mean /api/login instead of /login). I am aware that this has a lot to do with

$this->middleware('auth');

would it be possible to just grab the files needed?

I would really like to use this before I decide to write my own. Any help would be greatly appreciated.

Troubles making app working

Hey there!
I am trying (as a newbie) to make your boilerplate working, I followed the entire documentation but facing the following errors : https://ibb.co/cCGygcL
Could you help me with this because I spent hours on this without found out what was my mistakes...
I've launched the serve, seeing the login/signup panel, but when I click on signup button those errors occurs and nothing seems to be working...
Your help would be appreciated!
Regards,
Laurent

I have a issue

when I want to resent verification link and when I want to register I get a message "Trying to access array offset on the value of type null"
here are my env files
frontend

default laravel URL

VUE_APP_BACKEND=http://loc.laravel-vue.com
VUE_APP_TITLE=Auth(Vue + Laravel)

backend
FRONTEND_URL=http://localhost:8080
FRONTEND_EMAIL_VERIFY_URL=/verify-email?queryURL=

APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:6DNfd7eCu0jj2q+MEZ1YMb41wSwXwdsnLFbqnBsA94k=
APP_DEBUG=true
APP_URL=http://loc.laravel-vue.com

LOG_CHANNEL=stack

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=project
DB_USERNAME=root
DB_PASSWORD=

BROADCAST_DRIVER=log
CACHE_DRIVER=file
QUEUE_CONNECTION=sync
SESSION_DRIVER=file
SESSION_LIFETIME=120

REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379

MAIL_DRIVER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=2525
MAIL_USERNAME=[email protected]
MAIL_PASSWORD=+37443184533
MAIL_ENCRYPTION=null

PUSHER_APP_ID=
PUSHER_APP_KEY=
PUSHER_APP_SECRET=
PUSHER_APP_CLUSTER=mt1

MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

JWT_SECRET=kTdivbB88qUGzGkjMFzI3kHuDol1zwjz

Настройки? settings?

Наверное я в ночи уже совсем закопался.
Edit .env to set your database connection details and FRONTEND_URL, APP_URL
Edit .env to set your VUE_APP_BACKEND(backend url)

Вот совсем не понимаю как связать воедино.

php artisan serve запустить localhost:8000
если запустить npm run serve то порт будет по дефолту 8081 скажем.

Но у меня задача сделать все на едином домене. Поэтому на Ваш проект и забрел.
Подскажите, пожалуйста на пальцах какие настройки выставить в .env файлах.

FRONTEND_URL = http://localhost:8081
APP_URL = http://localhost:8000

создаю вручную .env в папке frontend и прописываю
VUE_APP_BACKEND = "http://localhost:8000"
?

Был бы признателен за содействие

и какой сервер запускать тогда в итоге, чтоб срабатывал hot reload?

iliyazelenko / laravel5.7-vue-cli3-boilerplate Goto Github PK