Skip to content

reshaelfianur/laravel-vue

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Scrutinizer Code Quality Quality Gate Status CircleCI

Laravel eCommerce

Ecommerce site with Laravel 8, Vue 3 and Stripe.

Screenshot:


Project screenshot


Stripe screenshot:


Stripe screenshot


Features

  • Laravel 8

  • Vue 3 with composition API

  • Vuex 4 state management

  • Form validation with Vee Validate and Yup

  • Vuex-persist for persisting cart after page refresh

  • Stripe for payments

  • Easily change currency by setting two environment variables: CASHIER_CURRENCY and CASHIER_CURRENCY_LOCALE

  • ESLint code linting with AirBnB ruleset

  • CSS animations

  • Responsive mobile menu

  • SonarCloud code quality scanner integration on all pull requests

  • Laravel tests with CircleCI integration

Setup

  • Fork or clone the project

  • Ensure you have PHP 7.4 or newer installed and setup properly (alternatively use Docker, see https://laravel.com/docs/8.x/sail)

  • Ensure you have access to a PostgreSQL database

  • Ensure you have Node installed

  • Rename .env.example to .env and modify the values

  • Run composer install to install the PHP dependencies with Composer. Check out https://getcomposer.org/ if necessary

  • Run npm install to install the Node dependencies needed by the project. Check out https://nodejs.org/en/ if necessary

  • Run php artisan:migrate to setup the Laravel database migrations

  • You should create at least one sample product. Although you can use the builtin factory seeders, I prefer to do manual creation for testing purposes.

    To do so run these commands after running php artisan tinker:

    $product = new App\Models\Product();
    $product->name = 'Example Product';
    $product->slug = 'example-product';
    $product->description = 'Example product description';
    $product->imageUrl = 'url to image';
    $product->price = 99;
    $product->save();
  • Run npm run watch to serve the Vue 3 files

  • Run php artisan serve to serve the PHP files

  • Open up http://localhost:8000 in your browser

TODO

  • Do WCAG analysis and ensure there are no issues

  • Finish implementing search with meilisearch-vue or vue-instantsearch when Vue 3 is supported

  • Add some tests to verify that the cart and checkout works correctly

  • Consider adding an admin dashboard

  • Look into performance optimization

About

Laravel (PHP) eCommerce site with Vue 3 frontend

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • PHP 89.3%
  • Vue 9.9%
  • Other 0.8%