import './css/App.css'; import 'bootstrap/dist/css/bootstrap.min.css'; import { useEffect, useState } from 'react'; import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import { Aboutpage, data, Home, BackToTopButton, Partenariat, Navigationbar, Footer, Newspage } from './components/Common' function App() { const [landingPageData, setLandingPageData] = useState({}); useEffect(() => { setLandingPageData(data); }, []); return ( <div className="App"> <Router> <Navigationbar data={landingPageData.navbar} /> <Routes > <Route exact path='/' element={<Home />} /> <Route path='/Partenariat' element={<Partenariat />} /> <Route path='/Aboutpage' element={<Aboutpage />} /> {data ? data.news.map((d, i) => ( <Route key={i} path={d.path} element={<Newspage img={d.image} title={d.title} subtitle={d.subtitle} fullarticle={d.fullarticle} date={d.date} author={d.author} />} /> )) : "loading..."} </Routes> <Footer /> <BackToTopButton /> </Router> </div> ); } export default App;

La idea era extraer cualquier artículo nuevo del objeto JS y asignar cada uno a su propia página.

Esto funciona bien localmente, pero cuando se implementa para netlizar, las páginas extraídas del objeto javascript son inaccesibles . Todos los demás parecen tener un problema con la página de inicio. Agradecería mucho cualquier ayuda con esto