first commit

.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc.js

@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    node: true
+  },
+  parserOptions: {
+    parser: 'babel-eslint'
+  },
+  extends: [
+    // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+    // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+    'plugin:vue/essential'
+  ],
+  // required to lint *.vue files
+  plugins: [
+    'vue'
+  ],
+  // add your custom rules here
+  rules: {}
+}

.gitignore

@@ -0,0 +1,11 @@
+# dependencies
+node_modules
+
+# logs
+npm-debug.log
+
+# Nuxt build
+.nuxt
+
+# Nuxt generate
+dist

README.md

@@ -0,0 +1,23 @@
+# nuxtgety-2
+
+> Second attempt at building a web interface for ESP8266
+
+## Build Setup
+
+``` bash
+# install dependencies
+$ npm install # Or yarn install
+
+# serve with hot reload at localhost:3000
+$ npm run dev
+
+# build for production and launch server
+$ npm run build
+$ npm start
+
+# generate static project
+$ npm run generate
+```
+
+For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).
+

assets/README.md

@@ -0,0 +1,9 @@
+# ASSETS
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#webpacked
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

assets/img/.directory

@@ -0,0 +1,4 @@
+[Dolphin]
+PreviewsShown=true
+Timestamp=2018,9,4,20,1,55
+Version=4

assets/js/bjorklund.js

@@ -0,0 +1,38 @@
+bjorklund(slots, pulses) {
+    var pattern = [],
+      count = [],
+      remainder = [pulses],
+      divisor = slots - pulses,
+      level = 0,
+      build_pattern = function(lv) {
+        if (lv == -1) {
+          pattern.push(0);
+        } else if (lv == -2) {
+          pattern.push(1);
+        } else {
+          for (var x = 0; x < count[lv]; x++) {
+            build_pattern(lv - 1);
+          }
+
+          if (remainder[lv]) {
+            build_pattern(lv - 2);
+          }
+        }
+      }
+    while (remainder[level] > 1) {
+      count.push(Math.floor(divisor / remainder[level]));
+      remainder.push(divisor % remainder[level]);
+      divisor = remainder[level];
+      level++;
+    }
+    count.push(divisor);
+
+    build_pattern(level);
+
+    return pattern.reverse();
+  },
+  assignEuclidean: function(a, b) {
+    this.euclideanList = this.bjorklund(a, b);
+    console.log(this.euclideanList);
+  }
+}

components/AppLogo.vue

@@ -0,0 +1,80 @@
+<template>
+  <div class="VueToNuxtLogo">
+    <div class="Triangle Triangle--two"/>
+    <div class="Triangle Triangle--one"/>
+    <div class="Triangle Triangle--three"/>
+    <div class="Triangle Triangle--four"/>
+  </div>
+</template>
+
+<style>
+.VueToNuxtLogo {
+  display: inline-block;
+  animation: turn 2s linear forwards 1s;
+  transform: rotateX(180deg);
+  position: relative;
+  overflow: hidden;
+  height: 180px;
+  width: 245px;
+}
+
+.Triangle {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 0;
+}
+
+.Triangle--one {
+  border-left: 105px solid transparent;
+  border-right: 105px solid transparent;
+  border-bottom: 180px solid #41B883;
+}
+
+.Triangle--two {
+  top: 30px;
+  left: 35px;
+  animation: goright 0.5s linear forwards 3.5s;
+  border-left: 87.5px solid transparent;
+  border-right: 87.5px solid transparent;
+  border-bottom: 150px solid #3B8070;
+}
+
+.Triangle--three {
+  top: 60px;
+  left: 35px;
+  animation: goright 0.5s linear forwards 3.5s;
+  border-left: 70px solid transparent;
+  border-right: 70px solid transparent;
+  border-bottom: 120px solid #35495E;
+}
+
+.Triangle--four {
+  top: 120px;
+  left: 70px;
+  animation: godown 0.5s linear forwards 3s;
+  border-left: 35px solid transparent;
+  border-right: 35px solid transparent;
+  border-bottom: 60px solid #fff;
+}
+
+@keyframes turn {
+  100% {
+    transform: rotateX(0deg);
+  }
+}
+
+@keyframes godown {
+  100% {
+    top: 180px;
+  }
+}
+
+@keyframes goright {
+  100% {
+    left: 70px;
+  }
+}
+</style>
+

components/README.md

@@ -0,0 +1,7 @@
+# COMPONENTS
+
+The components directory contains your Vue.js Components.
+Nuxt.js doesn't supercharge these components.
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

