Restapi is not running on my react app

See more:

Javascript

Typescript

Hi Team

I am getting this exception when inspecting, i am using rest URL that has data, some how when try to fetch and get a request and getting this following error from the browser.

Quote:

localhost/:1

Access to fetch at 'https://fe-assignment.vaimo.net/posts' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
fe-assignment.vaimo.net/posts:1









Failed to load resource: net::ERR_FAILED

What I have tried:

<pre>import React, { useState, useEffect } from 'react'
export default function Posts() {
  const [post, getPosts] = useState([])
  const API = 'https://fe-assignment.vaimo.net/posts';
  const fetchPost = () => {
    fetch(API)
      .then((res) => res.json())
      .then((res) => {
        console.log(res)
        getPosts(res)
      })
  }
  useEffect(() => {
    fetchPost()
  }, [])
  return (
    <>
      <h2>React Fetch Data with REST API Example</h2>
      <ul>
        {post.map((item, i) => {
          return <li key={i}>{item.name}</li>
        })}
      </ul>
    </>
  )
}

import React from 'react'
import Posts from './components/Posts'
function App() {
  return (
    <div className="container">
      <Posts />
    </div>
  )
}
export default App;