-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

devos
  • 13
  • 4
  • 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 – M.G.S SUPUNTHAKA May 29 '23 at 09: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 – devos May 29 '23 at 10:04
  • Also I have fileUpload on backend, can I use express fileUpload in api/ routes? – devos May 29 '23 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. – M.G.S SUPUNTHAKA May 29 '23 at 10:11
  • @M.G.SSUPUNTHAKA can I use express fileUpload in api/ routes? – devos May 29 '23 at 10:15
  • Regarding the file upload I'm assuming you're mentioning this NPM package [express-fileupload](https://www.npmjs.com/package/express-fileupload), I'm not sure it'll work because it was designed for ExpressJs. – M.G.S SUPUNTHAKA May 29 '23 at 10:18

1 Answers1

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.

  • 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. – devos May 29 '23 at 12:39
  • 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. – devos May 29 '23 at 12:41
  • If the answer was able to resolved your issue, be sure to mark the answer as accepted, thanks – M.G.S SUPUNTHAKA May 29 '23 at 12:52