Assuming that you’ve not set up anything.

Step 1: Installing Axios

npm install axios

Step 2: Importing and sending request

1
2
3
4
5
6
7
import axios from 'axios'
axios
  .get('http://localhost:3001/notes')
  .then(response => {
    const notes = response.data
    console.log(notes)
  })

For most part, that will suffice. However, you might want to call the data via an effect hook.

Step 3: Calling request with an effect hook:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
import React, { useState, useEffect } from 'react'

const [streams, setStreams] = useState([])

useEffect(() => {
  axios.get('http://localhost:3001/notes')
    .then(response => {
      setStreams(response.data)
    })
}, [])

This will set the streams variable up.

Final Step: Installing CORS

Without CORs, you will not be able to make that request.

  1. Within the backend repo, install cors. npm install cors
  2. then within the backend index.js, require cors: const cors = require('cors') app.use(cors())