Deploy Rails 5.2 with a TLD, Namecheap, Heroku, Codeanywhere | Ajdin Imsirovic | Skillshare

Deploy Rails 5.2 with a TLD, Namecheap, Heroku, Codeanywhere

Ajdin Imsirovic, Full stack developer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
13 Lessons (29m)
    • 1. 001 Register a Namecheap account

      0:54
    • 2. 002 Buy a domain and signup on Codeanywhere

      5:36
    • 3. 003 Install Rails on Codeanywhere

      3:21
    • 4. 004 Serve a Rails project on Codeanywhere

      2:19
    • 5. 005 signup for Heroku and Bitbucket

      1:39
    • 6. 006 Restart the container in Codeanywhere and show the info tab

      0:47
    • 7. 007 Adding a public SSH key to Bitbucket

      1:04
    • 8. 007b v2 Pushing Codeanywhere code gets rejected because of README on remote

      2:32
    • 9. 007c Fetching remote changes and pushing local repo successfully

      1:37
    • 10. 010 installing heroku toolbelt on codeanywhere

      1:36
    • 11. 011 Logging into Heroku via toolbelt and running the heroku create command

      1:56
    • 12. 012 Bundle install without production

      1:21
    • 13. 013 Deploying our app to heroku subdomain with custom welcome page

      3:57

About This Class

In this video course we will:

- Buy a domain for $0.88 on Namecheap

- Sign up for Codeanywhere online code editor

- Install Rails on Codeanywhere

- Signup for Heroku and Bitbucket

- Learn how to perform some basic tasks in Codeanywhere such as restarting the container and showing our container info

- Add an SSH key to Bitbucket

- Push Cloudanywhere code and see how to deal with problems when the code on our remote (Bitbucket) conflicts with code on our local environment (Codeanywhere environment)

- Install Heroku toolbelt on Codeanywhere

- Log into Heroku via command line using toolbelt and run the heroku create command

- Bundle install without production

- Deploy our app to a heroku subdomain with a custom index page

- Add a TLD (top-level domain) to our Heroku dashboard

- Update the CNAME record on Namecheap

- Successfuly complete the deployment of our Rails app to a TLD (top-level domain)

Transcripts

