LaravelLaravel & VueJsVueJs

Vueniverse: Full stack user based PWA Vue template



Vueniverse

Vueniverse is a ready to go template, full stack, user based, with lots of features. It can be used trought the vue-cli to start your next Progressive Web App since right now it has 100/100 lighthouse score.

Features

  • PWA by default, 100/100 lighthouse PWA score.
  • Universal es2015 JavaScript. No more context switching between client/server code!
  • A REST API, and full user authentication with JWT, Redis blacklisting, and MongoDB.
  • Client Side routing, Server Side Rendering and Global State Management thanks to Vue.js and Nuxt.js!
  • Abstracted WebPack build process.
  • Universal HMR for a clean development process, thanks to Nuxtjs and BackPack.
  • Ready for deployment with NOW

Live Demo

The project is deployed and you can check out its files, like package.json and the general structure of the template, all available here.

Using the template

You need vue-cli installed.

npm install -g vue-cli

Create a Project

vue init rlindskog/vueniverse {{ your-project-name }}
cd {{ your-project-name }}
npm install

Start a MongoDB database locally

npm run start-db

Stop the MongoDB database locally

npm run stop-db

Run in development

npm run dev

Build for production

npm run build

Run in production (runs the database and application in a subprocess)

npm run start

Stop production running (stops the database and application)

npm run stop

Start a Redis database locally (use this if chose the redis session option)

★ READ ALSO ★  Laravel 5 - Ajax crop image before upload using using croppie plugin

Install

$ wget http://download.redis.io/redis-stable.tar.gz
$ tar xvzf redis-stable.tar.gz
$ cd redis-stable
$ make
$ # wait for it to install...
$ sudo cp src/redis-server /usr/local/bin/
$ sudo cp src/redis-cli /usr/local/bin/

Then run

redis-server

You will have to make a database elsewhere Atlas free teir is recommended. When you do, paste the URL to the DB_URL and a random SECRET variable to the secrets.json file.

Then run

npm run deploy

If you encounter any problems or have any suggestions, visit the code repository of this project, by clicking here.




Source link

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Close