React/axios

yarn add axios
    

import axios from "axios";

export default axios.create({
    baseURL: 'https://jsonplaceholder.typicode.com'
});

    

import React from "react";

const Button = ({onClick, color, text}) => {
    return(
        button onClick={onClick} className={${color}}>
            {text}
        /button
    )
}

export default Button;

    

import React from "react";

const Resources = ({resources}) => {
    return(
        <>
            {resources.map((resource)=>{
                p key{resource.id}>{resource.title}/p>
            })}
        
    )
}

export default Resources;

    

import React from "react";
import place from "./apis/place";
import Button from "./components/Button";
import Resources from "./components/Resources";

const App = ({}) => {
    const [resources, serResources] = setState([]);
    const getPosts = async() => {
        try {
            const posts = await place.get('/posts');
            setResources(posts.data);
        }catch(err){
            console.log(err);
        }
    }
    const getAlbums = async() => {
        try {
            const albums = await place.get('/albums');
            setResources(albums.data);
        }catch(err){
            console.log(err);
        }
    }

    return(
        <>
            Button onClick={getPosts} color={'primary'} text={`posts`} />
            Button onClick={getAlbums} color={'primary'} text={`albums`} />
            Resources resources={resources} />
        
    )
}

export default Resources;