components/beat-method.vue

@@ -0,0 +1,40 @@
+<!--
+<template>
+  <div class="beat" v-for="i in divisioni" :key="i">
+    <div class="subdivision" :style="background-color: colore">{{randomColore()}}</div>
+  </div>
+</template>
+
+<script>
+    export default {
+      name: 'beat',
+      data() {
+            colore: "#333333",
+            tono: "332", // mHz
+            durata: "1", // s
+            divisioni: "2e" + random(1,8) / 2
+      },
+      components: {
+      },
+      methods: {
+        randomColore: function(){
+          var generatedColor = "red";
+          this.colore = generatedColor;
+        }
+        },
+    }}
+</script>
+
+<style>
+  .beat{
+    flex: 1 1 auto;
+    width: 100%;
+    height: 100%;
+    border:1pt solid #333333;
+}
+
+.active{
+  background-color:black;
+}
+</style>
+-->

components/beat.vue

@@ -0,0 +1,92 @@
+<template>
+  <div class="beat-wrapper">
+      <input v-model="divisioni" type="number" min="1" oninput="validity.valid||(value='');">
+      <!--- trovare modo per prevenire scrittura di input-->
+      <div class="division-wrapper">
+        <div class="beat" v-for="j in nDivisioni" :key='j'>
+          <div>{{randomColori()}}</div>
+          <div class="suddivisione" :style="{'background-color': colore }"></div>
+        </div>
+    </div>
+<!--    <beatMenu></beatMenu>-->
+  </div>
+</template>
+<script>
+    export default {
+      name: 'beat',
+      data() {
+        return {
+          colore: 'red',
+          divisioni: 1
+        }
+      },
+      computed: {
+        nDivisioni() {
+          var n = parseInt(this.divisioni);
+          return isNaN(n) ? 0 : n;
+        }
+      },
+      methods: {
+        checkDivisioni: function (){
+          console.log("numero dell'input è" + this.nDivisioni)
+        },
+        randomColori: function (){
+            var letters = '0123456789ABCDEF';
+            var color = '#';
+            for (var i = 0; i < 6; i++) {
+              color += letters[Math.floor(Math.random() * 16)];
+            }
+            console.log(color);
+            this.colore = color;
+        }
+    }
+    }
+</script>
+
+<style>
+  .beat{
+    flex: 1 1 auto;
+    width: 100%;
+    height: 100%;
+}
+
+.active{
+  background-color:black;
+}
+
+input {
+  background:transparent;
+  width:100%;
+}
+
+.division-wrapper {
+  flex:1 1 auto;
+  display: flex;
+}
+
+.beat {
+  height:1em;
+  display:flex;
+  flex:1 1 auto;
+}
+
+.suddivisione{
+  flex:1 1 auto;
+  border:none;
+}
+
+input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    margin: 0;
+}
+
+input[type=number] {
+    -moz-appearance:textfield;
+    padding-left:0.2em;
+    color:lightgray;
+    border:none;
+}
+</style>

components/beatMenu.vue

@@ -0,0 +1,26 @@
+<template>
+  <div class="beatMenu" style="width:15em;height:5em;border-radius:0.5em;margin:1em;background:cadetblue">
+    <input style="" id="quanteSuddivisioni" v-model="divisioni" type="number">
+  </div>
+</template>
+
+<script>
+    export default {
+      name: 'beatMenu',
+      data() {
+        return {
+          colore: 'red',
+          divisioni: 1
+        }
+      },
+      methods: {
+        Pluto: function (){
+        },
+        Pippo: function (){
+        }
+    }
+    }
+</script>
+
+<style>
+</style>

components/sequencer.vue

