Ionic + Next.js with SSR & API Routes

Hi all,

we’re currently building a responsive web app with next.js. That web app should get its own native apps for iOS & Android to distribute it in the apple/google app stores.

I’m looking into Ionic for this but I’m not sure if it will work with our next.js setup. I mainly see two potential problems here and would appreciate any ideas/opinions on these:

Currently, we’re using next.js mostly with static generated (SSG) pages, but we also have some server side rendered (SSR) pages. I can imagine that SSR might be a problem for ionic since we won’t have a connected server?
It would be possible for us to switch to an SSG-only approach if that’s required for Ionic - but we’d like to prefer using SSR if possible.

2.) API Routes
We’re using next.js’s new API routes (API Routes: Introduction | Next.js) to connect our app to a headless CMS & Auth0 for authentification using serverless functions. I could imagine that this might be a problem? Would we need to change our next.js API routes to a regular node.js server in order to make our server calls work with Ionic?

Would be awesome if someone who’s into this or anybody who has an idea could answer one or both of my questions. Thank you very much!


It will be perfect if it can work with SSR of NextJS!

1 Like

+1 here as well.

Currently building a web app using Next.js and Ionic components, with a plan down the line to move it to mobile as well. Currently using SSR for the pages I’ve built so far and would love to be able to create a hybrid solution that can SSR for web and still be able to run in mobile using the same repo. Wondering if you’ve had any progress in getting Next.js to work with your mobile app?

I recall reading in the Next.js/Ionic starter repo that was put out around this time last year that greater Next.js integration is something the Ionic team is looking at addressing in a future update.