Embrace the flexibility of using Next.js with or without Express.js

Recently, I started the process of migrating a project from create-react-app to next.js. However, I am facing uncertainty when it comes to migrating the backend of the project.

Currently, my backend is built with an express server. In next.js, there are performance advantages offered by using serverless functions in the api folder. So, my main question is whether I should migrate the express server to serverless functions or stick with it and integrate it with next.js. Additionally, I'm unsure if using express within a serverless function is a good practice.

I've gone through several tutorials on next.js, and many of them utilize express even though it's not recommended in the official documentation. This leaves me wondering if there are any overlooked benefits to using express with next.js.

[EDIT]: The backend primarily includes routes for interacting with the database, as well as file uploads, all secured with JWT authentication middleware.

javascriptexpressnext.jsserverless

Answer №1

I prefer not to utilize express.js. This decision is based on the performance advantages it offers, as well as the additional layer of debugging and maintenance it introduces.

Nevertheless, certain situations may necessitate relying on express:

  1. Some plugins, particularly older ones, are dependent on it. For instance, up until recently, the next-18next plugin required express.js for multi-language support. This explains why some tutorials and examples still mention express if they incorporate such a plugin. Fortunately, the next-i18next team recently updated the plugin to eliminate this dependency, allowing users to use it without needing express. It will take time for other plugins to make similar changes, so tutorials and documentation may lag behind.
  2. Depending on your hosting configuration, you might require express.js for handling asset caching. If you're using Vercel for hosting your next.js apps, which is tailored for this purpose, managing caching in their console eliminates the need for an express server, making it a more preferable option in my opinion.

To sum up, unless you are hosting on Vercel or do not require asset caching, and are not using any plugins that rely on express.js, setting up express would be unnecessary and inefficient.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

AngularJS is throwing an error because the current.$$route object is not defined

