Setup | Skote - Vuejs Admin & Dashboard Template

Introduction

Skote is built with Laravel 8.* with Vuejs which provides a clean Laravel application.

Skote is an admin dashboard template that is a beautifully crafted, clean & minimal designed admin template with Dark, Light Layouts with RTL options. You can build any type of web application like Saas based interface, eCommerce, CRM, CMS, Crypto, Project management apps, Admin Panels, etc.

It will help your team moving faster and saving development costs and valuable time. If you’re a developer and looking for an admin dashboard that is fully responsive with Bootstrap and Laravel VueJs. You are at the right place to start your project using Skote - Laravel Vuejs Responsive Bootstrap v5.1.1 Admin Dashboard.

If you have any questions that are beyond the scope of this documentation, please feel free to contact us via support on https://themeforest.net/item/skote-vuejs-admin-dashboard-template/25444550/support

Setup Firebase or Fake-Backend authentication

Default we have set fake-backend authentication in this template. You can simply change to firebase or fakebackend by changing in .env file.
Fake-backend : VUE_APP_DEFAULT_AUTH=fakebackend

To setup firebase authentication fill the below details in the .env file.
Firebase : VUE_APP_DEFAULT_AUTH=firebase

VUE_APP_DEFAULT_AUTH=firebase                                                  
VUE_APP_APIKEY=
VUE_APP_AUTHDOMAIN=
VUE_APP_DATABASEURL=
VUE_APP_PROJECTId=
VUE_APP_STORAGEBUCKET=
VUE_APP_MESSAGINGSENDERID=
VUE_APP_APPId=
VUE_APP_MEASUREMENTID=

Prerequisites

Please follow below steps to install and setup all prerequisites:

Composer
Make sure to have the Composer installed & running in your computer.
Git
Make sure to have the Git installed globally & running on your computer. If you already have installed git on your computer, you can skip this step.
Nodejs
Make sure to have the Node.js installed & running in your computer. If you already have installed Node on your computer, you can skip this step if your existing node version is greater than 10.

Installation

To setup the admin theme, follow below-mentioned steps:

Install Prerequisites
Make sure to have all above prerequisites installed & running on your computer
Install Dependencies
Open your terminal at the root directory of the project, go to your folder and enter the command npm install. This would install all the required dependencies in the node_modules folder.

After you finished with the above steps, you can run the following commands to run the project locally or build for production use:

Command	Description
`npm install`	This would install all the required dependencies in the `node_modules` folder.
`composer install`	To add Laravel packages defined in composer.json file.
`npm run dev`	To compile all assets files like SCSS, JS and will copy all images into the public directory.
`npm run prod`	To compile all assets files like SCSS, JS and will copy all images into the public directory for production.
`npm run watch`	If you are working / changing any assets file it will auto compile all assets.
`php artisan serve`	The development server is accessible at http://localhost:8000.

i18n Language translation settings

How to add new language? Let add French language in the existing language.

Create de.json file in /resources/js/locales/en.json folder.

Add new language property in /resources/js/components/nav-bar.vue file.

languages: [{
    flag: "/images/flags/germany.jpg",
    language: "de",
    title: "German",
}];

To change default language to german? update below code in the /resources/js/i18n.js file.

export default new VueI18n({
    locale: process.env.VUE_APP_I18N_LOCALE || locale || "de",
    fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || "de",
    messages: loadLocaleMessages()
});