Vue

by antixrist

HTML

<div id="app">
  <div v-for="group in groups"
       class="group"
  >
    <h3 class="group__name">{{ group.name }}</h3>
    <div class="group__summary-ru">{{ group.summary_ru }}</div>
    <div class="group__summary">{{ group.summary }}</div>
    
    .group__comm
  </div>
</div>

SCSS

$f-mono-oxygen-en: 'https://fonts.google.com/specimen/Oxygen+Mono';

.group {
  & + & { margin: 20px 0 0; }
  
  &__name {
    font-size: 
  }
  
  &__summary-ru {
    
  }
  &__summary {
    
  }
}

Vue

new Vue({
  el: "#app",
  data: {
    groups: [],
  },
  async mounted() {
  	const dataUrl = 'https://gist.githubusercontent.com/antixrist/2adba38ab572488e1b4081bcd7fd4047/raw/05983f34aeddae0408e7f33f78830f49707fd026/commands-docs.json';
  	
    this.groups = await fetch(dataUrl).then(res => res.json());
    
    console.log(this.groups);
  },
})