TL;RD
Los datos agregados después de construir el proyecto no se muestran en ninguna parte. Está en la base de datos pero no se muestra en el sitio.
Así que hice un sitio para reuniones mientras usaba firebase como base de datos. Todo funciona correctamente en el modo de desarrollo. Incluso cuando construyo mi proyecto y lo exporto usando next build && next export y luego lo ejecuto usando next start , funciona completamente bien. Pero cuando ejecuto el firebase deploy --only hosting , todos los datos nuevos que agregué mientras ejecutaba el proyecto localmente no están allí. Sin embargo, está presente en la base de datos.
Lo que quiero preguntar es si Firebase no es compatible con SSG.
Investigué un poco y descubrí que la implementación en Vercel funciona perfectamente.
A continuación se muestra mi código para el archivo index.js
function HomePage(props) { console.log("Number of meetups: " + props.meetups.length); return ( <Fragment> <Head> <title>Next Js Meetups</title> <meta name="Description" content="Browse a huge list of Meetups" /> </Head> <MeetupList meetups={props.meetups}></MeetupList> </Fragment> ); } export async function getStaticProps() { // Fetch data from API console.log("Getting data in getStaticProps"); var list = await GetAllMeetups(); return { props: { meetups: list, }, revalidate: 5, }; } export default HomePage;Por favor, avíseme si me estoy perdiendo algo.
Esto se debe a que getStaticProps obtiene datos solo cuando ejecuta next build && next export . No recupera cada vez que se carga la página, solo durante el tiempo de compilación. El inconveniente de SSG es que una vez que los datos cambian, debe reconstruir y volver a implementar su proyecto.
Si desea que se actualice cada vez, use SSR y getServerSideProps , pero no podrá implementarlo en Firebase ya que solo es compatible con SSG. Para la implementación de una aplicación Next.js de renderizado del lado del servidor, personalmente puedo recomendar Netlify.