JSFiddle - React, Tailwind, and code Playground

by Alexi Taylor

HTML

<script src="https://unpkg.com/[email protected]/dist/axios.min.js"></script>
<div id="app">
  <div v-for="project in repos">
    <h4>{{project.name}} | {{project.language}}</h4>
  </div>
</div>

JavaScript

const vm = new Vue({
  el: '#app',
  data: {
      msg: 'Github Repos',
      ok: 'Im practically giving away these repos',
      repos: [],
  },
  created() {
    axios.get('https://api.github.com/orgs/octokit/repos', {
      params: {
        type: 'all',
      },
    })
    .then((res) => {
      console.log('Success Response', res.data);
      res.data.forEach((repo) => {
        this.repos.push({ name: repo.name, url: repo.html_url, language: repo.language });
      });
    })
    .catch((err) => {
      console.log('Error', err);
    });
  },
});