Deploy Express.js app to Vercel

After research how to deploy Express.js app to Vercel. Finally, I found and got have an application has deployed to Vercel. It's take a lot of time from me but I am happy and hope this article will help something to you.

I. First of all, creating new Github repository and init new project nodejs.

II. Creating new project in Vercel

III. Installing package express to nodejs app.

IV. Creating and endpoint file index.js in root source.

V. Creating APIs in ./api folder or you can rename anything which you like.

• Here is an example for manage product from ./api/product.

VI. Testing before commit source to Github.

• After testing is 👌. Commit them to git to see something awesome.

VII. Ready to serve in Vercel.

VIII. Something went wrong in Vercel.

• Because Vercel just supports API from Framework JS as NEXT.JS, Nuxt.JS,... So if we develop a standalone application we need to configure or tell the server of Vercel how is it work by vercel.json file.

IX. Add new vercel.json file to root source.

• Commit it to GitHub and make sure version is 2 - this is required from Vercel.

X. Done, enjoy your moment.

Thanks for reading.
And I hope something good to you.
Here is repository which use in this post.

XI. Or you can follow this tutorial in youtube.

Comments

[Catur Wicaksono]

this is awesome.. but when i try to build using express generator, it doesn't work, is there any help :(

[Ha Tuan Em]

Vercel is not supporting the Express Generator at the moment. Becasue it's attach to the pattern of serverless. Instead, you can use express traditional. Thanks.

[latze]

So i created an api with express
can i use vercel to deploy it?

[Ha Tuan Em]

Yes, you can.

[Felipe]

Thanks!

[Jonathan Gamble]

Could you show us how to do this with Angular Universal or NestJS?

[Ha Tuan Em]

I will try it.

[mohaymen_rafi]

Thanks!

[thechallengerr]

But how can I deploy a express - handlebars to vercel ? Here is my folder structure and vercel.json :

"builds": [
        {
            "src": "src/*.js",
            "use": "@vercel/node"
        }
    ],
    "routes": [
        {
            "src": "/(.*)",
            "dest": "./src/routes/index.js"
        }
    ]

[Arafat]

have you got any answer?

[Sh Raj]

{
    "version": 2,
    "builds": [
      {
        "src": "server.js",
        "use": "@vercel/node"
      }
    ],
    "routes": [
      {
        "src": "/(.*)",
        "dest": "/"
      }
    ]
  }

[Sami Kalammallah]

How about a full stack app where I use express on folder /server and react on /client ?

[Ha Tuan Em]

Waiting for my new post 😀

[Feco]

Thanks @hte305 !

[Ha Tuan Em]

Hope, it helps something to you.

[Kamal Hossain]

Is it completely free?

[Ha Tuan Em]

As you wish 😉