[▲ Vercel Community](/) · [Categories](/categories) · [Latest](/latest) · [Top](/top) · [Live](/live)

[Discussions](/c/community/4)

# Create Micro-Frontend using Mult-Zones

81 views · 0 likes · 3 posts


Ankitpinl (@ankitpinl) · 2024-12-18

I have created a page in Next.js that fetches news using an API (SSR) and displays the news list at the `/news` route. This Next.js application is hosted at `https://www.clubbayer.com`. I would like to integrate this page (`/news`) into an Angular shell application, mapping it to the route `/clubbayernews`. The Angular app is hosted on a different domain and platform. How can I achieve this using Next.js multi-zones with rewrites?


Ankitpinl (@ankitpinl) · 2024-12-18

Is there any possible to do this? 

I want to add over here domains

- Angular is hosting on different hosting (https://elevate.com)
- NextJS is hosting on vercel (https://clubbayer.com)


Amy Egan (@amyegan) · 2024-12-18

I want to make sure I understand your plan. You have a page at `clubbayer.com/news` that you want to display as part of your Angular site at `elevate.com/clubbayernews`. 

If I've understood you, then you would need to do some configuration where your Angular app is hosted. The rewrite would need to come from that side since it's in control of the domain and path routing.

If I got it backwards, then this guide has the info you would need: https://vercel.com/guides/how-can-i-serve-multiple-projects-under-a-single-domain