I selected '.next' folder as the public folder and gave firebase deploy command. The deployment was completed successfully however my website is not being shown. What could be the reason? How should I deploy Next Js application to Firebase Hosting?
As far as i know Firebase hosting is for static sites. If you use SSR its not possible (or very hard) to deploy Nextjs app.
If you only use SSG from next and get build with command "next export" that is should be easy to deploy this build folder which should be called 'out'.
more info here https://nextjs.org/docs/advanced-features/static-html-export
Related
enter image description here
I want to host my app on firebase.
I followed these steps.
npm run build and it created build folder
firebase init, select hosting,
What do you want to use as your public directory? build
Configure as a single-page app (rewrite all URLs to /index.html)?
Yes
File build/index.html already exists. Overwrite? No
and then finally firebase deploy
after some time I see files uploaded successfully and in the firebase hosting dashboard it shows files uploaded something like 727. but the app looks something like a welcome message "Welcome Firebase Hosting Setup Complete. You're seeing this because you've successfully set up Firebase Hosting. Now it's time to go build something extraordinary!"
however, if I create a react app using create-react-app, and follow the same steps, it's working fine at the same URL and host. it displays the app at once without a problem.
my firebase.json
Firsty once you deploy it try viewing it on incognito mode as sometimes due to the cache it renders the same page
now still if you have errors follow this steps given in the link I followed this and got mine online
https://www.youtube.com/watch?v=IDHfvpsYShs&t=337s
So I have a reactjs app publish in github pages, is this one https://bernardoolisan.github.io/PyOcr/
The problem is that the app fetch data, but when I deploy it on github pages it give this error:
And it was working:(
And now my page doesn't work too, it was working but right now is blank i dont know why
I guess you are deploying the react project the wrong way to hosting providers such as github or netlify . First you must build your react project and then only push the files inside the build folder to hosting provider . Github pages can only serve static html css js files so it can only serve the build folder of your react project .
Note
To build a react app you can run npm run build and a build folder will be generated . Then you can push the files inside of the build folder to github repository and enable github pages for it .
I was having a similar issue, and I too though gh-pages can't fetch data. But what I did was I added cors to my server. I allowed cross-origin requests. Now it retrieves data from my server on heroku.
I want to Deploy my react site to the regular server without build command
without Netlify or DigitalOcean, Heroku, GitHub Pages, aws
Is there a way to run modular bundlers like Webpack on Host?
actually what Netlify or DigitalOcean, Heroku, GitHub Pages, aws doing for show webpage without npm run build command?
I have a frontend create-react-app and a backend API using Expressjs.
I deployed the backend API to Google App Engine successfully.
But now I need to deploy the create-react-app to Google Cloud and it becomes very confusing, I tried to google for a while and there is no true/recommended way for this.
At least I saw that other people suggested doing it in 2 ways:
Using Google Cloud Storage:
Run "npm run build" to create the "build" folder
Upload this whole folder onto a bucket
=> I see that there is one drawback using this way: When I tried to reload page 'url/aboutUs', it's not found. So I have to go back to 'url' then click the About Us link
=> I guess that the React Router that I'm using is not working with Google Cloud Storage
Using Google App Engine
=> People just talked about using it, but I can't find any guide/tutorial for this.
So what is the recommended way to deploy create-react-app to Google Cloud?
And can you please provide a tutorial for that?
Thanks.
You just need to configure the Cloud Storage bucket to serve index.html as the 404 page.
For Google App Engine, you can use serve or set up nginx to serve index.html in the build folder.
Generic: What kind of services must a hosting vendor provide in order to make it possible to have a React app hosted?
More Specific: If I create a website with React and React Router, is it possible to deploy it by just uploading the bundled output folder? This could be for example a dist folder containing index.html, bundle.js and an images folder.
Could this be as simple as deploying a simple web page (like one built with plain HTML, CSS and JS)?
Sure just do: npm run build
and you will have a folder with the static files. Upload those with your choice of file transfer method and set the permissions to the web host appropriately.
100% Working Example.
React App Hosting in Firebase .
You can read this blog
Host Your React Web App in few minutes.
Command runnning in Wrong sequence =>
firebase login
firbase init
firebase deploy
npm run build
Command runnning in Correct sequence =>
firebase login
firbase init
npm run build
firebase deploy