{"id":13536358,"url":"https://github.com/codecasts/spa-starter-kit","last_synced_at":"2025-12-29T23:28:56.277Z","repository":{"id":76012267,"uuid":"74694970","full_name":"codecasts/spa-starter-kit","owner":"codecasts","description":"A highly opinionated starter kit for building Single Page Applications with Laravel and Vue.js","archived":false,"fork":false,"pushed_at":"2018-10-03T23:19:57.000Z","size":1136,"stargazers_count":913,"open_issues_count":22,"forks_count":134,"subscribers_count":73,"default_branch":"develop","last_synced_at":"2024-11-03T01:33:05.967Z","etag":null,"topics":["javascript","laravel","php","single-page-app","spa","starter-kit","vue"],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codecasts.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2016-11-24T17:57:20.000Z","updated_at":"2024-09-07T15:07:51.000Z","dependencies_parsed_at":"2023-02-28T03:30:28.864Z","dependency_job_id":null,"html_url":"https://github.com/codecasts/spa-starter-kit","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codecasts%2Fspa-starter-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codecasts%2Fspa-starter-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codecasts%2Fspa-starter-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codecasts%2Fspa-starter-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codecasts","download_url":"https://codeload.github.com/codecasts/spa-starter-kit/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246750771,"owners_count":20827779,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","laravel","php","single-page-app","spa","starter-kit","vue"],"created_at":"2024-08-01T09:00:37.711Z","updated_at":"2025-12-29T23:28:56.238Z","avatar_url":"https://github.com/codecasts.png","language":"PHP","readme":"# Codecast's Single Page Application Starter Kit\n\n[![Build Status](https://travis-ci.org/codecasts/spa-starter-kit.svg?branch=develop)](https://travis-ci.org/codecasts/spa-starter-kit)\n\n![Cover](http://vedovelli.com.br/spas.png)\n\n\u003e A **highly opinionated** Single Page Application starter kit built on top of Vue.js and Laravel.\n\nThis package contains two separate projects to act as a starting point for a Single Page Application: a Vue.js project (created with vue-cli + webpack template) and a Laravel 5.3 project.\n\nThey're not just freshly created projects but a fully working application that can be modified and expanded to become your own application.\n\n## Demo\n\nThe live demo can be found in [https://spa.codecasts.rocks/](https://spa.codecasts.rocks/).\n\n## Features\n\n1. Client side\n    * Vue.js 2.0 project create with vue-cli + webpack template\n    * Centralized state management with Vuex\n    * Route management with Vue-router\n    * Authentication with JWT\n    * Keep user signed in using local stored info\n    * HTTP requests with [Axios](https://github.com/mzabriskie/axios)\n    * ESLint with AirBNB preset\n    * Pagination integrated with [Laravel's LengthAwarePaginator](https://laravel.com/docs/5.3/pagination#converting-results-to-json)\n    * Alerts and Confirmation Alerts provided by [SweetAlert](http://t4t5.github.io/sweetalert/)\n2. Server side\n    * [Laravel 5.3](https://github.com/laravel/laravel/tree/v5.3.16)\n    * Authentication with JWT\n    * [Fractal](http://fractal.thephpleague.com/)\n    * Web service RESTful with Dingo *(planned)*\n\n## Prerequisites\n\nMake sure you have installed **Node** and [**Yarn**](https://yarnpkg.com/) (latest versions) as well as **PHP 7** and **MySQL**.\n\n## Installation\n\n### Cloning\n\nThese commands will download the repository and prepare it for you.\n\n```ssh\ngit clone --depth 1 -b master git@github.com:codecasts/spa-starter-kit.git\ncd spa-starter-kit\nrm -rf ./.git/\ngit init\ngit add --all\ngit commit -m \"init\"\n```\n\n### Setup\n\n1. Client side - this is a Vue.js project created with vue-cli\n\t* With Terminal `cd client \u0026\u0026 yarn \u0026\u0026 yarn run dev`.\n2. Server side - this is a Laravel 5.3 project\n\t* With Terminal:\n        * Navigate to **webservice** folder and then:\n        * `composer install` to install Laravel and third party packages\n        * `touch database/database.sqlite` to create an empty database file\n        * `cp .env.example .env` to configure installation\n        * `php artisan key:generate` to generate unique key for the project\n        * `php artisan jwt:secret` to generate unique key for the project\n        * `php artisan migrate` to create all the tables\n        * `php artisan db:seed` to fill the tables with fake data\n        * `php artisan serve` to serve application on localhost:8000\n\n## Usage\n\n1. Client side\n\t* Your application will be available on **http://localhost:8080**\n2. Server side\n\t* API endpoint is http://**localhost:8000/api**\n\n## Testing\n\nNavigate to **webservice** folder and run the composer test script\n\n``` bash\n$ composer test\n```\n\n## Things worth mentioning\n\n1. Error handling is done globally by making use of Axios' interceptors. But you can still .catch() errors within components to perform actions related to that scope. See /client/src/plugins/http.js;\n\n2. The same way error messages lives in one single component (/client/src/modules/general/alerts.vue) and their visibility is controlled by a Vuex property. So to show/hide messages it is just a matter of dispaching a Vuex action from within any component;\n\n3. The spinner displayed during server requests (see top right close to user indentification) is also controlled by a Vuex property. The procedure to show/hide it is the same as outlined in the item 2 above;\n\n4. routes and Vuex modules live close to the modules they work for. Always look for routes.js and store.js inside a module directory. See /client/src/modules/categories;\n\n5. **Important**: Laravel project found in the directory *webservice* was modified beyond adding routes and controllers. For instance: the *webservice/app/Exceptions/Handler.php* was modified from its original version to return all exceptions to the client, not only HttpExceptions. Other changes are also in place. So our recommendation is to always use this project to build your own, instead of copying controllers and routes to a new project.\n\n## Contributing\n\n1. Fork it!\n2. Create your feature branch from **develop**: `git checkout -b feature/my-new-feature`\n3. Write your code. Comment your code.\n4. Commit your changes: `git commit -am 'Add some feature'`\n5. Push to the branch: `git push origin feature/my-new-feature`\n6. Submit a pull request to **develop** branch :D\n\n## Credits\n\n[Fábio Vedovelli](https://github.com/vedovelli) and dedicated [contributors](https://github.com/codecasts/spa-starter-kit/graphs/contributors).\n\n## License\n\nLicensed under the MIT license.\n","funding_links":[],"categories":["Demo示例","PHP","Awesome Vue.js [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)","脚手架","Components \u0026 Libraries","Scaffold [🔝](#readme)","Scaffold"],"sub_categories":["Libraries \u0026 Plugins","通用的","Scaffold","Universal"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodecasts%2Fspa-starter-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodecasts%2Fspa-starter-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodecasts%2Fspa-starter-kit/lists"}