diff --git a/16_React_Router/15_react_router_boilerplate/src/index.js b/16_React_Router/15_react_router_boilerplate/src/index.js deleted file mode 100644 index 156b157..0000000 --- a/16_React_Router/15_react_router_boilerplate/src/index.js +++ /dev/null @@ -1,137 +0,0 @@ -import React, { Component } from 'react' -import axios from '../../../17_React_Router/17_react_router_boilerplate/src/node_modules/axios' -import ReactDOM from 'react-dom' -import moment from '../../../17_React_Router/17_react_router_boilerplate/src/node_modules/moment' -import styled from 'styled-components' -import { - TiSocialLinkedinCircular, - TiSocialGithubCircular, - TiSocialTwitterCircular, -} from '../../../17_React_Router/17_react_router_boilerplate/src/node_modules/react-icons/ti' - -const Title = styled.h1` - font-size: 70px; - font-weight: 300; -` -const SubTitle = styled.h2` - font-weight: 300; -` - -const Header = styled.header` - background-color: #61dbfb; - padding: 25; - padding: 10px; - margin: 0; -` - -class App extends Component { - constructor(props) { - super(props) - console.log('I am the constructor and I will be the first to run.') - this.state = { - firstName: 'John', - data: [], - day: 1, - congratulate: '', - } - } - - componentDidMount() { - const API_URL = 'https://restcountries.eu/rest/v2/all' - axios - .get(API_URL) - .then((response) => { - this.setState({ - data: response.data, - }) - }) - .catch((error) => { - console.log(error) - }) - - } - static getDerivedStateFromProps(props, state) { - return { firstName: props.firstName } - } - shouldComponentUpdate(nextProps, nextState) { - console.log(nextProps, nextState) - console.log(nextState.day) - if (nextState.day > 31) { - return false - } else { - return true - } - } - - doChallenge = () => { - this.setState({ - day: this.state.day + 1, - }) - } - renderCountries = () => { - return this.state.data.map((country) => { - const languageOrLanguages = - country.languages.length > 1 ? 'Langauges' : 'Language' - const formatLanguages = country.languages - .map(({ name }) => name) - .join(', ') - return ( -
Capital: {country.capital}
-- {languageOrLanguages}: {formatLanguages} -
-Population: {country.population}
-Instructor: Asabeneh Yetayey
- Oct 15, 2020 -This challenge was started {moment('2020-10-01').fromNow()}
-The challenge will be over in {moment('2020-10-30').fromNow()}
-Today is {moment(new Date()).format('MMMM DD, YYYY HH:mm')}
-Challenge: Day {this.state.day}
- {this.state.congratulate &&There are {this.state.data.length} countries in the api
-