Deploying a Slack Bolt App to Railway (Full Transcript)

[00:00:00] Speaker 1: Do you want to see how to host a Slack app? Watch this. Hello and welcome back to Slack School. My name is Mike Reynolds. I'm your host. I'm part of the Slack team here at Salesforce. And today we're going to pick up where we left off in the last episode. We just learned about how to build a Bolt app and then put it inside of a container so that it can be hosted. Today we're going to do the hosting part. That means setting up the actual hosting tool and building the app in Slack and then moving some keys around. As always, follow along. Make sure you've checked out that last episode so that you can get hands on. Let's get after it. To get started, we need a place to host our app. I'm going to do this today using an online tool called Railway. Let's get into it. I'm going to go to my browser and I'm going to go to railway.app. Railway is a good tool. I recommend it for learning. It's very solid. It's going to do everything that you need it to do. And it's got a very generous free tier that's going to let you learn and play with your app and make sure that it's working the way that you want. If you're an enterprise, make a good enterprise tool decision. Don't just do what some guy on YouTube said. Do some research. It's all right. So here's what we're going to do. We are going to go to sign in. I need to create an account. I'm going to do that by clicking continue with GitHub. So what's nice about this is once I've already signed in with GitHub, my repo in GitHub is going to be connected directly with Railway. That's going to make life really easy. So there we go. I've got to review these terms and conditions. I love all of those. I'm definitely not going to violate any of these. So I'm going to agree to that fair use. And now we need to go ahead and grab that sample app that we pulled down into our GitHub. So I'm going to come over here to this GitHub repository. And I'm going to install the GitHub app, which just means connecting it to Railway a little bit better. I'm going to say all repositories agree. Got to sign in. Here's my trusted fingerprint. And now we need to create a new project. I'm going to click new, going to choose GitHub again. And I've got my one app that we installed or that we downloaded yesterday. So I'm just going to choose that. And again, here it's building the app. So our app already has a Docker file in it. So we know that there's instructions on how to contain our app, how to spin up Node and NPM and use all of these tools, because they're in our instructions. Each time I build the app, it's going to take a little bit of time. And this is very normal. All right, our app is done building. And I think this extra window here is a little silly. So I'm going to close this one and just going to go load this again. And choose my app that was just created. It says my app just crashed, which is fine. I don't need it to work yet. There's got some extra setup that needs to happen. So the first thing I'm going to do is go into settings over here and scroll down just a little bit. And under public networking, I want to click this generate domain button. And we're going to say that the port is 3000 and hit generate domain. So now I've got a URL that we're going to use. We're going to need that in just a second. We also need to create a couple of different variables. The first variable is going to be our port. So we'll do new variable. We'll give the variable a name port. And the value again is going to be 3000. We'll hit add. We do mean port. Sorry. I capitalized. We should have done that. Yep. Change it to port. The next variable we need is the Slack bot token. But we'll be a little bit more careful about how we add it in. We'll do new variable, all caps, Slack underscore bot underscore token. And over here, I'm just going to enter something. We're going to change it in a little bit. In the last token, we're going to add is the Slack signing secret. Again, all caps. We'll do new variable, Slack, signing secret. And again, the value, just enter whatever for now. We will replace these with new values later when we get them. Now let's go get that URL that we generated and add it into our manifest so that we can actually build the app in Slack. I know it seems like a lot of steps, but it's going to make sense in a little bit. So we'll go back to settings. We'll scroll down here. And if you hover over this, you could copy it, but you can also click this little copy icon. So I'm going to go ahead and copy that. And then I'm going to jump back into my VS Code. Now in VS Code, I've included a manifest that we're going to use to create our app in Slack. So I want to go ahead and open the manifest file. I'm going to make my terminal a little bit smaller. And over here in the slash commands section, because we're going to start our app by using slash commands, I've got a Your Railway URL right here. We want to swap this portion of this URL out with what we just copied. So now it's going to say my Slack school approval app production and a bit of a code here. And then the rest of it, of course, is this slash Slack slash events. We need to do this one more time. If you scroll down a little bit farther in the manifest, and my VS Code is actually suggesting that I make this change, but I'm going to go ahead and just type it over here. Again, Your Railway URL, we're going to copy here and paste that in. Once I have that copied, I'm going to save it. And now I'm ready to go ahead and build my actual app in Slack. I want to copy this entire thing. So I'm just going to highlight it all and copy it and jump back into my browser. And we're going to go to api.slack.com forward slash apps. And we're going to create a new app. We're going to choose this option right here from a manifest. We'll hit continue. And here, I want to replace the kind of boilerplate that it gave me with that larger file that I just had. And now we have to choose a workspace to install it in. It's just like a normal app. Here I want to put this in my Slack School workspace. And I'm going to hit next. It's going to just ask me to review. I'm going to say, yep, go ahead and create and install. Again, I've got to approve everything. I'm going to say allow. And we're good. It says my app is ready, and it's giving me a dropdown for credentials. Now, this part I'm not going to show you because you can't have my keys. What I want to do is copy this bot token that's right here. Now of course, I'm going to copy this and paste it into my environment variables and into Railway. And I'm not going to show you that part. Now we also need to get our signing secret. So I can get that right here. So again, I'm not going to show you this part, but I'm going to click that button that says show and copy it and then paste it into my .env file. Now I need to get my token in Railway updated in the variables that we just created. So let's go do that. I'm going to go back to Railway, going to choose variables. And where it says Slack bot token, I'm going to come over here and click edit. And now I'm going to replace it with my actual token. Again, don't look. I need to do the same thing with the signing secret. Again, you can copy these from your .env file or straight from Slack. Either way works. So now Railway knows we're using port 3000. It has our signing secret and our token. So Railway is going to be able to connect directly into Slack. Also you'll know Railway is connected to our repo because we chose to authenticate to the repo. In the next episode, we'll show you how to actually do that all with GitHub Actions instead of having Railway do some things automagically for us. But if you've done exactly what I did, if you make changes to Git, it's going to automatically push into Railway and then Railway will update your app and it'll be working just fine. I have gone back to Railway and I've just chosen this deployments tab and it says that my app crashed. I'm going to go ahead and click restart. What I wanted to do is just rebuild itself now that I've updated the environment variables and I've added in all of the access to everything. I'm going to come up here and hit deploy. It's going to apply all the changes and it's going to initialize everything to rebuilding the app and hopefully we'll be good to go. All right, great. Our app is deployed and it's running successfully. So let's go test it out. The way that we use this remembers with slash command. So I'm going to do slash approve and hit enter. This is a simple approval app. It's going to ask me to name a user and then type a message. So I'm going to go ahead and select myself and I'm going to say approve this. Once I submit this, the app should send me a DM. You can see that was nice and quick. And I've got a little block kit here where I've got a good button for approving and another button for rejecting. If everything works well, if I approve or reject this, it should notify me as the person who submitted the request that it was approved or rejected. So let's try it out. Perfect. That worked. It also correctly updated the status to say that it was approved by me. Looks like everything works really well. Well there you have it. Getting our app hosted was as easy as anything. Let us know what you thought of the episode by jumping into the Slack community workspace at slackcommunity.com, joining me in the Slack school channel and giving me some feedback or suggest what you want to see me do next. Don't forget to like and subscribe and we'll see you next time. Oh, hey, you did a really good job today. We'll see it, wait, what do I always say at the end? Oh.