Lifecycle  Hooks

Mount

Update

Unmount

constructor

render

componentDidMount

render

componentDidUpdate

componentWillUnmount

Try it here

Fetch

"Imagine you are a kid. Your mom promises you that she'll get you a new phone next week."

const getPokemon = () => {
    startLoadingAnimation();
    return fetch(`https://pokeapi.co/api/v2/pokemon/1/`)
        .then(res => res.json())
        .then(data => data.name)
        .catch(err => `Error while fetching pokemon name : ${err}`)
        .finally(stopLoadingAnimation());

}
const getPokemon = async () => {
    try {
        startLoadingAnimation();
        const res = await fetch(`https://pokeapi.co/api/v2/pokemon/1/`);
        const data = await res.json();
        return data.name;
    } catch (err) {
        return `Error while fetching pokemon name : ${err}`;
    } finally {
        stopLoadingAnimation();
    }
}

Lab

By Issam Hammi

Lab

ECA React - December 12th 2018

  • 559