DEV Community

Cover image for Nuxt3 + Express API

Nuxt3 + Express API

Mihai-Adrian Andrei on December 15, 2021

So, a while ago I needed this integration for a personal project, and of course I used the all mighty Google, but could not find any step by step t...
Collapse
 
leem0n14 profile image
Lee_Moon

Now, in nuxt3 serverMiddleware has been replaced with serverHandlers!
Thank you very much for this article,it really helps me a lot!

like: serverHandlers: [
{ route: '/apis', handler: '~/server-express/index.ts' }
],

Collapse
 
benandy_37fb59ded85e1d6f2 profile image
Benandy • Edited

Can you send link how it's integrate?

Collapse
 
slidenerd profile image
slidenerd

what if I have a separate project as backend and another one with nuxt as frontend and want to connect both of them?

Collapse
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

You can just just make http calls from nuxt to your server ( using axios ).

Collapse
 
slidenerd profile image
slidenerd

interesting but wont that create a problem? your nuxt frontend will be running on localhost:8080 while your backend runs on say localhost:3000

Thread Thread
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

You will need to add cors on your server. And specify localhost:8080 there.

Thread Thread
 
slidenerd profile image
slidenerd

if it isnt too much to ask, could you kindly add another nuxt + express api article but this time show how cors is done, your current article wouldnt need much changes from what i understand

Thread Thread
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

Sure. I will make one. You want it with nuxt2 or nuxt3?

Thread Thread
 
slidenerd profile image
slidenerd

whatever you are comfortable with, if you could do nuxt 2 that would be great, if you want your article to have the future in mind nuxt 3, if there is not much difference between both,perhaps make a single article with 2 sections inside, super appreciated!

Thread Thread
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

Hello. I created a repo that you can check here: github.com/mihaiandrei97/express_n...

Thread Thread
 
slidenerd profile image
slidenerd

extremely helpful!! just a curious question though, your nuxt config file says ssr false, does anything change if ssr is true

Thread Thread
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

The deployment. If you choose ssr true, you need to deploy the app to a node server. If you choose ssr false, you can deploy it as static website to netlify for example.

Collapse
 
jackysupit profile image
Jacky supit

oh wow, thank you!!! you have no idea how this save my head from this hours headache :')

Collapse
 
slidenerd profile image
slidenerd

also on your profile you misspelled Python :) by mistake

Collapse
 
mihaiandrei97 profile image
Mihai-Adrian Andrei

Thanks :D

Collapse
 
danielkjcoles profile image
Daniel KJ Coles

Awesome, thanks for this!

Collapse
 
laxman16in profile image
laxman16in

getting 404 page not found

Collapse
 
bigjihua profile image
JiHua

me too