Having worked with AngularJS, I encountered an error when trying to set a title. Here is my App.js 'use strict'; var serviceBase = 'http://www.yiiangular.dev/' var spaApp = angular.module('spaApp', [ 'ngRoute' ...

javascriptangularjs

Creating dynamic image carousels using the latest versions of Bootstrap and AngularJS

I have created an array that stores various images using angularJS: $scope.docImg = [ '../../Content/Image/BackGrounds/abra.png', '../../Content/Image/BackGrounds/background_black.jpg', '../../Content/I ...

javascripthtmlangularjsloopsbootstrap-modal

Displaying an array using Javascript that contains variables along with HTML code

First of all, thank you for your help and support! I am struggling with correctly outputting HTML code with variables using jQuery and jQuery Mobile. I receive results from a PHP database, separated by "," and converted into a JavaScript array successfull ...

javascripthtmlarraysvariablesoutput

What is the process of invoking an external JavaScript function in Angular 5?

I recently downloaded a theme from this source. I need to specify script and CSS in the index.html file. The body section of index.html looks like this: <body> <app-root></app-root> <script type="text/javascript" src="./assets/js ...

javascriptangulartypescriptangular5

``Protect your PDF Document by Embedding it with the Option to Disable Printing, Saving, and

Currently, I am facing a challenge to enable users to view a PDF on a webpage without allowing them to download or print the document. Despite attempting different solutions like Iframe, embed, PDF security settings, and Adobe JavaScript, I have not been s ...

javascripthtmlpdfiframeembed

Discover the procedure for extracting a dynamic value from JavaScript to PHP

Could the centerId value be utilized and transferred to a php variable? const data = { action: 'ft-add-member', maritalStatus: $('.ft-entry-relationship-info .ft-marital-status ul li.current a').data('dropdown' ...

javascriptphp

Place the image either above or below the text in a relative position

I have a peculiar dilemma that has been on my mind lately. As I work on designing my website, I am nearing completion of the responsive/mobile view. Currently, everything looks fine, but only because I use display: none; to hide images when the viewport is ...

javascripthtmlcsstwitter-bootstrap

Creating an input in Vue3/Javascript that restricts input to only numbers seems to be a challenge

I have a project that involves an input field which should only accept numerical values. Within the template, I've set up an input element with the value bound to a variable and the input event linked to a function that verifies if the entered value ...

javascriptvue.jsvuejs3

How can rate limiting be integrated into an express.js application?

How can rate limits per IP be effectively implemented in a Node.js Express API App? const express = require('express') const app = express() const port = 3000 // where should the rate limiting logic go? app.post('/test', (req, res) =&g ...

express

Extract hidden form variables using a function in PHP

Here is the JavaScript function that I have written: function GetCellValues() { var rows = document.getElementsByTagName('tr'); var str = ''; for (var c = 1 ; c < rows.length ; c++) { str += '\n&apo ...

javascriptphphtmlhidden

jQuery fails to make a POST request when the content type is set to application/json

I am utilizing jQuery version 1.10.1. My goal is to execute a POST request with the content type set to application/json. The code I have implemented is as follows: $.ajax({ type: "post", url: urlBase + "user/search", contentTy ...

javascriptjqueryajaxhttp-headerscross-domain

While making a promise, an error occurred: TypeError - Unable to access the property '0' of null

I encountered an issue when trying to assign data from a function. The error appears in the console ((in promise) TypeError: Cannot read property '0'), but the data still shows on my application. Here is the code: <template> ...

javascriptvue.jsasynchronousasync-awaitpromise

Create styles for each component based on their specific props when designing a customized Material-UI theme

I am having trouble styling the notchedOutline of a disabled <OutlinedInput /> in my custom MUI theme. My goal is to make the border color lighter than the default color when the input is disabled. Here is what I have attempted so far: const theme = ...

javascriptcssreactjsmaterial-ui

Check for compatibility of overflow:scroll with mobile browsers

Is there an easy JavaScript method that works across different devices and libraries? I am looking to assign a class to the html element in order to enable scrollable containers on mobile devices when needed. I want to follow a similar approach to Modern ...

javascriptcssmobile

Exploring Multilingual Autocomplete or: Best Practices for Managing Multiple Languages in Web Applications

I'm currently developing a website and I have a mysql-table named 'items' with the following structure: item_id | item (The second column is used to identify the item_id.) In a file called language1.php, I have an array that stores the it ...

javascriptphpmysqllocalization

I am able to successfully receive accurate data in JSON format, however I am facing difficulties binding it to a jquery

I am struggling with integrating data fetched in JSON format using $.ajax into a table using jquery's datatable. Below is the JavaScript code I have been trying: $(document).ready(function () { $.ajax({ type: "POST", url: "Result.aspx/getUser ...

javascriptjqueryjsonajax

`Javascript framework suggests ajax navigation as the preferred method`

What is the best way to handle ajax navigation using jQuery? I have recently experimented with a simple jQuery ajax code to implement ajax-based navigation for all the links on a webpage. $('a').click(function(e){ e.preventDefault(); ...

javascriptjqueryhtmlajax

Manipulating the length of an array based on a specified range using Vue.js

I'm currently working on a client's range filtering feature using Vue.js. The filter involves an input element with the type range to adjust the total number of clients displayed. I have successfully linked the value of the input to the **clients ...

javascriptarraysvue.jsfiltervuejs2

Storing user input from a dynamic form into a database using Kendo UI

I've successfully populated dynamic input form fields. However, I'm unsure how to save the data into a database using a put/post API since I have only used a get API so far. HTML code <div id="renderform" class="form horizontal-for ...

javascriptjquerykendo-uiasp.net-web-api2

Passing parameters in a jQuery function through a button click

I am trying to figure out how to pass the @item.Id value as a parameter in the click function for a button. Here is the code snippet: <button id="buttonEdit" style="color:darkgreen" data-toggle="modal" data-target="#Ed ...

javascripthtmljquerycssmodel-view-controller