Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/MichaelCurrin/vue-quickstart
Starter template for a Vue 2 site - including docs and CI deploy to GH Pages
https://github.com/MichaelCurrin/vue-quickstart
javascript minimal-template quickstart template vue vue-cli vue-quickstart vuejs yarn
Last synced: 4 months ago
JSON representation
Starter template for a Vue 2 site - including docs and CI deploy to GH Pages
- Host: GitHub
- URL: https://github.com/MichaelCurrin/vue-quickstart
- Owner: MichaelCurrin
- License: mit
- Created: 2020-05-08T08:47:03.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2021-11-10T11:36:49.000Z (about 3 years ago)
- Last Synced: 2024-04-28T05:03:45.417Z (9 months ago)
- Topics: javascript, minimal-template, quickstart, template, vue, vue-cli, vue-quickstart, vuejs, yarn
- Language: Vue
- Homepage: https://michaelcurrin.github.io/vue-quickstart/
- Size: 2.15 MB
- Stars: 2
- Watchers: 3
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Vue Quickstart
> Starter template for a Vue 3 site - including docs and CI deploy to GH Pages[![Deploy GH Pages](https://github.com/MichaelCurrin/vue-quickstart/workflows/Deploy%20GH%20Pages/badge.svg)](https://github.com/MichaelCurrin/vue-quickstart/actions)
[![GitHub tag](https://img.shields.io/github/tag/MichaelCurrin/vue-quickstart)](https://github.com/MichaelCurrin/vue-js-quickstart/tags/)
[![License](https://img.shields.io/badge/License-MIT-blue)](#license)[![Made with Node](https://img.shields.io/badge/Node.js->=12-blue?logo=node.js&logoColor=white)](https://nodejs.org)
[![Made with Yarn](https://img.shields.io/badge/Yarn->=1-blue?logo=yarn&logoColor=white)](https://classic.yarnpkg.com)
[![Made with Vue](https://img.shields.io/github/package-json/dependency-version/MichaelCurrin/vue-quickstart/vue?logo=vue.js)](https://www.npmjs.com/package/vue)## Preview
## Use this project
[![View site GH Pages](https://img.shields.io/badge/View-Demo_site-blue?style=for-the-badge)](https://michaelcurrin.github.io/vue-quickstart/)
[![Use this template](https://img.shields.io/badge/Generate-Use_this_template-2ea44f?style=for-the-badge)](https://github.com/MichaelCurrin/vue-quickstart/generate)
After you've looked at the demo screenshot and site, you are welcome to create your own using the template button. This will copy this project and add it to your repos (no forking needed, but please star the original repo).
## Documentation
> How to install and run the app locally and deploy it to GH Pages[![View - Documentation](https://img.shields.io/badge/View-Documentation-blue?style=for-the-badge)](/docs/)
## About
### What is Vue?
> Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
### Why not React?
Vue is intended to be more beginner-friendly (I agree it is) and the [vue](https://github.com/vuejs/vue) repo has more GH stars than the [react](https://github.com/facebook/react) repo, if that is any indication of adoption by the community.
Vue is open-source and was created by one person originally. React was created at Facebook.
### Resources
Need are some resources to get started or learn more advanced topics?
See [Vue](https://github.com/MichaelCurrin/learn-to-code/blob/master/en/topics/scripting_languages/JavaScript/frameworks.md#vue) in my Learn to Code project.
### Origin
This project was created using the Vue CLI:
```sh
$ vue create my-project
$ # OR if not installed.
$ npx @vue/cli create my-project
```See the [Creating a project](https://cli.vuejs.org/guide/creating-a-project.html) section of the docs.
This project used mostly default content from that command, but adds the following:
- Sample image
- Detailed docs
- GH Pages setup
- Linting with and without fixes
- PrettierOn the last point, the `prettier` package was added so that it can be used when linting to pick up inconsistent styling. For example:
```
...
warning: Insert `;` (prettier/prettier) at vue.config.js:5:2:
...
```See these areas in [package.json](/package.json):
- `eslint-plugin-prettier` package
- `prettier` package
- `@vue/prettier` in ESLint configThat based on what you get in the Vue Router setup.
## Related projects
- Vue-based projects:
- [Vue TypeScript Quickstart](https://github.com/MichaelCurrin/vue-typescript-quickstart) - like this project but with TypeScript added.
- [Vue Router Quickstart](https://github.com/MichaelCurrin/vue-router-quickstart) - like this project but with Vue Router added for a multi-page site.
- [Vue Vuex Quickstart](https://github.com/MichaelCurrin/vue-vuex-quickstart) - like this project but with Vuex added.
- [VuePress Quickstart](https://github.com/MichaelCurrin/vuepress-quickstart) - using VuePress, a static site generator built on a Vue.
- [Nuxt Default Quickstart](https://github.com/MichaelCurrin/nuxt-default-quickstart) - using Nuxt, a mix between a SPA and a static site generator that is built on Vue.
- [Vue Frontend Quickstart](https://github.com/MichaelCurrin/vue-frontend-quickstart) - a simple site that uses Vue on the frontend without Node or build step.
- [React Quickstart](https://github.com/MichaelCurrin/react-quickstart) - like this project, but using React instead of Vue.
- [Node Project Template](https://github.com/MichaelCurrin/node-project-template) - a more generic Node template.## License
Released under [MIT](/LICENSE) by [@MichaelCurrin](https://github.com/MichaelCurrin).