1. 001 Register a Namecheap account: All right, So what's begin by visiting named cheap dot com and I already have an account. If you don't have it, you can sign up, so you need to click to sign up, link and fill out your information Once you do would be creating a new account. So it's a simple is that since I already have an account, I'll just and through my credentials here and I'll sign in. Of course, I have an additional layer of security cause I've enabled two factor authentication, so I'll just get my codes on my phone. 2. 002 Buy a domain and signup on Codeanywhere: all right. So 647306 was the coast that I received. And let's submit it. It's time for me to buy the main, and buying the main is simple. Well, just quick. The main named Search Here. I'll try to find one of those cheap domains. So let's just choose some simple name like my rails and let's see my rails. US Sub totals 88 cents. We'll click on view cart and now I'll just confirmed the order. No click. Select other payment options and I'll choose secure card payment. Next. Oakley continue and then click pay now. Now that I read it through my domain, I can click Manage to see the dashboard details. Since I've got a lot of the maze, I'll just search and see what I get. I'll click manage here and at this stage, even those a bit early. I'm just gonna set up my advanced DNS ahead of time. So let's click here. Ever gonna change this section of it first, I need to change the details here, so type www. That's my frail that us the Roku DNs dot com, and they'll keep everything else to sing. Maybe I can switch to automatic here and like, the save changes and we're done with name ship parts for the time being. Next we're going to register are. Actually there's one more thing I'm going to be using the email that I get for this domain and in named cheap you can did free email trial for two months. So let's see what we get here. Trout. Any mail package free for two months. Simply select two months billing cycle from the drop down. So I'm going to click here and quick, two months free trial. And as to cart use a domain. I only name cheap. And I'm going to based into the main that I have. I'll select it quick, continue and I can choose the address here. So just gonna be a admin at my rails that us as to cart and confirmed the order. I'll click pay now, of course, I need to approve the terms. So click here and quick pay Now again. And now I can click, manage and find my domain again and quick manage on the domain itself. Which brings me back to the screen that I was on. And now I can at a mailbox. So finally, where you can click here, change passwords and let's say that my new password is going to be just some random passwords that I need to make a bit stronger, So I just all right, So I also have to fill in the name she passed herself quickly do that. We save changes. And now I can actually open my Web mail and I'll type my private email passwords. I'm gonna skip the tour, and that's my email right here. Next, I'm going to sign up to code anywhere. So what's quick? Sign up, verified that you're human. That should be it. L click register before we start using code anywhere we need to verify accounts, so I'll go back here. 3. 003 Install Rails on Codeanywhere: All right. So we've got a new email from Code anywhere Team, and this is the verification email. So let's open this link. And now our account is very fine, so we can go to the editor and with four, it's open. We will call our new container rails, my reels us, and we will choose a blank development stack running a boon to 14.4 Now our containers being deployed. So we've got our copy paste notice, which says that we can select text of the mouse and copied to the clipboard. You're using control C and control Shift B based. So that's good to know. Well, kid, this link because we're gonna need information from it and back in here, we're going to have to run a number of commands to set up rails 5.2 on this machine. So basically, this is a virtual about two machine. It's a in a book to container running on this online I d. So let's first look at the commands that we're gonna have to use. All right, so here we've got commands that we're going to use. So let's start by copy Paste in the 1st 1 and we're gonna have to do this several times and this process takes a while. So we're going to speed things up in some sections of this video. Basically, what we're doing here is we are setting up all the dependencies. Anderson, if we need to be able to update our rials version two rials 5.2 and also be able to, uh, around it successfully. So what we're gonna do is we're gonna have a virtual environment called, uh RB end, which is going to allow us to utilize different versions off rails on this machine. So now we can check for the ruby version we've got installed in our system and we see it's two points, 5.0, so we're gonna make it a global environment, and next, we're gonna double check that we're still using this version, even though this step is not really necessary. But we're gonna get some more information here. So novel installed the bundler and finally we're gonna check the version of note that be running, and we'll make sure to install rails with interest version, which is 5.2 4. 004 Serve a Rails project on Codeanywhere: now we can stall rails. However, since, um, I left my code anywhere here open for a couple of hours, I've basically lost access to my ssh. So my sage console. So in order to open it, or simply right, click on the container name and click terminal, and this will open a no terminal for me. Sometimes you can do this. Also, she need to use two terminals is simply open another one. Anyway, we need only one now, so I'll simply check that I've got the correct reels version and that's a good response that I was expecting. So now I can stall rails with rails new, and I give it a name of my project, and this name will actually be a folder name, and that folder is going to be inside my container. So I'm going to right click here and click Refresh, which will make a simple folder appear here. If I open it, I can see all the contents off a rials project. So this is the default rials projects right here. So now I can go CD change directory and through the simple folder. And finally I can run rails s command, which runs rail server. And now I can finally use this stab here. Uh, that I mentioned previous video needs to be open so we can have access to this link here. So I'm just gonna go right click here openly Canoe tab. And I need to upend crawling 3000 to the end because that's the port that rials, my rails, app is being served on about breast center, and we've got rials running code anywhere. 5. 005 signup for Heroku and Bitbucket: Let's sign up for a big bucket and Hiroko so we'll visit bid bucket duck orig ever gonna get started for free. Our email address is admin at my reels, not us. So click continue my full name and other verify that I'm not a robot and finally continue home. We need to do now is verified email, So I'll go to her local quickly and sign up for free Here I feel doubt my form with my first name last name, email, address, roll country and primary development language when we all verify the capture and create my free account. So now I need to verify the mail for her. Ochoa's well, and I'm going back to my inbox and ah, refresh the page. So let's verify the lesson accounts. And that's the lesson. Is the parent company off Big Bucket. Now I can pick my user name, frankly, continue. And while this is being processed, I can go back here actually back here and make sure to verify my hero Quick counts as well . So now I'll set my password and log in. So now I've successful loved into her Roku and Big Bucket 6. 006 Restart the container in Codeanywhere and show the info tab: After not using the I D off code anywhere for a couple of hours or for day or two, the environment shuts down. So to restarted, you can right click here and quick turn on the environment. You can also turn it off. And one important thing once this happens, when the environment gets turned off. You, of course, lose all the times that you had open, including the info tab that has all the links for work to load the project and so on. So you simply right click on your container and click info, and that will give you the information off where you can open your app. Um, so that's a quickly note to keep mind. 7. 007 Adding a public SSH key to Bitbucket: in this video will look at how to create or get the ssh key from code anywhere and connected with big buckets. So we're gonna right click here, Click ASA Sage Terminal. We need to get one level up, so we'll go cd dot dot And here I'll type cat about S S H slash I d Tara say dot Bob. And that's the public key that I need to copy. I'll just copy the whole thing, have close it, and I'll go back to beat bucket, click on the user icon, click bait bucket settings And here I'll click. Ssh keys. I'll add my key based it right here and save a label and click add key. 8. 007b v2 Pushing Codeanywhere code gets rejected because of README on remote: Now that I have my key, I'll go to repositories here and I'll connect on existing repository with this one here, that which we still don't have. So I'll go here right quick as a stage terminal. See the into the simple directory. But inspect. But we've got here. I was slash l A. So we do have the gift folder. So I say Get status, Get in it, get status, get add There's dash all. Let's clear the console And so it's better. Easier to see from the top and I'll go get commit the initial commit clear and now we'll be adding our remote so we'll create our repo repository Name is going to be my rials us. Create repository now I will copy the get shur l but we can clone and pressing the copy button. And now back in code. Anywhere I can run. Get status, get log and I'll type get remote add origin and all based in which shift insert keyboard shortcut the get ssh! You are ill help breast center. Of course, I need to remove this club section, so just stay with get remote at origin and now I'll type kid, push origin Master, That's you. This section right here that says permanently added Beat back it to the list of known hosts works because I've previously connected everything with ssh keys. 9. 007c Fetching remote changes and pushing local repo successfully: All right, so let's try to delete this. Read me file. Well, simply quick Deletes and commits the deletion. Now back in here, I'm gonna go get pulled Origin. Master, this is just a commit message. So all I been w Actually, I need to escape it. Type in set a colon and w Q Writing quit and press. Enter. Now go get long. There's dish one, line five. And here I can see a list of the last five commits, so I'll go get Push. And we have sold our little problem. So back in here, I'll go refresh control of five. And once I refreshed it, it shows all the files that we had in our code anywhere environment. This means that we've got a successful connection between big bucket and code anywhere. 10. 010 installing heroku toolbelt on codeanywhere: in this video will install her Roku tool belt so that we can do a similar kind of integration that we did in the previous videos. That is, we had integration with Big Bucket. And now we're also going to integrate with Hiroko. So let's type W g T dash dash, and this is a letter o not zero https columns last slash tool belt. That Roku, not com slash and still dash a boon to that Stage five s h. And this command will install Hiroko for us. Her local tool belt. That is to be specific. And what Hirooka tube it allows us to do is we can use Roque was cli which basically allows us to work from code anywhere environment and send our updates, updates of our code and up to update store app to Roku as well. What that's going to do is, um, publish way will be able to publish a new, uh on ah Herro cool sub domain. And since we already did connection on named cheap with ah top level domain with hero could that will actually allow us to publish our site on a top level domain 11. 011 Logging into Heroku via toolbelt and running the heroku create command: Now that we have her local tool belt installed, you'll simply type Coro Cool log in and it'll ask us for our credentials. Salt type admin at my rails about us and I'll talk my past for this. Well, now that we've logged in, I'm gonna clear the console so it's easier to read and I'll type Roku create. Now we've got a link to our app. So what's just click here and it'll open in New Window and we've got ah, welcome to our new at message. However, we still need to deploy are apt to Hiroko assault type. Get push, Taroko Master. And this is basically going to sink or files to the heroic ooh environment, of course. Here it says that it failed to install gems by a bumbler because is the test detective sq like three gem, which is not supported on Hiroko. So we're going to have to go in are gen file and make some changes to the way this works. So basically we need to comment out the sq flight gem and real Sunnis toe ads the PG or pose dress Jen, because that's what Hiroko uses. It uses the posters database and not the ask you light database 12. 012 Bundle install without production: now that we've commented out our rescue like jam, um, we'll go right here. An ad production group. So for production, we're gonna be using the posters. Jim, we're gonna file civil, and we're gonna open another. That's a stage terminal. And we're gonna seating so simple, and we're gonna run bundle installed there dash without production and 70 sound gems are now it's told so we can run. Stay well And now we'll g o at that school. Get commit dash pan. Commit messages should always be present tests. Um get push origin master clear And we can get Bush Roku Master. And now our app has been deployed to Roku on this length. So let's wicket to open it. And it says the page you're looking for doesn't exist. However, this is a great message because, as you learn, played wrong. This is actually rials own 404 message 13. 013 Deploying our app to heroku subdomain with custom welcome page: Now we can fix the four for error that we had on our rails page published by Roku. And in order to do that, it would be useful to visit this link right here, getting started with rails created. Welcome page. And as it says right here, ILS five no longer has a static index pasion production, so there won't be any route pages in production, so we'll need to create one. In order to do that will create a welcome controller. So it's simply copy this command right here. Goto our codes and inside are simple directory. Run this. Generate controller Welcome. Next will add an index page in APP Views. Welcome index html R b e r b I will copy this color right here. The reason why we got this air message is because we still need to add another gym toward development and that gem ask you, like, three. We're gonna save our file, go back here and around that command again, which will fix the air now. And I just make sure that everything still works so around bundle stole. So that works as well. I will run file stable. Of course we need to be outside off the terminal in order for the several commands to be available and finally back in here are on. Get add that that's all. Give commit dash Update Sq Lights three and development Get push Origin Master, get Push! Hiroko Master, we can see that our APP successfully deployed. So that's the strategy that be used here by making both our development introduction is different gems and also by running bundling still without production with the flag without production, we avoided old issues with the PG Jim. So we are now sure that this works and it's very important and we can go back to following this instruction right here. So they'll copy this and go to at use. Welcome index html Keilar be so at views. Welcome. Welcome is empty. So well, create file index dot html dot prb where air B means embedded. Ruby, Just in case you weren't familiar with the term. So based that code. Go file, settle back in here. We also need to make real's routes for this section. So go to configure out RB copy fig routes and right here, well based our route. Go file civil back and here We'll go get at that dish. All get commit. Dash Pan update. Welcome Page. Get push Origin Master and get push hero to master. And now at IHS successfully deployed to Roku. So let's go back here fresh and we've got the hello world message with the time stamp. So that shows us that our app was successfully deployed. And now the last thing to do is make sure that it's also deployed on the top level domain off my rails that us