diff --git a/README.md b/README.md index dcf6b31..d952ff5 100644 --- a/README.md +++ b/README.md @@ -1,21 +1,94 @@ -# vuex-feature-scoped-structure +# vuex-feature-scoped-structure by igeligel -> A Vue.js project +> A Vue.js/Vuex project showcasing a complex but scalable store structure. This project was created in cooperation with [3yourmind](https://github.com/3YOURMIND). -## Build Setup +badge of license +badge of pull request welcome +badge of hiring advertisement of 3yourmind +badge of github star -``` bash -# install dependencies -npm install +## Showcase/Architecture -# serve with hot reload at localhost:8080 -npm run dev +A feature scoped, but still namespaced store structure. `index.vue` is the container of the module. -# build for production with minification -npm run build +

+ diagram +

structure of the store system

+

-# build for production and view the bundle analyzer report -npm run build --report -``` +

+ file structure + structure of the store system in visual studio code +

-For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader). +## Dependencies + +

+ npm dependencies + + | Dependency | Version | + | ---------- | ------- | + | vue | ^2.5.2 | + | vue-router | ^3.0.1 | + | vuex | ^3.0.0 | +

+ +## Installation + +The installation process is split into two sections for [development](#development) and [production](#production) use. You can find a production version of this site live at [vuex-simple-structure.netlify.com](https://vuex-simple-structure.netlify.com/). + +### Development + +

+ instructions + + #### Using npm + + ```shell + npm install + npm run dev + ``` + + #### Using yarn + + ```shell + yarn install + yarn run dev + ``` +

+ +### Production + +

+ instructions + + #### Using npm + + ```shell + npm install + npm run build + ``` + + #### Using yarn + + ```shell + yarn install + yarn run build + ``` +

+ +## Examples + +- [igeligel/vuex-feature-scoped-structure](https://github.com/igeligel/vuex-feature-scoped-structure) + +## Contact + +Twitter of Kevin Peters + +## Contributors + +

igeligel

Contributions: 7

+ +## License + +*vuex-feature-scoped-structure* is realeased under the [MIT License](/License.md). diff --git a/docs/structure.png b/docs/structure.png new file mode 100644 index 0000000..e8c6377 Binary files /dev/null and b/docs/structure.png differ diff --git a/docs/structure.svg b/docs/structure.svg new file mode 100644 index 0000000..9dd5107 --- /dev/null +++ b/docs/structure.svg @@ -0,0 +1,681 @@ + + + + + + + + + + + + + + + + + + + + + + + Page-1 + + + + Rectangle.3 + modules + + + + + + + + + + modules + + Rounded Rectangle.5 + index.js + + + + + + + + + + + + + + + + + + + + + + + + + index.js + + Rectangle.22 + chat + + + + + + + + + + chat + + Rectangle.23 + products (collapsed) + + + + + + + + + + products(collapsed) + + Rounded Rectangle.24 + index.vue + + + + + + + + + + + + + + + + + + + + + + + + + index.vue + + Rounded Rectangle.41 + index.js + + + + + + + + + + + + + + + + + + + + + + + + + index.js + + Rounded Rectangle.42 + actions.js + + + + + + + + + + + + + + + + + + + + + + + + + actions.js + + Rounded Rectangle.43 + getters.js + + + + + + + + + + + + + + + + + + + + + + + + + getters.js + + Rounded Rectangle.44 + mutations.js + + + + + + + + + + + + + + + + + + + + + + + + + mutations.js + + + + + + + + + + + + + + + + + + + Dependency.45 + + + + + + + + + + + + + + + + + + + + + + + Dependency.50 + + + + + + + + + + + + + + + + + + + + + + + Dependency.55 + + + + + + + + + + + + + + + + + + + + + + Association + + + + + + + + + + + + + + + + + + + + + Association.85 + + + + + + Rectangle.90 + _api + + + + + + + + + + _api + + Rectangle.91 + _components + + + + + + + + + + _components + + Rectangle.92 + _store + + + + + + + + + + _store + + Rounded Rectangle.98 + ChatList.vue + + + + + + + + + + + + + + + + + + + + + + + + + ChatList.vue + + Rounded Rectangle.99 + ChatListElement.vue + + + + + + + + + + + + + + + + + + + + + + + + + ChatListElement.vue + + + + + + + + + + + + + + + + + + Association.100 + + + + + + + + + + + + + + + + + + + + + + Association.105 + + + + + + + + + + + + + + + + + + + + + + Association.110 + + + + + + + + + + + + + + + + + + + + + + + Dependency + + + + + + + + + + + + + + + + + + + + + + Dependency.120 + + + + + + + + + + + + + + + + + + + + + + Association.130 + + + + + + + + + + + + + + + + + + + + + + Dependency.140 + + + + + + + + + + + + + + + + + + + + + + Association.150 + + + + + + diff --git a/docs/structure.vsdx b/docs/structure.vsdx new file mode 100644 index 0000000..4b03687 Binary files /dev/null and b/docs/structure.vsdx differ diff --git a/docs/vs-code-folder-structure.png b/docs/vs-code-folder-structure.png new file mode 100644 index 0000000..473492d Binary files /dev/null and b/docs/vs-code-folder-structure.png differ