SHARE
TWEET

Untitled




Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
- import React, { Component } from 'react';
- export default class App extends Component {
- constructor(props) {
- super(props);
- this.state = { shows: [], };
- }
- componentDidMount() {
- fetch('https://api.infinum.academy/api/shows')
- .then((data) => data.json())
- .then((response) => {
- let shows = response.data.map((show) => {
- return (
- <div key={show._id}>
- <h3>{show.title}</h3>
- <br />
- <h6>Description :</h6>
- <p>{this.showDetails(show._id)}</p>
- <h6>Episodes :</h6>
- {this.showEpisodes(show._id)}
- </div>
- )
- })
- this.setState({ shows: shows });
- })
- }
- showDetails(showId) {
- fetch(`https://api.infinum.academy/api/shows/${showId}`)
- .then((data) => data.json())
- .then((response) => {
- return (
- response.data.description
- )
- })
- }
- showEpisodes(showId) {
- fetch(`https://api.infinum.academy/api/shows/${showId}/episodes`)
- .then((data) => data.json())
- .then((response) => {
- return (
- <p>{response.data}</p>
- )
- })
- }
- render() {
- console.log(this.state.shows);
- return (
- <div className="container">
- <h1 id='title'>
- TV shows!
- </h1>
- <div className='showsContainer'>
- {this.state.shows}
- </div>
- </div>
- );
- }
- }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.