- Read Tutorial
- Watch Guide Video
Welcome back to the course. Let's go ahead and get this up on Github and Heroku.
Open up github and heroku. Okay, so on Github.com let's just take it a little bit slowly, and not go too fast. I'll just wait for you to get that up, and now let's hit start project.
I'm just going to call this schedule, and then for the description I'm going to say Course Schedule App. I'm going to create this is as a public repository and I'm going to put the owner on bottega-code-school, but you are going to leave the owner to yourself.
I'm creating this so you can reference this, and use it as you build this appliation or if you want to look at my source code. I'm going to leave the commit in each video. Copy the link, and but then we're not just going to paste it in this time. I'm just going to type it out so you can get the hang of it. So copy the link up here.
Go to your terminal and put in git remote add origin and then paste that link in. Now if you say git remote get-url origin. It will show you the URL.
Now what we want to do is say git status. We already committed everything. So all we need to do is push it, so enter in git push origin master.
Cool, so now let's go ahead and look back at Github, and then reload the page. You'll see there is a potential security vulnerability, but just hit dismiss and select risk is tolerable to this project.
Now that's on Github, let's go ahead and close this out and put it on Heroku now. I'm going to create a new project, Hit create new app. I assume you already have Heroku installed at this point.
I'm going to call the scheduler bottegascheduler. Hit Create app and name it something that is not taken.
Make sure that you are logged in. I assume that you have gone through all this. So all that we need to run is heroku git:remote - a name. So copy that link and head over to the terminal, and paste it in.
Now all we have to do is push up to Heroku, so let's say git remote. You'll see that we have two remotes: heroku and origin. Origin is our github, and heroku is our heroku. So let's say git push heroku.
So that's just going to take a second, I'll just wait for it to complete and then we'll navigate to it to make sure it's working. Let's just go to a sticky note and I'm going to close out of this real quick. While that's pushing let's go to our sticky note, and just think about what we first want to do. In the next video, what we want to do is: basically build our grid(our CSS grid), and then we want to create two components, the library and scheduler. They are just going to be blank components, and then we will throw those onto our grid. Let's see if that is done pushing...looks like it's still taking a second. So let's just write a couple things out here. Build Grid, Build Schedule and Library, and Lay them out.
Now when you're planning things out, what I recommend you do is use a tool like Pivotal Tracker. Now I use sticky notes because it's a small personal project. If you're working on a team or even just with one other person, using a tool like Pivotal Tracker, is highly recommendeded. Since you're just building out applications for the first time, we are just going to write things on sticky notes, and refer to the trouble board which will really help us. Let's go ahead and check if this is in our Heroku App. Go ahead and hit Open App. You will see that it is live on the internet.
So go ahead and visit this on any other computer or your phone or whatever, a tablet, and you will see the same thing. Which is really awesome, it is really neat. It is on the internet and acsessible to anyone in the world. Let's close that out, and close out Heroku, and let's close out Thinking in React, so we just have our design, touble board, and course scheduler. You don't have the trouble board, but we have these two tabs. In the next video we're going to set up a grid in layout our two first components. See you then.