How can I combine axios, swr and header config in the code below?

Question

in windows 10 , i'm using react-router-dom 5.2.0 and react-redux 7.2.5 and react 17.0.2 and axios 0.21.4 and WebStorm 2023.1.3 IDE and PyCharm Community Edition 2023.2 and djangorestframework==3.14.0 and Django==4.2.4 and djangorestframework-simplejwt==5.3.0.

Note: How can I combine swr with axios and its header config in the code below in the post method request through an api to the Django backend?

Consider:

 const config = {
                    header: { 
                        'Content-type': 'application/json',
                    }
                }
 const {data} = await axios.post('http://127.0.0.1:8000/api/v1/users/register/', {'name':name,'family':family,'email':email,'password':password,config);

Note : Please help me to implement a plan in the answer, considering that the plan is like this

Consider:

const { data, error, isLoading } = useSWR('/api/user/123', fetcher)

link for help : enter link description here

Please help me with your ideas, I hope I don't make a typo... because I really didn't find a correct answer in the forums that would make me unnecessary.

Answer 1

Kind of like this:

  const axiosInstance = axios.create({
     headers: {
        'Content-type': 'application/json',
     }
   })

  const fetcher = url => axios.get(url).then(res => res.data)

  const { data, error } = useSWR('/api/data', fetcher)