ReactJS Services

  services are just ordinary classes which will contain functions of your own choice, so call them how you like.

You would have a lot of functions, bigger and more complex of course, but would you keep it in one file? No.
So you would have Service1.js, Service2.js …. ServiceN.js and then all of those would be connected inside this Index.js and you’d single export but with access to a lot of code inside services.

create a folder services inside that one file index.js:

import axios from "axios";

const getposts=()=>{

    return axios.get(`https://jsonplaceholder.typicode.com/posts`);

   

   };

   const getEmployees=()=>{

    return axios.get(`http://dummy.restapiexample.com/api/v1/employees`);

   

   };

export  default getposts;

export {getEmployees}

// const A="hello sir ji kya hal";

// export default A;

And then create a component named as Data_fetch.js

import React,{useState,useEffect

   } from 'react'

import getPosts,{getEmployees} from '../Services/index'

export default function Data_fetch() {

    const [post, getPost] = useState([])

    const [Employee, getEmployee] = useState([])

    useEffect(() => {

     data()

   //  data1()

    }, []);

    const data=()=>{

        getPosts().then((res)=>

    getPost(res.data));

    console.log(post);

    }

    const data1=()=>{

        getEmployees().then((res)=>

        console.log(res.data));

    //getEmployee(res.data));

   

    }

    return (

        <div>

           {/* {post.map((e,index)=><li key={index}>

               {e.id}{e.title}

           </li>) 

} */}

        </div>

    )

}

and then include this component inside

App.js