Guides for redirect to app.site.com

[white stratus]

How should I approach this requirement where I have my site at site.com. And I would like for the main application to live at app.site.com. How should I approach this?

[woven shadow]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[simple quartz]

Do you have a domain? that needs to be either done by changing nameservers or by adding records

Easiest solution is to use vercel nameservers, and add that domain to vercel i.e. app.site.com

vercel will handle the rest

[last linden]

you can use a permanent redirect like this: https://nextjs.org/docs/app/api-reference/functions/permanentRedirect

permanentRedirect(path, type)

Or you can route inside your domain config, that you want to redirect from site.com to app.site.com

[acoustic crag]

I think @white stratus meant a multi tenant app
Read through this post: https://vercel.com/guides/nextjs-multi-tenant-application

[last linden]

well, we never know when OP is not answering ^^

[acoustic crag]

Thats true lol

[merry linden]

create a A record on dns

[last linden]

Wow the third person that said that 😂

[white stratus]

Sorry, guys! Was night time in my time zone

I’m thinking of apps like Tinybird or WorkOS where their site.com is used for landing/marketing. And when you’re signed it, you’re redirected to app.site.com

[white stratus]

Yes, I do have a domain

[simple quartz]

Can you explain further what you need to do

Do you want to redirect users from site.com to app.site.com?

if that, set up a redirect in site.com to app.site.com

and use app.site.com as domain

I'll explain steps in detail if you want

[white stratus]

I still want to use site.com for things like /pricing, /about, /contact, for example. However, for paths like /signin, /signup, /slug/dashboard I want them to be at app.site.com

[simple quartz]

You'll need 2 apps for that

thats a simple way

[white stratus]

Ahhhhh. Yes, yes. That does make sense

For the sake of knowledge haha, how would you approach the “difficult” way if you were to do this with one app

[simple quartz]

For that, You'll have to create a wildcard

for 1 nextjs app

wait not wildcard

You have to create 2 domains, pointing to same app

add 2 domains*

And in nextjs app only, you'll have to redirect from app.com to app.site.com/signin, it'll be in the same app. However, if you want it such that app.com/signin doesn't work, you might need to use a condition for that, or middlewares.

Also, mark my message as a solution

its not actually difficult, but time-consuming

[white stratus]

How would I test this out in localhost?

If at all possible

[simple quartz]

Let me see

[simple quartz]

You'll have to run a app twice, each on different port

in .env, set up both the urls, including values for condition

window.location.host, to see the host

here is a example condition(Could be inefficient and could have errors)

const pagesInSubdomain = ["/login"] 
//sign in page
if(pagesInSubdomain.includes(window.location.pathName) && window.location.host !== process.env.SUBDOMAIN_URI)  {
redirect(process.env.SUBDOMAIN_URI + window.location.pathName)
}

it just gives you a idea on how to achieve this

[white stratus]

Ahhhh. Okay, okay. Thanks a bunch!!