39d7581c6c
* Some random quick (#9111) * Switch group button directions * Allowed admins to export challenges * Added scoping to some stable styles * Fixed challenge cloning * Tasks tags (#9112) * Added auto apply and exit * Add challenge tag editing * Fixed lint * Skill fixes (#9113) * Added local storage setting for spell drawer * Added new spell styles * Fixed typo * Reset local creds if access is denied (#9114) * various fixes: group leader's name at top of edit drop-down; Members List; etc (#9117) * fix text describing location of subscription/gem gift box * disable Copy As To-Do in Tavern, guilds, party because it's not working * change members label on group pages to Member List * remove outdated info about seeing number of Gems available to buy * allow Danger Zone to be seen by players without local authentication Also add an hr because the Danger Zone heading was crammed up against the button above it. * put current group leader's name at top of Leader change drop-down * Client Fixes (#9120) * unduplicate logout code * re-enable debug menu * fix pets badge and equipping mounts * close gift modal after sending gems * armoire notifications * Oct 1 fixes (#9121) * Added default tags to task * Added seasonal gear check and show spooky * Disabled spooky sparkles * Fixed challenge remove tasks modal * Hid checklist * Added group gems modal * Purchase with amazon * Added check for user health * Added missing notification file |
||
|---|---|---|
| .. | ||
| assets | ||
| components | ||
| directives | ||
| filters | ||
| libs | ||
| mixins | ||
| store | ||
| .babelrc | ||
| .eslintrc | ||
| app.vue | ||
| index.html | ||
| main.js | ||
| README.md | ||
| readme.md | ||
| router.js | ||
#Running
- Open a terminal and type
npm run client:dev - Open a second terminal and type
npm start
#Preparation Reading
-
Vue 2 (https://vuejs.org)
-
Webpack (https://webpack.github.io/) is the build system and it includes plugins for code transformation, right now we have: BabelJS for ES6 transpilation, eslint for code style, less and postcss for css compilation. The code comes from https://github.com/vuejs-templates/webpack which is a Webpack template for Vue, with some small modifications to adapt it to our use case. Docs http://vuejs-templates.github.io/webpack/
-
We’re using
.vuefiles that make it possible to have HTML, JS and CSS for each component together in a single location. They’re implemented as a webpack plugin and the docs can be found here http://vue-loader.vuejs.org/en/ -
SemanticUI is the UI framework http://semantic-ui.com/. So far I’ve only used the CSS part, it also has JS plugins but I’ve yet to use them. It supports theming so if it’s not too difficult we’ll want to customize the base theme with our own styles instead of writing CSS rules to override the original styling.
The code is in /website/client. We’re using something very similar to Vuex (equivalent of React’s Redux) for state management http://vuex.vuejs.org/en/index.html
The API is almost the same except that we don’t use mutations but only actions because it would make it difficult to work with common code
The project is developed directly in the develop branch as long as we’ll be able to avoid splitting it into a different branch.
So far most of the work has been on the template, so there’s no complex logic to understand. The only thing I would suggest you to read about is Vuex for data management: it’s basically a Flux implementation: there’s a central store that hold the data for the entire app, and every change to the data must happen through an action, the data cannot be mutated directly.