-2

Since this is the first private project that I have done in Next.js I am wondering how do I host it with backend and database.

All tutorials are about next.js alone, I am not sure what should I use in case to be able to publish full stack app.

Do I need something in main folder to be able to publish the web site? Since I need to change next.js not to run on localhost.

I was thinking about using a2 hosting with cpanel. Also I can also use heroku and register my own domain, but how do I add backend and database

File structure

6
  • I'm sorry but I don't get your question. If you would like to have a backend, nextjs comes with an /api endpoint where you can initialize your server side backend section. but If you would like to have a seperate backend It would be better to initiate a seperate backend api and call it through the frontend Commented May 29, 2023 at 9:46
  • I guess I can separate my routes from backend and add a file for every route? Will it work exactly the same way (I am not experienced with next.js)? Without having backend file I could publish just the frontend file and add database in cPanel Commented May 29, 2023 at 10:04
  • Also I have fileUpload on backend, can I use express fileUpload in api/ routes? Commented May 29, 2023 at 10:10
  • yes, the files inside the api folder stands for different endpoints, you can define diferent logics relevent for the routes in them. Commented May 29, 2023 at 10:11
  • @M.G.SSUPUNTHAKA can I use express fileUpload in api/ routes? Commented May 29, 2023 at 10:15

1 Answer 1

1

If you would like to have a backend, NextJs comes with an /api endpoint where you can initialize your server side backend section. but If you would like to have a seperate backend It would be better to initiate a seperate backend api and call it through the frontend. NextJs comes with api folder where you can define different routes for your different endpoints. Regarding file uploads The mentioned NPM Package Will not work Because It's Designed to work with ExpressJs. You can Implement file Upload by Sending Request from FrontEnd as a FormData object.in the backend the automatic bodyParser to false by defining an object as below

export const config: PageConfig = {
    api: {
        bodyParser: false,
    },
};

you can use a library like formidable to process the incoming Request. Follow this Guide for more information.

Sign up to request clarification or add additional context in comments.

3 Comments

I am currently working on changing all routes from backend into api folder. Instead of storing files I now store strings so I do not need file upload. It seems that everythink is working now.
I only have 1 problem and that is when I insert data into database from api I dont see any changes into db table but I see changes on the page which reads all the data from that table. It seems strange because it does insert the data. I will open a question about this a bit later.
If the answer was able to resolved your issue, be sure to mark the answer as accepted, thanks

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.