#05

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "axios": "^0.19.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "react-scripts": "^2.1.3"

src/App.js

@@ -1,48 +1,31 @@
 import React, { Component } from 'react';
+import axios from 'axios';
 import './App.css';
 
-class MyButton extends Component {
-  render() {
-    return (
-      <button
-        onClick={() => { this.props.handleClick(this.props.label); }}
-      >
-        {this.props.label}
-      </button>
-    );
-  }
-}
-
-class MyLabel extends Component {
-  render() {
-    return <p>Cliquei no: {this.props.text}</p>
-  }
-}
-
-
 class App extends Component {
   constructor(props) {
     super(props);
-
+    
     this.state = {
-      labelText: '',
-    };
-
-    this.setLabelText = this.setLabelText.bind(this);
+      data: []
+    }
   }
 
-  setLabelText(labelText) {
-    this.setState({ labelText });
+  componentDidMount() {
+    axios.get('https://api.github.com/repositories')
+      .then(({ data }) => {
+        this.setState({ data })
+      })
   }
 
   render() {
+    const { data } = this.state
+
     return (
       <div className="App">
-        <MyLabel text={this.state.labelText} />
-        <MyButton handleClick={this.setLabelText} label="Botão 1" />
-        <MyButton handleClick={this.setLabelText} label="Botão 2" />
-        <MyButton handleClick={this.setLabelText} label="Botão 3" />
-        <MyButton handleClick={this.setLabelText} label="Botão 4" />
+        <ul>
+          {data.map(item => <li key={item.id}>{item.full_name}</li>)}
+        </ul>
       </div>
     );
   }