creativetimofficialcreativetimofficial
13

Vue Now UI Dashboard Laravel

screenshot of Vue Now UI Dashboard Laravel

Vue SPA Now UI template connected to working Laravel REST API with the help of json:api standard

Github

Overview:

The Vue Now UI Dashboard Laravel is a fullstack resource developed in partnership with UPDIVISION. It offers a wide range of UI components and features, including a Vue Now UI frontend and an API-powered Laravel backend. This dashboard allows developers to seamlessly transition from frontend to fullstack development when building their applications.

Features:

  • UI Components: The dashboard provides a vast collection of UI components that can be easily utilized in frontend development.
  • Laravel Backend: The API-powered Laravel backend enables smooth data management and communication between the frontend and backend.
  • Fullstack Resource: The Vue Now UI Dashboard Laravel offers a complete solution for developers, allowing them to work on both frontend and backend aspects of their applications.
  • Pro Version: For additional features, developers have the option to upgrade to the PRO version of Vue Now UI Dashboard Laravel.

Laravel API Setup:

  1. Ensure you have a multi-threaded web server environment such as Apache or Nginx with PHP, Composer, and MySQL installed. Note that using the built-in PHP web server (php artisan serve) may result in stalled requests.
  2. Consider using Laradock for Linux and Mac or Laragon for Windows to facilitate the setup process.
  3. Alternatively, you can set up WAMP on Windows or LAMP on Linux and Mac.
  4. Install Composer 2 from the official website (https://getcomposer.org/doc/00-intro.md).
  5. Navigate to your Laravel API project folder using the command line: cd your-laravel-json-api-project.
  6. Install project dependencies by running the command: composer install.
  7. Create a new .env file by copying the .env.example file: cp .env.example .env.
  8. Update the .env file with your own database credentials (DB_DATABASE, DB_USERNAME, DB_PASSWORD).
  9. Create the users table by running the migration command: php artisan migrate --seed.
  10. Generate the application key: php artisan key:generate.
  11. Install Laravel Passport: php artisan passport:install. Set the received CLIENT_ID and CLIENT_SECRET in the .env file.
  12. Add your own mailtrap.io credentials in the .env file (MAIL_USERNAME and MAIL_PASSWORD).

Vue Now UI Dashboard Project Installation:

  1. Ensure you have a working local environment with NodeJS version 8.9 or above (8.11.0+ recommended), npm, and VueCLI installed.
  2. Install Node.js from the official website (https://nodejs.org/) using the recommended version.
  3. Install npm by following the instructions at https://www.npmjs.com/get-npm.
  4. Install VueCLI by following the installation guide at https://cli.vuejs.org/guide/installation.html.
  5. Navigate to your Vue Now UI Dashboard project folder using the command line: cd your-vue-now-ui-dashboard-project.
  6. Install project dependencies by running the command: npm install.

Summary:

The Vue Now UI Dashboard Laravel is a comprehensive fullstack resource that offers developers a seamless transition from frontend to fullstack development. With its extensive collection of UI components and API-powered Laravel backend, developers can build sophisticated applications with ease. The installation process involves setting up both the Laravel API project and the Vue frontend, with detailed instructions provided for each component. Users also have the option to upgrade to the PRO version for additional features.