Spin up a backend, connect a frontend, and deploy to production - all in one session. Featuring Railway.
Speaker 0: Hi, everyone, and welcome to Leap Week. My name is Lindsay, and I'm an engineer on the direct us team where I mostly work on integrations and developer experience. For day two of Leap Week, the theme is build it, run it, sell it. The idea is to show how quickly you can go from an idea to a real production application using modern tools. We'll be focusing on the first part of that story, build it.
For this session, we're going to build a fictional AI automation agency. The idea is that this agency helps companies implement AI workflows for things like marketing, automation, research, sales outreach, and internal knowledge assistance. So by the end of the session, we'll have a working back end for this agency, generate a front end website for it, and deploy the whole thing live. But before we can build anything, we need somewhere to run our back end and infrastructure. I'm joined today by someone from the Railway team.
I'll let them introduce themselves and tell us a little bit about Railway before we start building.
Speaker 1: Awesome. So, thank you so much for having me. My name is Mohammed. I'm a general engineer at Railway. And at Railway is I would say in a nutshell, it's a all in one intelligent cloud provider.
You can deploy pretty much anything, databases, back ends, front ends, queues, whatever. Like, you can just deploy it. You can just run it. And, yeah, essentially, we allow you to deploy anything, and we really focus on making it easy for you to go from zero to deploy it as easy as possible. Yeah.
So excited about what we'll build today today.
Speaker 0: Awesome. So the first step in getting any project off the ground is gonna be your infrastructure. And instead of spending hours setting up servers and databases, Railways gonna let us start from a working template. For this demo, we have a template we've already created. It's a pretty simple one.
It's gonna have everything you need to get started. We do actually have another version as well that launches with CMS collections already started if you want a starting point. But for this, we are going to use our blank one. So I'll go ahead and launch that template here.
Speaker 1: Yeah. So a little bit of context. Templates essentially encapsulate a set of infrastructure components, all the configuration. And here, we essentially have, like, a database set up, post press red as a bucket for object storage, as well as directives, which runs our back end. So, like, directives here would be, a server that we actually use.
And now, like, everything here is neatly on the railway canvas. You can see everything grouped under, like, the directors group. And, essentially, like, here, you have a project, and a project is where you can have essentially everything deployed. So, like, in this example here, you have practice running. Maybe you will have, like, the front end, so that will be a separate service.
And that's pretty much all we need to get started. So, like, all you need to do is you can sign up for free, and then you can go to the link to deploy the template. You click deploy now. You can either deploy to a new project or an existing project. If you choose, like, the path we're going through right now is deploying to a new project, this is the experience you'll get.
And now you can see, actually, it's like we have the difference for versus, they're being deployed. So, like, Post JS, that's the database. And then we have Redis and as well, we have, DirectThis, which is also just cute. So, like, one thing after another will be deployed. So, like, in a, hopefully, a minute or two, everything should be ready, configured.
You don't even need to, like, touch an editor, and it just works. So that's pretty much yeah. That's pretty much the overview for templates.
Speaker 0: Yeah. So it looks like
Speaker 1: Like, this is also deploying I see it's so this one is actually deploying from a Docker image, and this is the official one, for directors. I assume this is the latest version. Right?
Speaker 0: Yep. This is our latest version.
Speaker 1: Yep. We make sure
Speaker 0: to keep this updated.
Speaker 1: That's awesome. But, yeah, if, let's say, for example, you deploy and you want to get the latest version, of, let's say, Directus. If you actually go to settings, you'll be able to see the source image. There's like automatic updates. You'll actually be able to see if there's an automatic update.
You just click apply. You deploy it. It just works if you want like the latest version. So it should be very easy to set up, but so far we can now we see, we have the database ready. Red is ready.
The bucket is created, and now the last component direct list is being deployed, which hopefully should be ready Yep. Very soon. And we're live.
Speaker 0: We'll click that. So in just a couple minutes, we've gone from nothing to a running back end with a database, API, and admin interface. So as part of our setup process, we'll create our first admin user here. Give it a password.
Speaker 1: So I assume this happens as the first initial step. Is this correct?
Speaker 0: Yes. Yep. Okay. When you first set up, it'll ask you to create your admin user. And here we go.
We're in our, UI here. And to get started, we are gonna do a little bit of, setup for our AI assistant because we are going to be using AI to create most of this. So Directus has a built in AI assistant that can help you. It can generate schema content, and it has knowledge of what's going on in your instance. So if you go into settings here, we'll give it a key.
Oops. Let me grab my key.
Speaker 1: Yeah. I think you just said
Speaker 0: One password. Gotta have that security.
Speaker 1: Yeah.
Speaker 0: Alright. And then we are also going to set up our MCP for later because we'll be using that when we do our front end.
Speaker 1: So here, this is, like, the Directus MCP or, like, this is an MCP server for our deployed direct the Directus instance?
Speaker 0: Yes. It is. Yep. So our cursor, which we'll use to do the front end, will be able to access all of our data here. And it'll depend on the permissions we give it, what it will be able to do.
But we also have this in app AI assistant here. So we're gonna use that to generate our schema. So I already have some
Speaker 1: So quick question. For someone who's not a 100 to 100% familiar, let's say, with all of the features, essentially, what we're doing is now we have a like, our complete back end deployed running. And part of this back end, you can actually expose an MTP server, and then I can connect to this MTP server via call code, code x cursor, whatever coding agent of my choice, and then just tell it to do stuff for me. That'll be reflected in my live deployed instance, and now it's just that's it.
Speaker 0: Yeah. Yeah. We'll see that a little bit later, but we're gonna do something similar here. We also have our AI assistant that's in the UI here, and we are gonna use that to build our back end, our collections, our schema. So right now, we have no collections created.
We don't have any data tables, basically. So I'm gonna go ahead and prompt it with a prompt that I created earlier, and it's going to create the structure of our back end.
Speaker 1: And the idea is, like, a collection would be, like, an object, right, for something.
Speaker 0: Yeah. So it's gonna be, like, your data tables. So it'll have, like, an overlying day data table where we'll have one called site settings, and that's gonna be the settings for the website. We'll have one for case studies.
Speaker 1: Mhmm.
Speaker 0: That's gonna have case studies for our AI agency. Actually, I can show you the prompt here a little closer. So we've we're creating our collections, and we're giving it different fields. So we're giving it, like, a tagline, a headline. We're gonna give it different services that this AI agency does, give it some fields there, and we're gonna create playbooks and case studies out of those, so things you might need in an AI agency marketing website.
And the AI on our end is going to do that work for us. So we've told it in our prompt what we want. We didn't really tell it what type of fields they need to be, if they're strings or numbs or any of that. It'll infer that if we want. And, actually, one nice thing is if you don't know what schema you want, you can talk it through with the AI assistant.
It can give you suggestions of things that you might wanna add for a data table. So it's gonna ask questions too back to the user. So it's saying it's ready to create these, and it's saying, do we wanna proceed with its defaults? Do we wanna review each one and decide? Or do we wanna have, like, it be super minimal?
I'm gonna say just create it. Let's see what it comes up with. It's asking how we should store the icon. So let's just say a single file upload. How do we wanna store the pricing start?
We don't really care about that. We'll just pick something.
Speaker 1: Yeah. Yeah.
Speaker 0: There's a
Speaker 1: there's a recommendation. So I think we can
Speaker 0: go with it. Yeah. It's collaborative. It's gonna ask you how you wanna do things. It's not gonna just bowl over your user and, like, do everything for you.
It's it's not just an AI tool that's gonna do it for you. It is a human in the loop type of experience where you can make sure it's doing something you actually want it to do. And it's gonna tell you everything it's doing while it's doing it. So you can see here. It's planning it out.
You can see the thinking if you wanna know, like, what it's thinking while it does it. And you can do the different models if you're you have a different one. We're currently just doing, GPT five. In those settings we set up earlier, you can change that out. Like, if you want something different going on, you can say which ones are allowed, because this UI is actually not just for your admin.
You can allow other people here. So you can have other people with different access levels able to come in and modify your content once it gets created or your data tables. So you can let them use the AI assistant, and you can set what permission levels they have. So it's gonna ask for different tools like creating the collections if it can do it before it does it. You'll see here's our data models now.
It's created a couple of them. We've got our case studies one. It's starting to add the fields into these. In the past, you would have to do this all manually and create collections. Now you can just use the AI to do it without having to worry too much.
So it's a lot less manual work.
Speaker 1: But we could have done the same thing by using the MCP thing. Right?
Speaker 0: Yep. You can. Yeah. We just wanted to give people an in app way to do it a little faster and simpler for people who maybe aren't don't have a data model or AI model they like to use outside of here.
Speaker 1: Yeah. Definitely makes sense. It's just like in my mind, I really like the flow of using some like, I use Claude a lot. So when I use Claude, I'm like, okay. I want a complete end to end flow.
Like, what what would it look like if I don't leave cloth? Can I actually do the stuff I wanna do? And it seems like the answer is yeah. But there's also And
Speaker 0: that's actually that's what I like to do as well as I'll go in cursor, and you could start the whole front and back end directly in cursor using the direct SMCP, and it can create it in here for you. We're gonna do the front end in Cursor just so we're seeing that too a little bit, but I wanted to use a little of the AI assistant as well.
Speaker 1: Yeah. Yeah. I'm actually in the process of making sure that our experience of getting started to be super seamless. So we already have, like, a regular CLI. We have, like, Asian skills, and, we're going to essentially keep shipping more, features through the CLI.
So, like, it should be able to you say, like, oh, I wanna deploy direct us. It should be able to go through the templates marketplace, find the most up to date template deployed for you, and then it should be able to also figure out, like, the deployment is finished. Let me continue. And then you just have, like, a complete workflow where you don't even have to go to a templates page. So that's kind of, like, what's
Speaker 0: That's awesome.
Speaker 1: In the works. But yeah.
Speaker 0: Yeah. I'm excited for that. That'll be good.
Speaker 1: Yeah. That's I think it asked a question at the end.
Speaker 0: Yep. So now it is done. It's gonna, like if you've used this model, it constantly asks you other things it wants to do, but it is done. It's created the fields. So we've got that part done.
Now we're gonna give it some fake content in these fields. So that's the database table. And now we're gonna fill these tables with actual, like, fake data. So I'm gonna paste that in. So when we go into here, you'll see no content yet, and it's gonna start filling those in.
But you can see, like, these are the fields. So if a nontechnical user came in and wanted to give it a new name or a new tagline for their website, they can do it in here without having to touch the code at all. So it's a nice way to work with both your front end team and your back end team and your content team and not have, people who are super technical not able to get things done. While this is doing it, we are actually gonna get finished setting up for our MCP, actually. So we're gonna go here in our docs.
We have a little section for setting up the MCP in different tools. We're gonna use cursor. So I'm gonna click add to cursor here. Nice easy button, and it will set us up into our settings. And we are going to go grab our URL from here.
So this is our directest instance URL, and we'll pop that in here for our MCP setup. So it's just your instance URL slash MCP, and then you're gonna wanna set up a token. So let's make sure it has the permissions it needs. When you're connecting to external tools like cursor, it's always a good idea to scope your permissions so that it's not able to completely nuke your whole setup. You know, AI likes to be overeager.
Speaker 1: So Yeah. Yeah. It's like, let's start all over.
Speaker 0: Yeah. We need a fresh start. We we recommend setting up a token for it specifically and not using your admin token. So you wanna go to your user roles here. You'll create a new role, name it whatever you want, and you'll add a policy.
We're gonna give it view only policy. So you'll add your collections, give it read only access. That way it can't, like, update or delete or anything when it's in the MCP. If you want the MCP to do that, you can totally give it permissions to create, read, and update, and do whatever you want with it. But I recommend giving it, like, the lowest level of access at the start so that, you know, it's not gonna go in and break your whole setup here.
Mhmm. So we've got our policy. I'm gonna create a new user too to grab a token from. So if we scroll down to our tokens, we're gonna generate it and save. And then we'll go back in here, and that's where you put in this bear here, authorization code.
You put that token, click install, and that will install our direct as MCP encursors. So now we're ready to go for that when this is finished. So let's go check on it.
Speaker 1: So what we've done is create a role, and then the role has the token?
Speaker 0: Yes. So the the user is what who has the token. So this MCP user has the role that we created. I created it all within the same page, but this person has the role, and then they have the token. Mhmm.
So if you go into our settings here and look at the MCP role, we've got our view only policy that we set up Mhmm. For our different collections. And the users in the role is that MCP guy. So now it looks like it did finish the content. If we go back into our content page, now you can see it's filled it in with our sample data.
I gave it a few guidelines of the type of things I wanted it to have, but, otherwise, it just kinda came up with this on its own, sample content. So it's given us a starting point. So now that we've got some sample content, we are going to go back in to cursor. I'm gonna grab this really long prompt I've created telling it basically we are an AI agency. We're creating our website.
I gave it I told it to use next. I also made sure to tell it to use the Directus MCP server. This might take a minute, so I'm gonna go ahead and get it started. We are in a completely empty folder here, so I'm gonna have it do all of the coding for me. Let it create what we need here.
It's gonna make sure to look at our schema via the MCP. So we want it to not guess on what structure we have of our data. We want it to actually look at it. Like we said, we could create the data directly from Cursor via the MCP. You would have to make sure you give it, the right permissions.
So that that might have to be an admin token in order to generate new schema with your MCP. So if you're comfortable doing that, you totally can.
Speaker 1: Interesting. So once that's done, we'll have something that's working like a front end running locally that's fully functional, pulling data from our deployed direct us instance. Correct?
Speaker 0: Yep.
Speaker 1: Okay.
Speaker 0: Yep. And any changes you make in direct us would be reflected in your local front end that you've got here. And then as the final step, we are going to do to deploy this front end to railway so that you have a full production application front end and back end.
Speaker 1: Yeah. I have cursor set up, so I could just automatically runs everything. I don't, like, manually approve stuff. I just
Speaker 0: I don't trust it. Yeah. I gotta make sure I know what it's doing. I've been burned before.
Speaker 1: I don't know. The the models are they keep getting better and it's like, I'm like, I would've done the same thing. So I don't know. I feel like it's just faster and you can just like, you know, sit back, relax, grab your favorite drink while it gets to work. You come back to it and you're like, woah, this thing actually works.
So Yeah.
Speaker 0: I think I'm a bit of a control freak. I can't let it just just
Speaker 1: go. I'm telling you, like, once you let go and you see, like, it actually works and it's like, I think, I think you'll be plenty surprised. Then you're like, wow, that's actually a really fun. Cause like now, you know, if let's say for whatever reason, someone brings you on Slack, you can play for guys. Like, you come back to us, like, oh, I forgot to approve.
Speaker 0: Yeah. That it's done.
Speaker 1: Yeah. Yeah. I I I think, it's a much more fun experience when you just let it kinda do its own thing without you steering it. But I do understand the, appeal of, you know, wanting to see what it does. But also, like, we're starting from scratch, so there's little, like, room for error, I would say.
But yeah.
Speaker 0: There's nothing for it to break. It's creating it from scratch. So
Speaker 1: Yeah. Yeah.
Speaker 0: We're pretty comfortable letting it just do what it wants to do here. So it looks like it actually has gotten the types if you look. So it pulled this from our MCP. It checked in, Directus, and it got our back end and what types we have there. So that's good.
Looks like it's I did tell it also to create a little connection a net little connector to direct us here, a fetcher.
Speaker 1: So it
Speaker 0: looks like it's done that, getting different gets to get the data.
Speaker 1: And it will be able to pull in our deployed, like, like, URL and actually set it as an environment variable?
Speaker 0: Yes. It will. So I it might make me make the e n v, but I've got it. It's supposed to use the direct URL here, and it's supposed to use the token that we created. So, we'll see.
I've done this a couple times just to see how it would do, and it it doesn't always know to grab the URL. If it's really smart, it can grab it from the cursor settings, and it can get the token and the URL, but it doesn't always manage that. You'll notice I'm in auto mode, so it's a different model each time, so it might not be a very smart model. But we at the end, we'll give it the proper e n v variables, and it'll be able to connect to our deployed instance.
Speaker 1: Excellent. Yeah. Honestly, again, I I like my to choose my own models, You should use, like, a, you know, g p three five point four or, like, an Opus 4.6 and because I don't know. I don't like that, I would say I wouldn't trust the auto. Like, which one would affect?
Like, I wanna be I want a consistent experience. So then if, like, anything starts feeling weird, then I can blame the model. I was like, oh, you know, like, Opus is acting really dumb lately, that sort of thing. So
Speaker 0: It it does just feel like from one day to the next, though, even if you have a model that you know is good, it it doesn't always behave exactly the same.
Speaker 1: Yeah. Sometimes it feels like, you know, you're you're just rolling the dice. Sometimes it's like, woah. This is it. Like, this is the next big thing.
I was like cause like, sometimes I, I, I asked it a question and I wanted it to check against like, you know, our internal, GitHub repo. And it's like, Hey, do we support this thing? It was like, yes, you do. And I told her like, oh, show me the code. It's like, after checking, apparently, this is not supported.
I was like, come. Yeah. And this is like the smart and I told it, like, oh, you know, UltraThink, you know, work really hard, but it's like, I guess sometimes it's just, you know, not that type of day. But I think here it's like it's it's it's working well, based on what I'm saying.
Speaker 0: Yeah. It looks like it's getting something.
Speaker 1: Yeah.
Speaker 0: It's messing around with the configs now.
Speaker 1: Interesting. What is what's it doing to the Next. Js config if we open it up? Just out of curiosity. Technically, you know, we're we're not supposed to look at the code, you know, and, because, you know, I was just shipping it, but I'm also curious.
Okay. It's setting, like, the assets URL, I assume, for, like, files and stuff. That's pretty awesome.
Speaker 0: Yep. And while it does that, I'm actually gonna grab my last prompt, which is a prompt to have it, push to GitHub so that we can get it ready for deploying the front end. I'm gonna grab that. Go back in here. I think it's almost done.
It feels like it's it's doing the read me. So
Speaker 1: Yeah. Probably at the end. But yeah. I would say, there is actually a like, you you can definitely, you know, start with this workflow. It's totally fine.
But if you have, like, the AOS CLI setup, it could just deploy it to your existing project. And this way you don't even have to worry about git being installed, get, having a GitHub repo or anything. But when you have it with git, well, the benefit is, anytime you make, changes through the front end, it will just automatically deploy. So it's like it's it's all trade offs based on, you know, how, structured and organized you wanna be. But yeah.
Speaker 0: Yeah. That makes sense. Alright. We did not create our E and V, so we're gonna create that real quick. And
Speaker 1: I would say that's the responsible thing for it to do.
Speaker 0: Yes. I don't didn't really like that it created its own ENV and, like, grabbed my things from the MCP. That was a little, uncomfortable. Yeah.
Speaker 1: Yeah. It then gets better this way.
Speaker 0: Yes. Look at our URL. Alright. And then we're gonna run it locally just to see it working.
Speaker 1: What does the static token do?
Speaker 0: So that's the one we created with for the MCP. We're using it here too. Okay. So that is the permissions that we allow in Directus. So if you give it, like, no read permission, it won't be able to see the content.
If you give it access to read, like what we did, we gave it access to read all of these collections, then it can read the data. So that's where, like, you probably want a separate one from your MCP. We're just in the interest of time having it Yeah. One that is view all for all of our collections because we don't need to make changes with the MCP. But you probably would have permission to update and delete with your MCP as well.
So you probably want wanted a separate one for your front end. So you'd probably wanna create a user role for your front end that gives it different permissions. Otherwise, you can have it set up to use your public permissions, which controls what the API data is, available without authenticating. But it's safer if you do give it a token so that your front end is only able to grab what you want, not, like, everything. So let's see if it worked.
Speaker 1: Moment of truth.
Speaker 0: Okay. There it is. Looks like some images are broken, but we've got a full website here. You can navigate around. It's got some prompts.
It's got a button to get in touch.
Speaker 1: We've got a
Speaker 0: full website here. Obviously, you'd wanna iterate on it, fix the images, and, do a little honestly, it looks great. It doesn't need too much design or anything even. So that's a good starting point. We are going to go ahead and say good enough.
The images can get fixed later. We are going to deploy this. And, of course, I copied other things, so I need to go back and get my prompt. So like you said, there's other ways to do this, but we are gonna have it pushed to a GitHub repo. We're pretending we have other people who wanna manage this code, and we want it in some place that we would have access to it as a team.
So we've have a GitHub repo we've already set up. It's empty right now, and we're gonna push it into here. So I'm having it create a readme that'll tell users, our other team members, basically, is in our example here. We're deploying to Railway. Here's what you'll need.
It'll mention the EMV variables we created here, because we're gonna need those. I'm actually gonna copy them now, so I have them ready. And then it it's gonna make sure everything's building properly with the prompt I gave it, and then it will push to GitHub for us.
Speaker 1: Yeah. And I noticed it said, like, even if you don't have, like, the environment variable set up initially, like, it should still deploy. It should still work. But once we actually set the these values, we'll be able to actually fetch the thing and have the same result we have locally, but actually have it live and deployed on a URL.
Speaker 0: Yep.
Speaker 1: It's updating the ReadMe.
Speaker 0: Yep. There's our ReadMe.
Speaker 1: I remember the times where I had you know, I used to write stuff by hand.
Speaker 0: Yeah.
Speaker 1: Now I just be like, you know, just instructions, just lines, like update, read me, and that's it. You know? Just just figure it out the rest.
Speaker 0: Alright. I think it's gonna commit.
Speaker 1: Yeah. I think it's already I believe I ran already a built. So, yeah, we see, like, the dot next directory. Maybe the build was under there. Yeah.
It's running get the commands. Okay. I think it has committed everything here. So now
Speaker 0: What did I do?
Speaker 1: I think it's just the wrong link.
Speaker 0: Yeah. It did. Okay. So we are gonna now go in here. We're gonna add a service.
Speaker 1: Yep.
Speaker 0: GitHub repository. And what did I call it?
Speaker 1: Was it like AI agents or something like that?
Speaker 0: AI agents. Not sure. Oh, boy. Hold on. I pasted it down here.
Speaker 1: You should be able to see, like, all repos, but maybe you have too many. So, like
Speaker 0: I have so many. I really need to clean it up.
Speaker 1: Yeah. Yeah. That's me.
Speaker 0: Okay. Hold on. I'm gonna
Speaker 1: Give me to refresh. Yeah. Yeah.
Speaker 0: Just don't wanna have my mega list of repos up on the screen so one's.
Speaker 1: But I think you might need to refresh the, so I tried to push the code. Right? Oh, it didn't.
Speaker 0: Yeah. I don't know if it
Speaker 1: pushed. I mean, I guess you need to stop. Yeah. See
Speaker 0: It's getting me with the permission things. You're right.
Speaker 1: I should
Speaker 0: just let it do whatever it wants.
Speaker 1: Yeah. But now it's I don't know if it's pushing it, and then it should be good. So now if you go to right way, I would say if, if you refresh, you should be able to see it. Yeah. We have code.
Speaker 0: The code is now here.
Speaker 1: Yep. Now when you add, we might need to like refer, I think it should just fetch, but you can try.
Speaker 0: Does it not like my
Speaker 1: Maybe just try refreshing, like, the, entire Page. Dashboard. Yeah. Yeah. Just in case.
Speaker 0: Yeah. Okay. And Okay. Let's try again.
Speaker 1: Interesting. I mean, if you want, what you could do is maybe it's just an issue with, like, get up not pulling. So, like, you can copy the full URL. And when you add, you can just paste that URL.
Speaker 0: Okay. The it looks like it found it like that. So let's
Speaker 1: Yeah. Yeah.
Speaker 0: Alright. So that is how you connect it, and then
Speaker 1: we're gonna just need to hit deploy. Yep.
Speaker 0: Yes. But I wanna put it up by the other ones first. Yeah. And that was
Speaker 1: in there.
Speaker 0: Yes. So I wanna also add our e and v variables before we get started.
Speaker 1: So they're actually automatically inferred, like, at the bottom. Oh. You can see them. You were right. Suggest variables, and then you can update these values and click add, then you're good to go.
Speaker 0: There you go. So let me grab where I pasted them over here.
Speaker 1: You can also have, like, go the route you were going through, like the raw editor, copy and paste that other thing, but just just wanted to point it out. Because, like, to me, it's like, it's one of those things that when you don't know it, you're like, oh, that's neat. That's kinda how I always felt about it the first time I tried it.
Speaker 0: Yeah. You're right. That is cool that it already kind of pulled up what we needed.
Speaker 1: But,
Speaker 0: yeah, you could also open raw editor and just paste in the whole EMV file that we had ready.
Speaker 1: Yep. And then you can click add to add everything.
Speaker 0: Yep. So these this is the token we have in our local one, and then this is the URL of the same thing in Railway. You guys can also do internal URLs. Right? Is that something we could use here if we wanted to use the local URL
Speaker 1: of this? So you can do, like, a dollar sign, two curly braces, and then you should get auto complete for, like, the URL. So, actually, you will be able to see a line where they're both connected if you wanna try it out. And then what will happen is, now whenever if the URL changes, it will just automatically update the other one as well and redeploy it.
Speaker 0: Okay. So that's like using the internal
Speaker 1: URL reference variable. So I I believe you the way it would work is you just do, so the on directives and the variables themselves, like, if you go to variables. I believe what's the yeah. I guess it's public URL is the value that we will want. So wait.
If you go now to the AI agency service and then go to the next public directors URL, because that's the URL value you wanna set. Right? So that more menu and then edit. And then if you do, dollar sign and then double curly braces, you'll be able to actually pull in so I believe the name of the service is directed. So you just do direct us, and then it's gonna be dot yep.
Do you see? And then you just choose the public URL Yep. From this list. Got it. So now when you choose it, it's just gonna automatically give you the right URL and it will just be able to read it.
So if the other one updates, you just do it. But for this, you're gonna need to hit redeploy again. So it will take some time. So I'd say we can do this after you can cancel. But yeah.
And I would say there's actually another cool feature because might as well, if you go to settings, like, okay. It's done. So we can actually test the thing. But we can update, like, the domain to, like, a actual domain because you can now buy domains on railway.
Speaker 0: Nice. Okay.
Speaker 1: Yep. So this will give to you just a domain for, the front end itself, and it will have, like, a .up.railway.app at the end. You'll need to specify a port, which I'm not sure what it is on. I I think it should be 3,000. Like, 3,000 should just work.
Speaker 0: Yeah. Yeah.
Speaker 1: And if we visit it, might be the incorrect port. You could try eighty eighty as well because that's what I was suggesting in the beginning. Yeah.
Speaker 0: There we go.
Speaker 1: There we go.
Speaker 0: So there is our front end deployed.
Speaker 1: Yep. And we have a live app.
Speaker 0: Yeah. Awesome. So that was pretty fast. We went from nothing to a fully deployed front and back end here. Let's see.
Was there anything else we should know about Railway and getting this set up here?
Speaker 1: I mean, if you hit deploy now, it will just redeploy, and you'll actually be able to see on the canvas. There's, like, an arrow, and this, service, like our front end is, referencing the direct us. And that's how you have, like, a connection between the two. And, yeah, other than that, it's like, you can just have everything in one place. Again, like, if you go now to the AI agency service and you click on settings and you also go to networking, from the right.
Yeah. And then you can actually choose a custom domain. So when you click on it, you should actually be able to buy a domain straight from here. So like, if you come up with that domain, you can just do it from here as well. Or if you go to like ferry.com/domains, you can do it.
But yeah, I would say that's kinda like you now have fully like everything in one place, but you know, took us not a lot of time, and we have, like, a fully, fully deployed working back end, front end. Just, yeah, everything is in one place.
Speaker 0: Yeah. So why don't I recap what we did? We started with a simple idea launching a fictional AI automation agency. We launched infrastructure on Railway. We generated a structured back end with Directus.
We populated it with fake content. We generated the front end using Cursor. We deployed the whole thing back to Railway. That's the build it part of today's theme. The key takeaway is that when interfaces can be generated quickly, the back end data model becomes the strategic layer.
If someone watching wants to try this themselves, what's just the easiest way to get started on the railway side of things?
Speaker 1: The easiest way, I would say going to the template you shared would be the easiest place. And if they, you know, wanna use direct this. And also, by the way, I forgot to mention. So if you actually, like, close the, service here, there's like an agent in the top right corner as well, where you can actually also ask questions about your stuff, like actually ask it to make changes and it should be able to make changes, directly. So I believe if you just say like, oh, update, make this update, it should figure things out on its own.
Speaker 0: Awesome. So you guys got some AI in here too?
Speaker 1: Yeah. Yeah. In case someone wants everything in the dashboard, they can, but also if they want, the, to use whatever their coding agent of choice, they should be able to do it. But yeah.
Speaker 0: Cool. Well, thank you for joining us. I hope everybody has a good rest of your Leap Week.
Speaker 1: Sounds great. Thank you so much for having me.
Speaker 0: Yeah. Thank you for joining us.