@@ -0,0 +1,164 @@
+<template>
+  <section class="sequencer" v-on:mouseover="displayControls()" v-on:mouseleave="hideControls()" >
+    <div class="sequencerLine">
+      <div class="slot-wrapper">
+        <div class="slot" v-for="i in slotSlider" :key='i' >
+          <beat v-if="euclideanList[i] === 1"></beat>
+          <div v-else class="activeSlot"></div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <div class="control-menu" :class="[{'displayControls': controlIsDisplayed}]">
+        <range-slider class="slider" min="1" :max="maxSlots" step="1" v-model="slotSlider" v-on:input="assignEuclidean(slotSlider, pulseSlider)" ></range-slider>
+        <input id="pulseSlider" v-model="maxSlots" />
+        <range-slider class="slider"  min="1" :max="slotSlider" step="1" v-model="pulseSlider" v-on:input  ="assignEuclidean(slotSlider, pulseSlider)" ></range-slider>
+        <input id="pulseSlider" value="3" v-model="assignBeat" />
+      </div>
+<!---
+        <div style="background-color:firebrick">
+          <input type="range" class="slider" min="1" max="32" step="1" v-model="slotSlider" v-on:change="assignEuclidean(slotSlider, pulseSlider)" />
+          <input type="range" class="slider" min="1" :max="slotSlider" step="1" v-model="pulseSlider" v-on:change="assignEuclidean(slotSlider, pulseSlider)" />
+        </div>
+-->
+    </div>
+  </section>
+</template>
+
+<script>
+    import RangeSlider from 'vue-range-slider'
+    // you probably need to import built-in style
+    import 'vue-range-slider/dist/vue-range-slider.css'
+    import beat from '~/components/beat.vue'
+
+    export default {
+      data() {
+          return{
+            slotSlider: 16,
+            pulseSlider: 3,
+            euclideanList:[],
+            controlIsDisplayed:false
+          }
+      },
+      components: {
+        RangeSlider,
+        beat
+      },
+      methods: {
+        displayControls: function (){
+          this.controlIsDisplayed = true;
+        },
+        hideControls: function (){
+          this.controlIsDisplayed = false;
+        },
+        bjorklund: function (slots, pulses) {
+
+      var pattern = [],
+        count = [],
+        remainder = [pulses],
+        divisor = slots - pulses,
+        level = 0,
+        build_pattern = function(lv) {
+          if (lv == -1) {
+            pattern.push(0);
+          } else if (lv == -2) {
+            pattern.push(1);
+          } else {
+            for (var x = 0; x < count[lv]; x++) {
+              build_pattern(lv - 1);
+            }
+
+            if (remainder[lv]) {
+              build_pattern(lv - 2);
+            }
+          }
+        }
+      while (remainder[level] > 1) {
+        count.push(Math.floor(divisor / remainder[level]));
+        remainder.push(divisor % remainder[level]);
+        divisor = remainder[level];
+        level++;
+      }
+      count.push(divisor);
+
+      build_pattern(level);
+
+      return pattern.reverse();},
+      assignEuclidean: function (a,b) {
+        this.euclideanList = this.bjorklund(a,b);
+        console.log(this.euclideanList);
+      }
+      }
+    }
+</script>
+
+<style>
+.container {
+  min-height: 100vh;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+.title {
+  font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* 1 */
+  display: block;
+  font-weight: 300;
+  font-size: 100px;
+  color: #35495e;
+  letter-spacing: 1px;
+}
+
+.subtitle {
+  font-weight: 300;
+  font-size: 42px;
+  color: #526488;
+  word-spacing: 5px;
+  padding-bottom: 15px;
+}
+
+.links {
+  padding-top: 15px;
+}
+
+.active{
+  background-color:black;
+  width:100%;
+  height:40%
+}
+
+.control-menu{
+  display: none;
+}
+
+.slider{
+  width:30%;
+}
+
+.displayControls{
+  display:flex !important;
+}
+
+.slot-wrapper{
+  display:flex;
+  height:3em;
+  width:auto;
+  background-color:firebrick;
+}
+
+.slot{
+  flex:1 1 auto;
+  background-color:beige;
+  border-left:1pt solid aquamarine;
+  border-right:1pt solid aquamarine;
+  border-top: transparent !important;
+  border-bottom: transparent !important;
+}
+
+.activeSlot{
+  flex:1 1 auto;
+  display: flex;
+  flex-direction: column;
+}
+</style>

components/sequencerDivided.vue

@@ -0,0 +1,156 @@
+<template>
+  <section class="sequencer" v-on:mouseover="displayControls()" v-on:mouseleave="hideControls()" >
+    <div class="sequencerLine">
+      <div class="slot-wrapper">
+        <div class="slot" v-for="i in slotSlider" :key='i' >
+          <beat />
+        </div>
+      </div>
+    </div>
+    <div>
+      <div class="control-menu" :class="[{'displayControls': controlIsDisplayed}]">
+        <range-slider class="slider" min="1" :max="maxSlots" step="1" v-model="slotSlider" v-on:input="assignEuclidean(slotSlider, pulseSlider)" ></range-slider>
+        <input id="pulseSlider" v-model="maxSlots" />
+        <range-slider class="slider"  min="1" :max="slotSlider" step="1" v-model="pulseSlider" v-on:input  ="assignEuclidean(slotSlider, pulseSlider)" ></range-slider>
+        <input id="pulseSlider" value="3" v-model="assignBeat" />
+      </div>
+<!---
+        <div style="background-color:firebrick">
+          <input type="range" class="slider" min="1" max="32" step="1" v-model="slotSlider" v-on:change="assignEuclidean(slotSlider, pulseSlider)" />
+          <input type="range" class="slider" min="1" :max="slotSlider" step="1" v-model="pulseSlider" v-on:change="assignEuclidean(slotSlider, pulseSlider)" />
+        </div>
+-->
+    </div>
+  </section>
+</template>
+
+<script>
+    import RangeSlider from 'vue-range-slider'
+    // you probably need to import built-in style
+    import 'vue-range-slider/dist/vue-range-slider.css'
+    import beat from '~/components/beat.vue'
+
+    export default {
+      name: 'sequencerDivided',
+      data() {
+          return{
+            slotSlider: 16,
+            pulseSlider: 3,
+            euclideanList:[],
+            controlIsDisplayed:false
+          }
+      },
+      components: {
+        RangeSlider,
+        beat
+      },
+      methods: {
+        displayControls: function (){
+          this.controlIsDisplayed = true;
+        },
+        hideControls: function (){
+          this.controlIsDisplayed = false;
+        },
+        bjorklund: function (slots, pulses) {
+
+      var pattern = [],
+        count = [],
+        remainder = [pulses],
+        divisor = slots - pulses,
+        level = 0,
+        build_pattern = function(lv) {
+          if (lv == -1) {
+            pattern.push(0);
+          } else if (lv == -2) {
+            pattern.push(1);
+          } else {
+            for (var x = 0; x < count[lv]; x++) {
+              build_pattern(lv - 1);
+            }
+
+            if (remainder[lv]) {
+              build_pattern(lv - 2);
+            }
+          }
+        }
+      while (remainder[level] > 1) {
+        count.push(Math.floor(divisor / remainder[level]));
+        remainder.push(divisor % remainder[level]);
+        divisor = remainder[level];
+        level++;
+      }
+      count.push(divisor);
+
+      build_pattern(level);
+
+      return pattern.reverse();},
+      assignEuclidean: function (a,b) {
+        this.euclideanList = this.bjorklund(a,b);
+        console.log(this.euclideanList);
+      }
+      }
+    }
+</script>
+
+<style>
+.container {
+  min-height: 100vh;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+.title {
+  font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* 1 */
+  display: block;
+  font-weight: 300;
+  font-size: 100px;
+  color: #35495e;
+  letter-spacing: 1px;
+}
+
+.subtitle {
+  font-weight: 300;
+  font-size: 42px;
+  color: #526488;
+  word-spacing: 5px;
+  padding-bottom: 15px;
+}
+
+.links {
+  padding-top: 15px;
+}
+
+.active{
+  background-color:black;
+  width:100%;
+  height:40%
+}
+
+.control-menu{
+  display: none;
+}
+
+.displayControls{
+  display:block;
+}
+
+.slot-wrapper{
+  display:flex;
+  height:3em;
+  width:auto;
+  background-color:firebrick;
+}
+.slot{
+  flex:1 1 auto;
+  background-color:beige;
+  border:1pt solid aquamarine;
+}
+
+beat{
+  display:flex;
+  flex-direction:column;
+  flex:1 1 auto;
+}
+</style>

layouts/README.md

@@ -0,0 +1,9 @@
+# LAYOUTS
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/views#layouts
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

layouts/default.vue

@@ -0,0 +1,53 @@
+<template>
+  <div>
+    <nuxt/>
+  </div>
+</template>
+
+<style>
+html {
+  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-size: 16px;
+  word-spacing: 1px;
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  box-sizing: border-box;
+}
+
+*, *:before, *:after {
+  box-sizing: border-box;
+  margin: 0;
+}
+
+.button--green {
+  display: inline-block;
+  border-radius: 4px;
+  border: 1px solid #3b8070;
+  color: #3b8070;
+  text-decoration: none;
+  padding: 10px 30px;
+}
+
+.button--green:hover {
+  color: #fff;
+  background-color: #3b8070;
+}
+
+.button--grey {
+  display: inline-block;
+  border-radius: 4px;
+  border: 1px solid #35495e;
+  color: #35495e;
+  text-decoration: none;
+  padding: 10px 30px;
+  margin-left: 15px;
+}
+
+.button--grey:hover {
+  color: #fff;
+  background-color: #35495e;
+}
+</style>
+

middleware/README.md

@@ -0,0 +1,10 @@
+# MIDDLEWARE
+
+This directory contains your Application Middleware.
+The middleware lets you define custom function to be ran before rendering a page or a group of pages (layouts).
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing#middleware
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

nuxt.config.js

@@ -0,0 +1,39 @@
+module.exports = {
+  /*
+  ** Headers of the page
+  */
+  head: {
+    title: 'nuxtgety-2',
+    meta: [
+      { charset: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      { hid: 'description', name: 'description', content: 'Second attempt at building a web interface for ESP8266' }
+    ],
+    link: [
+      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
+    ]
+  },
+  /*
+  ** Customize the progress bar color
+  */
+  loading: { color: '#3B8070' },
+  /*
+  ** Build configuration
+  */
+  build: {
+    /*
+    ** Run ESLint on save
+    */
+    extend (config, { isDev, isClient }) {
+      if (isDev && isClient) {
+        config.module.rules.push({
+          enforce: 'pre',
+          test: /\.(js|vue)$/,
+          loader: 'eslint-loader',
+          exclude: /(node_modules)/
+        })
+      }
+    }
+  }
+}
+

package.json

@@ -0,0 +1,28 @@
+{
+  "name": "nuxtgety-2",
+  "version": "1.0.0",
+  "description": "Second attempt at building a web interface for ESP8266",
+  "author": "Fabio Bernardi",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "generate": "nuxt generate",
+    "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
+    "precommit": "npm run lint"
+  },
+  "dependencies": {
+    "nuxt": "^1.0.0",
+    "vue-material": "^1.0.0-beta-10.2",
+    "vue-range-slider": "^0.6.0"
+  },
+  "devDependencies": {
+    "babel-eslint": "^8.2.1",
+    "eslint": "^4.15.0",
+    "eslint-friendly-formatter": "^3.0.0",
+    "eslint-loader": "^1.7.1",
+    "eslint-plugin-vue": "^4.0.0",
+    "vue-input-number": "^0.1.5"
+  }
+}

pages/README.md

@@ -0,0 +1,8 @@
+# PAGES
+
+This directory contains your Application Views and Routes.
+The framework reads all the .vue files inside this directory and creates the router of your application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing
+

pages/index.vue

@@ -0,0 +1,57 @@
+<template>
+  <div id="app">
+  <h2 class="subtitle">
+    Second attempt at building a web interface for ESP8266
+  </h2>
+    <sequencer></sequencer>
+    <sequencer></sequencer>
+    <sequencer></sequencer>
+    <sequencer></sequencer>
+    <div class="icon-wrapper">
+      <div class="icon-button">
+        <img style="margin:auto;" src="~/assets/img/barrier.png">
+      </div>
+      <div class="icon-button">
+        <img style="margin:auto;" src="~/assets/img/pixel.png">
+      </div>
+      <div class="icon-button">
+        <img style="margin:auto;" src="~/assets/img/squares.png">
+      </div>
+      <div class="icon-button">
+        <img style="margin:auto;" src="~/assets/img/bell.png">
+      </div>
+      <div class="icon-button">
+        <img style="margin:auto;" src="~/assets/img/add.png">
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import sequencer from '~/components/sequencer.vue'
+import sequencerDivided from '~/components/sequencerDivided.vue'
+import beatMenu from '~/components/beatMenu.vue'
+
+export default {
+  components: {
+    sequencer,
+    sequencerDivided,
+    beatMenu
+  }
+}
+</script>
+
+<style>
+.icon-button{
+  display:flex;
+  background-color:red;
+  width:3em;
+  height:3em;
+  border-radius:3em;
+  margin:0.2em;
+}
+
+.icon-wrapper{
+  display:flex;
+}
+</style>

plugins/README.md

@@ -0,0 +1,9 @@
+# PLUGINS
+
+This directory contains your Javascript plugins that you want to run before instantiating the root vue.js application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/plugins
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

static/README.md

@@ -0,0 +1,12 @@
+# STATIC
+
+This directory contains your static files.
+Each file inside this directory is mapped to /.
+
+Example: /static/robots.txt is mapped as /robots.txt.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#static
+
+**This directory is not required, you can delete it if you don't want to use it.**
+

store/README.md

@@ -0,0 +1,11 @@
+# STORE
+
+This directory contains your Vuex Store files.
+Vuex Store option is implemented in the Nuxt.js framework.
+Creating a index.js file in this directory activate the option in the framework automatically.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/vuex-store
+
+**This directory is not required, you can delete it if you don't want to use it.**
+