Ruby on Rails by Leila Hofer

CS50 · Beginner ·🛠️ AI Tools & Apps ·10y ago

Key Takeaways

Introduces Ruby on Rails, a web development framework, and discusses its basics, including Model-View-Controller architecture

Full Transcript

[Music] [Applause] [Music] awesome so today um I'm going to be talking about Ruby on Rails so Ruby on Rails is a web framework it's um basically a way to make awesome web apps which a lot of you guys will probably be doing for your final projects so um it's also kind of cool timing because you're currently working in PHP for this current problem set so hopefully a lot of these things um that I'm talking about today will ring some sorts of bells and and um there'll be you know some carryover between the stuff you'll learn today the stuff you're working on the problem sets um all right so um what's on the agenda first we're going to go over a review of MVC model view controller um hopefully you've uh learned about this summon lecture um but it'll be kind of a review of that then we're going to talk a little bit about rails um which uh there are kind of an infinite number of things I could talk about so we're going to go over some of the basic um just what is rails what does it do and a little bit about Ruby too because Ruby on Rails is non-s surprisingly built in a language called Ruby luckily uh Ruby is a lot more intuitive than a lot of the languages you've been working in so hopefully it should be pretty easy to pick up and last we're going to spend some time going over a basic web app um and digging into some code there so this is the official guide to MVC this is what you you'll find on study 50 and lectures um and MVC obviously has three parts so there's the model U persistent storage managing and organizing data you can think about this as your mySQL database and the current problem set um any data files you have there's the view which is the presentation of information the user interface um and uh you can think about these as HTML pages and any of the template Pages you're building on this problem set and the controller which uh handles all of the information kind of passes information between um the databases and the view and you'll think you can think about these as your current PHP files in the in the programs you're writing for problem set 7 um so I'm going to go into an unofficial guide which is inspired actually by last year's Ruby on rail seminar I really liked the way they kind of thought about um model view controller so let's go now into the unofficial guide so we have a couple characters in The unofficial guide there's um our model mateline who is um very very smart knows loves data knows all about data but she's a little bit antisocial and she doesn't usually um interact much with people unless people um unless she's uh you know told to do so next there's our view Vicki who is gorgeous she's absolutely gorgeous but she's not so smart um and lastly there's our controller hopefully all of your controllers will be less nefarious than this controller here but this is our um evil queen Caitlyn who really likes ordering people around but doesn't really like doing things herself um so let's kind of start with an analogy let's say all of our characters work at CVS there kind of two scenarios we can think about for some reason I have scenario 2 scenario one but that's all right we'll start with scenario two so let's say a customer comes up to CVS and Vicki is working in the front um she's the the cashier so the customer asks Vicki for a piece of candy that's you know in CVS there's always that candy lined up in the front row so a customer asks for that candy um what happens well Vicki is doesn't know what to do so she turns around and um asks Caitlyn Caitlyn what do I do this customer just asked for candy Caitlyn our very controlling manager says well the cand is's right there Vicki just give it to them and so Vicki says oh okay good she hands the candy back to the customer that's kind of our first scenario so in this case we're not even dealing with our model this is just say a user went and clicked on the web page um a a link to your web page um the uh the view is stupid it doesn't really know what to do so it has to go to the controller it has to ask what do I do with this information the controller then hands back the appropriate page and the view can display it we now have a second scenario or our scenario one in this case where a customer ask Vicki um the cashier for a cup that's sitting in the back somewhere in um storage now again Vicky says oh my gosh I have no idea what to do she turns to Caitlyn the manager she says Caitlyn I have absolutely no idea what to do they asked for a cup this time what do I do Caitlyn says all right hang on she turns around yells at meline our model she say mateline go get a cup from the back meline says okay okay mateline goes she knows exactly where the cups are she grabs the cup she hands it back to Caitlyn our manager the manager hands it back to Vicki Vicki now can finally present the cup to the user or the customer so in this case it was slightly more complicated we had a couple more parts but basically the idea is pretty similar something happens on the front end the user the customer asks for something The View doesn't know what to do it has to go to the controller the controller tells the view whether um just to hand back a certain amount of data to the user or to go get some data from the back hand it back to the um the view and the view can then present it to the user so I think that's like a useful way of thinking about MVC now that we have kind of that framework in mind um let's talk a little bit about Ruby on Rails so um Ruby itself Ruby the language has a lot less syntax than PHP or C and the things you've been working on you'll see there are a lot fewer semicolons a lot fewer curly bracel is which makes it a lot nicer to work with it reads a lot more like English also Ruby has some pretty fun features called gems which you can think about kind of like libraries in C or the things you include with the hash include up at the top of your files so there are ruby gems for just about everything um there it's a super well documented language and um has lots of people working on it so um if you're thinking about implementing some cool feature try a little Googling and there'll probably be a library for it that has some pre-built in functions um that make whatever you want to do a lot easier and we'll talk a little bit about some that you can use um to enhance the the web app that we're going to talk about a little bit later all right Ruby un rails I said is a framework what is a framework a framework is basically just a default structure it gives you kind of a set of files and a set of procedures for managing data managing um your uh your views and just the general structure of your program so database web service web pages it kind of sets up a big chunk of um of your um project for you and then you can go in and kind of change the things that you want so um that leads to kind of the second big pillar of rails which is convention over configuration so rails um the Ruby on Rails the developers and the community around Ruby on Rails values convention over configuration and what that means is there are kind of um standard procedures and ways of doing things in rails that are generally accepted as the way you should um or the easiest way to going about doing things um and you can see that when we'll actually start generating our app um like I said there kind of a bunch of files that are already built for you um and this is kind of the convention thing it makes it a lot easier to um navigate around your app and find uh uh ways of doing things if there's kind of a set structure kind of a a set of procedures that you normally follow um that said there's still a lot of configuration you can do in rails there's a lot lot of personalization um a lot of big um Twitter's built-in rails there are a bunch of other big companies that use rails so this isn't to say that rails can't do whatever you want it to do it's just that generally there's a set procedure that makes it a lot easier if you follow it um and um there's really good rails documentation I'll point you to a couple other um useful sources later in the presentation but this is just a link to the kind of official ruon rails documentation uh definitely check it out if you're thinking of working in rails all right a little bit about Ruby um we'll kind of do we'll address differences between Ruby and the languages you've been working in more when we get into code examples but this is just kind of a cool thing that Ruby um does which is uh iterating through numbers in an array so if you remember in C what you have to do is you kind have to set up a for Loop and you have to iterate through your array by accessing each element so you have kind of array bracket zero array bracket one array bracket two um in Ruby uh kind of taken care of a lot of that for you so for a for Loop um you can instead use uh dot each so if I have an array numbers and it has five numbers in it and I want to go through every number and print it out I can just say numbers. each do number which sounds a little cryptic at first but basically what's that what that's doing is it's saying I have an array of numbers I want to take each one and instead of saying numbers. Z or numbers bracket 0 numbers bracket one I can just say number and it's going to go through each one and call it number number as it goes through it so then I can just say puts number and the first time through it'll puts the number which is uh one the second time through it'll puts the number which is two second third time through Etc so um this is just uh it's a fairly common Construction in Ruby so I thought I'd just show it to you guys so it's not overwhelming if you find it and the last difference is at the end instead of curly braces we say all right we're done with our for Loop let's um say end and we're telling our program that okay we're done with this set chunk of code um so just a little bit of exposure to different types of syntax in Ruby okay we are going to now just dive straight into an example and spend the next um 40 minutes just kind of uh digging into it going through it explaining things um if you guys are here for the seminar do you want to move up uh into the couches cool awesome and feel free to stop me at any point if you have questions um raise a hand um whatever just shout out okay or actually let's go back here so um I have oops you so I've put a link to all of the code that I've written for this example um on a website called GitHub which if you haven't experience or been to GitHub before is basically just a a place where you can store a lot of code and interact with it um has a lot of cool features but for now that's that's all that's really necessary so um there are two things that you can basically two options for dealing with this code um you can visit uh github.com and for um they kind of instructions that you'll see for how to follow along and build your own app that's the same as um the app in the example code or you can actually download all of the code um and there examples for how to just run it right off the bat if you want um or sorry instructions for how to just run it right off the bat if you want to experiment and just kind of see what it does on your own we'll also be playing around with it some today so um in order to just get a copy of all of the code that's in this repository all you have to do is type this line into your command line um and these slides will be available after so um no worries there so you can just copy this line into your command line it'll make a new folder with all of the example code um or you can download it from the website because it'll be from the cs-50 website because it'll be up there afterwards too um all right let's look at some code okay so this is what the GitHub link looks like if you went to the first link that was just um on the slide just displayed so it tells you um about the app what's in it and then um what's the the four different kind of folders that you'll find um in the app um so let's take a look at um the first folder in the app so to-do list starting out basically what this app is going to do is it's pretty simple it's just going to make a to-do list and on your to-do list you'll be able to add items you'll be able to delete items you'll be able to view individual items edit items and um view oh and see all of the items in your list so fairly simple functionality but kind of this is what rails is best at um well rails is good at a lot of things but this is kind of the the foundation of rails and once you have once you know how to kind of do these four um actions create read edit and Destroy um it's kind of a um I always find destroy like a really violent word I don't know why they just use delete but um anyway the convention is to say destroy so we're going to destroy items um but once you can do these four things basically the world is open to you in web development and um so it should be a useful example all right so um actually first I'm just going to show you what this um in practice what this this to-do list is going to do so um and I'll explain so if we go to I always forget this exact Syntax for starting a rail server but that's why I wrote it down all right so this is just starting a server you guys are all doing something similar on the problem sets not this exact syntax we'll go into it a little more later um okay so this is what the final app is going to do um we are going to be Welcome to our site we can view it to um we can view our to-do list right now it's empty so we can add an item let's say um go to CS 50 seminar today save item all right so now we're seeing exactly what we just wrote makes sense and then we can um edit it if we want or we can just go back back to the to-do list and now we see um the item is go to cs50 today or sorry they to make it a little clearer we could add a little break here but go to or here go to cs50 seminar the text is today we can also delete this item um and now our to-do list is empty um so again pretty basic there's some um I'm not sure if this year there's a seminar on bootstrap but if you want to make your sites beautiful you can use things like HTML CSS and bootstrap um definitely view view those seminars if you're interested in making prettier but we're working on functionality today all right so let's get started um so if you go to again from this homepage on GitHub you can say um list starting out and this will walk you through just the basic setting up your framework in rails um starting your server and um kind of getting something to display on the screen so this is just the basic setup um so uh making a new rails project is really easy all you have to do um since it's pre-installed on the the IDE is type rails new and then your project name um and that's going to generate a whole bunch of folders as you can see if I go to to-do list starting out um we have it can be kind of overwhelming because there's just a ton of stuff that just appears um luckily you don't have to deal with too me too much of it um especially when you're starting out and just building basic web apps the main folder you'll be concerned with is this app folder um and you can see in this app folder we have um oh sorry I was covering the mic um we have a couple things that already look familiar so we have um models views and controllers so you can guess where the different code for models views and controllers are going to go and it's probably going to be in the appropriate folders um so the first thing uh we want to do is basically we just want to make something appear on the screen we just want to um in this section we just want to like welcome someone who comes to the screen uh comes to our homepage just say hello so the way you do that is um you can generate a controller really easily in rails right now we don't have any controllers or if if you've just gotten this far you won't have any controllers if you go to your um controllers folder um all it will have is this application controller which is just telling you um it's kind of um you can do some kind of Base configuration in your application controller but it's not going to tell your app what to do if someone clicks on a specific web page um so the way that you set that up is you um there's a line you can run in rails um which basically just says generate a controller make me a file that's going to help me um perform the functionality that I need on this website and um in this particular one we're making a welcome controller because all it's going to do is welcome users to the page um and so you generally want to name your controller something that makes sense for the functionality it's going to perform and um within that welcome controller we want to have um kind of an index action now if you remember from your server problem set um one of the things you had to uh do was check to see if a user went to a homepage without um so if they just went to a directory you had to check for index.html or index.php that's because by convention kind of homepages um are called index in web development so you can think of index do anything really as a homepage so we're going to say um we want to be able to handle requests to this homepage um and we want to have um an action within our controller that can deal with that so what does that look like well once you run this line of code you're going to get a welcome controller and within that welcome controller it defines um a method index and that's all it does it just says it exists and that's because we don't really need any fancy functionality when the people want to go to our homepage we just want to show them the page so we just need to tell our controller all right this action exists this page exists don't freak out when you get here um and um just show us this index page um which is all well and good except we haven't made an index page yet so um that goes to the next thing we have to do which is um once you've set up your controller in step three you have to go to the Views because although you've told your app what to do when they go to the index page you haven't made an index page um and um all of our views like I said before are going to be stored in this views folder and as you can see we already have a welcome folder that was generated by our when we generated our controller it assumed you're probably going to want to show people um views with the various things you want to do in this controller so we're going to make a folder for you that's related to this controller that you made um and it's going to be called Welcome because your controller was called welcome and you can put in any Pages you want here um so like I said we want an index page we want a homepage um so um we can um create this index page it won't be here um originally when you first typed this so you'll have to make it um and you want it to be called index. html.erb um because uh that's kind of the rail's way of saying this is a rails um view page so instead of just index.html convention is index. html.erb um and you can put whatever you want on this homepage right now all I've said is hello um so that means what happens let's see this in action let's stop our server from our um final to-do list uh go to our starting out to-do list and start the server again maybe let's see here we go okay so now our server should be running and it's going to be serving us um this basic um just starting out page so when we visit the homepage remember we've um oh sorry um there's kind of one other important area that you need to uh kind of configure when you're starting out your rails app so um we've told the controller what to expect when um we get past um this uh information but we haven't actually configured the routes of our web app yet so um basically we need to make sure that the controller gets pass the right information at the right time so how does our web app even know that when we go to the homepage it should tell the the controller the welcome controller to be okay with the index page and then trigger the index page um right now if we went to our homepage um our app doesn't really know that it's supposed to talk to the welcome controller at all so the last thing um kind of um important area to um edit when you're setting up an app is routes um and that's in config routes.rb um and I believe I let's see yep okay um so I do have that correct in my directions on this getting started page so if you're following along with that that should be um easily uh discovered so um the one thing we have to do is we have to say um in when you first arrive at this page this line will be commented out because um there are a lot of comments again this is kind of just part of when rails gets generated it puts a whole bunch of stuff in here it has all this stuff commented out um because um You probably don't need it originally but this is all kind of stuff that a lot of people tend to use so you can delete all of this if you want but um you'll find some of the things you might want to uncomment at various points just because they tend to be useful so this is something that rails just sets up for you um so this will be a line that's commented out um but you can uncomment um and what this line says is all right if the user goes to the rout goes to our homepage we want to trigger the welcome controllers index method and that's how this all ties together user goes to the homepage in routes you set it up so that um that will trigger the welcome controller that'll go to the welcome controller which will then say all right um index I want to call index. html.erb and give that back to the user seems kind of convoluted um but you'll start to see a kind of pattern when we um a pattern of um we have to do something with the routes we have to do something with controller we have to do something with the views um and then later in We'll add in okay um once we have all our routes views controller model controller views controller model controller views um so that's kind of a a pattern you'll start to see ask question yeah go for it two one is that I notic you restarted the server after you put in index then does that mean that every time you change some code you need to restart it so um it often times especially if you're just kind of changing around views um you just need to refresh the page sometimes if you make some major change um it'll um you'll need to restart the server generally if something isn't showing up that you think it should just restart the server and often it'll come up yeah um usually yeah basically usually I just restart the server if I run into some sort of issue okay and second question is you know since as you said cre AED process to index page now I assume there's a lot of things that makes it powerful and versatile I haven't seen that part yet right you know yeah so go ahead reate his question oh sorry um so the the first question was um I restarted the server and why did I do that at that particular time um the specific reason for that one is because I was actually changing folders and so I had to um restart it for the correct app um but uh usually you just have to restart the server if you make big changes um the second question is this does seem really convoluted why is it so complicated to make just a single web page appear and where is the power of rails so basically um the power of rails is going to come in one of the the next thing I'm going to show you basically so although this does seem convoluted and especially compared to your problem sets it's actually a lot more convoluted in almost any other um framework cs50 has kind of taken care of a lot of this backend for you when they've generated the um code for your um cs-50 Finance so a lot of this has just gone under the hood in what you're working in because they wanted you guys to focus on model view controller just those aspects because that's kind of that is the base of web development and it's really important to understand that stuff and how it fits together um however there's a lot of stuff under the hood that has to go in before you can even get to model view controller so that's kind of what you're seeing here um and really um if you look um Step by Step at the directions it actually only is about four steps you have to um generate the the framework so just type you know rails new you have to generate a controller you have to generate an index and then you have to create a route so um it's it's really only editing four files um and uh a lot of the setup is done for you so it's also seems more convoluted because it's taken a lot more time since I've tried to explain the various steps and why they happen um so if you think about it only as those those four steps it um seems less convoluted and also what I'm about to show you um is kind of part of the reason why people love rails so much okay so let's just first see this um page that we've worked so hard to create hello all right very underwhelming um okay let's continue um so uh after the second part after to-do list starting out is to-do list with items so if it's going to be a to-do list probably needs some you know items in the to-do list so um the first thing we have to do again uh or one of the first things to do is to make a series of routes because um you're probably going to want a page where you can make new items you're probably going to want a page where you can see the individual items you're probably going to want a page um where you can edit the items um and then um uh obviously deleting is uh you're you might not want a page for that but you're going to want to be able to um kind of click on something to delete items and have that information available so um this is um a really useful thing that that rails does so if we go into the next folder which is with items uh we can see in our routes again um let see config routes we've added something new so before we just uncommented this route welcome index um and that was again saying if you go to the homepage go to the welcome controller go to the index page now we have this uh kind of three extra live they look a little cryptic it's kind of unclear what they're doing um but basically this is creating a rails resource and a resource is kind of just a set um of instructions um and um procedures relating to um kind of a specific uh a specific kind of H sorry let me rephrase this um a resource is a set of procedures relating to some construct that you'll want to have so in our case it's items we want to have items we want to do a bunch of things to them and so um what this uh couple lines does is it says um we want to be able to have a bunch of paths that we can go to to do different things with our items and it creates all these paths for us so um one way of demonstrating that is if we go to let's stop our server so I can use the terminal rake routes what this command does is it um I am still in starting out um but this is we can start with this actually so as you can see this showed us that we have um we can go to our homepage and that will trigger the welcome controllers index um method but we can also go to welcome index and that will do the same thing so this is two different routes that you can type in um in order to get to the same kind of homepage um so this is showing us all our available routes in our start starting out app now if we go to our um new app that has items in it so too app with items and then we run rake routes again so to show us all the available routes that the user can type in now we have a bunch more and all we've done is added those couple lines in our routes but now um we can go to um items SL items from our rout and we'll see um the index page in the items controller or will trigger the IND the index action in the items controller we have new we have edit we have um let's see uh Delete so this has created a bunch of available routes now we haven't made our index controller yet so we haven't actually made um any valid we haven't made these actions valid um but now we don't have to add a different line in our routes controller for every single one of these um actions or not in our routes controller in our routes file um the system generates that automatically the system generates this automatically for you all you have to do is edit your um your routes. RB um so um already we're seeing kind of one of the perks of rails it does all this for us um and now all we have to do like we did before is edit our controller so it can handle all of these different paths that the user may want to take and edit our views so that we have files that the controller can call um okay okay um let's go to um uh think we want to edit our controller right that's exactly what I just said okay um or make a controller so you'll see right now um I've uh have a new controller called items controller and I generated that very similarly um to the way that I generated the previous controller so um if you go through the instructions in the part two with items um you'll see that um after you edit the routes um you make a new controller and um if you remember this syntax from the previous example great if not fine um bin rails generate controller items this is a little different because we didn't say Index right after because we just want to generate a blank controller because we'll be doing a lot of um configuration within this controller so we didn't want to preset index method in it just um on the start but that's a pretty small difference basically it's exactly the same we're making a controller so that we can handle any request to deal with items and um that will also make a file in our views to deal with controllers or to deal with items um can I get a gauge how are how are people doing it's a lot of information is it generally making sense are there things that are just absolutely way too confusing that I should go over the purpose of something doing okay okay all right we'll go on then all right we've made an items controller we want to deal with items what do we want to do with our items well we want to be able to make new items and we want to be able to um create items these seem kind of similar what's the difference well um we there are a couple different ways that you can Channel information into a controller um one is through get requests so through URLs and we already saw that if we went to slash welcome index we got our welcome controllers index page that was information channeled to the controller through a get request there are also post requests though um and um that's uh if you submit a form online there's still information that gets sent back and forth to the controller but it doesn't necessarily go through the URL so there are a couple different things we can do um with these items we need a page to go to where we can type in the information we want for the new item in our to-do list but we also need to be able to handle once we click enter what happens with this um information that we've typed in so that's kind of the general purpose of new and create new tends to be a page that you'll visit um it's information that gets passed to the controller through a URL um so when you go to Slash new um the your routes are set up to handle that as um information that will get passed to the items controller and then you'll kind of render a page that shows a form that the user can type in information but then there's create um so once you type in your information and press submit um create tends to be the action that will actually take that information that you've entered and do something with it um so that's the distinction between those two which can be originally confusing so all that our um create method does right now is render plane pams item inspect all that means is is take the information you got relating to item um this item that we you know typed in information for and we'll show you how that works in a moment um and just show it to me so um after you type in information on this new page show me what you typed in on the next page um and we can see that in action let's let me close some of these so it gets less cluttered um let's let's go oh we're in with items so let's start our server all right I've just gone to item SL new this is telling um because of the way we set up our routes in config um this uh path is set up to um give information to the items controller and um the specifically the new action within the items controller so um if you remember all that said it was deaf new end so um that's just going to try and find um new. html.erb the um HTML page that relates to um the action that we're looking for and I'll show you that page in a moment but as you can see it just says make a form basically that's what that page does we can type in another thing so new new item and made to day again we're going to save it and we see all that our create action does is print it out to the screen right now um eventually um in the next section we're going to put it into a database um but for now we can see we were able to take that information and handle it um and so again this is still kind of underwhelming um but at least we now can kind of uh start dealing with data so what does our new page look like what does the HTML look like on that page um so again you'd kind of expect that to be in views because it's dealing with information that actually gets displayed on the screen and when we generated our items controller that made a handy folder for us um in views that relates to items and I made this new. html.erb page um so this is another reason why rails is awesome it's really easy to submit um and kind of transfer data um dealing with resources that you make in routes so all we have to do um in order to um tell the app that this is information about our to-do list items is say form for item that's it and then we're just telling it what URL to direct to um after we're done um submitting the form and it's um items path um and we can look at what that is in a second but for now let's just go on to the form um so if you remember from when I was talking about Ruby for Loops uh it was array. each do number and then every time we went through um the loop it did something to uh or it printed out the next number in the list um this is a similar syntax doing something slightly different um it's saying um basically all it's um saying is I want to uh relate this form to um it's giving all right sorry let me rephrase again again um it's uh relating the form um items so these things we see uh to this form that we've made for our item so it's just a way of kind of tying everything together I'm not going to go into it in too much detail but basically um what we've done is we're saying for this form that we've made for this item we want to have a title field um and um the label will be title uh the um and it'll be a text field and this um all that this syntax is doing is kind of generating h H ml you'll see it doesn't look like HTML um mostly because of these kind of weird symbols on either end of the text and what that's saying is we are going to want Ruby code or we're going to want HTML eventually but we want to use some Ruby to generate that HTML um and so this is just sticking Ruby code into HTML um so we can see this is plain HTML H1 new item close H1 that looks familiar that stuff um we've seen in lecture we can see these P tags that also look pretty familiar um but the um form itself is the HTML is mainly generated by Ruby code that you've stuck in there um and you can see actually why don't we do this let's um I think we can do this in the IDE okay um yeah so this may be small yeah this is probably too small but what you can do on your own is you can um in inspect the HTML of a page by right clicking and then clicking inspect element and you can see the actual HTML that our Ruby code built and you'll see there is a form tag there's a label tag um there's a bunch of um a text field tag and so you'll see kind of the results of this HTML that we created using Ruby which is kind of cool um all right and I believe that's it for just making a new item and showing it on the screen um any questions now before we get into our last chunk which is dealing with databases no okay cool um and as you saw again just it actually really only took a couple steps took generating generating a controller adding a new and create action so that the controller could deal with um requests for items SL new and so that the controller could deal with um information that came in after a submit of this um uh data relating to our item um and then making the form so pretty simple actually um even though again it seemed like a lot of steps you already create a model for items no so we don't have a model yet um right now all we have is this kind of rails construct a resource um that uh really can take any shape so what we're about to do is make a model um so that we can put this resource um this you know an item into a database with a set structure um so the way that um creating models work in rails let me go to the next so to-do list with MVC is part three of three um so the way you create a model in rails is again pretty pretty easy it's kind of a oneline thing um you say rails generate model similar to rails generate controller um you give it a name we're going to call it item um and just Again by convention you usually capitalize and and um don't pluralize the names of models um you can call them whatever you want but just by convention um and so it's makes your code more readable by others generally this is the convention um and then you tell it basically what columns do you want in your database um for this particular model so we're saying we want a title column and that's going to hold strings um which uh not surprisingly is similar to the string data type that you were with um that cs50 Library implemented it's just you know a set of characters um and we're going to implement um a we're going to have a notes column so we're going to have items and then notes about those items and that's just going to be a bunch of text so similar to string but just gives you more space so um you can think about this as setting up the structure of a database this hasn't actually made a table yet all this does is says I'm going to make a file um that that's going to uh basically be able to be uh made into a database once you kind of confirm that everything's okay so if you run this it makes a file with a really long name um it's going to be in the database folder in the migrate folder and it's going to have a bunch of numbers and then say create this is a typo it should be items um but it's going to look something like this this is the format that it'll look like so it's just like a bunch of numbers and then create and then whatever your um your model name is um and if we go to that if we go to that file um it won't be in this one it'll be in the mvc1 if we go to that file migrate we can say that um we can see that um this file is now set up to create a table with um a string uh column called title and a text column called notes so we're all set up to make our database we haven't yet um but we're set up to do it um and then in order to make it luckily this is all set up for you on the IDE um but basically rails by default uses a database called SQL light um often uh when you push to production mode you'll want to switch to different databases but for the sake of this final project and um honestly for uh just small web apps in general SQL Li is fine um and it has the word SQL in it so not surprisingly it's kind of similar to the MySQL um databases you're using it's kind of like a um a lighter version of it uh but um another beauty of Ruby is that you don't actually have to deal with any sequel whatsoever Ruby deals with all of those um I think you've seen you've probably seen at this point kind of um insert table at and you have you know a bunch of just these long SQL commands Ruby does that for you which is amazing or sorry not Ruby rails does that for you um which is awesome so you don't have to deal with any SQL when you're dealing with Ruby um so we have this file um which we don't need to edit because we already set it up when we said rails generate controller and we gave it the types and now we can create this database and the way you do that is by running the command rake DB migrate and that says um basically actually make this table with these columns this setup um that I can now insert data into um and um you've at this point you've made your table and it's ready to be um you know queried in any way you want um so uh not surprisingly we have you know a database but we don't really know what to do with it where do you think we go which which of our MVC um tells us what we're going to do with information controllers yeah so we're going to go back to to our controller in order to set up um a way to actually put data into the database and take data out of the database um and we don't have to make a new controller this time because this is all still dealing with our items right we're putting items in we're taking items out so it's still in our items controller um and we can see let's go to app controllers items controller um this is in okay um there are a lot of changes um but the important ones are we have a show um which uh now accesses this item model that we made so remember we called our model item with a capital I um and this is basically taking care of a SQL command for you this is saying go to the database get out an item with the specific ID um that I'm looking for and it knows which ID you're looking for um um by uh way of um passing data in through the view which I'll show you later um and um we're also now instead of our create looks a little different we um are now again dealing with a SQL command we're saying put this new item into the database and this is um this is basically just for security reasons we have a private um uh a private method that just kind of takes care of making sure um inserts and um inserting and taking things out of the databas is done safely so you don't really have to know too much about that um but it's just kind of a security thing um and um we have we're going to save an item to the database um and then redirect to uh the show page so this is kind of a lot of to take in I think I'm going to stop here um and um just kind of pause talk a little bit more about generally the structure that we've seen um and a couple key takeaways and um I think that you'll find if you follow through the instructions on the GitHub page um this was a lot of information just like thrown at you it's a whole new framework um but I think uh if it really boils down to like a couple key steps um like I mentioned before um setting up the web app is four steps um you we went over them before they're laid out um pretty clearly in the getting started page um and basically any action you want to implement is kind of Max three or four steps you usually have to add some item into the controller in order to tell um the app how to handle uh kind of a certain uh set of information that gets passed to it and you have to um edit a view in order to tell your web app what to do with that information um what that it gets passed from the controller um and then dealing with the model um I think uh again there are a couple key syntax things this is basically the at items is kind of like a global variable you can pass it into your view um which is pretty cool so if I go to my views for these things um for these things that was very specific if I go to my view for let's say um items index you can see that I can access this items variable if I use Ruby code so what that did in the controller is it says I want to make um a global items variable and what I'm going to do with it is this SQL command I'm going to go um into my table get all of the items and put them all into this items variable and then in my view I'm going to use this items variable which just has a big list of all of the items um and this is the for Loop syntax we talked about earlier for each of them I'm going to print out the title um and the notes about them so this is super convenient um accessing um if you'll notice a SQL command two words instead of you know however many 15 and a global variable all you have to do is say at items um so um there um this is a really easy way of passing information back and forth from the model view and controller if you'll notice all three of those um are um all three parts are accessed in these like very simple three lines this is saying go to the model or go to the database get out data um this is saying pass it into the view um so I think I think that example is actually a pretty nice way of demonstrating why rails is so cool um three lines we were able to access our database um get information to our controller and then pass it back to the view um and again you'll see a very similar theme for um all of the rest of the methods you might want to do um you'll see kind of some reference to the database and a way of passing it into the view and then the views are responsible for handling that data in whatever way you want um so um in the final vers again um you um I've added a couple more fields to this controller which allow you to delete and allow you to edit um they have um the edit looks pretty similar to create because it makes sense you'll also want to be kind of putting data back into the database um like you do when you save a new item um delete is a little bit different because um in like um like I mentioned before it doesn't have its own home page that you visit in order to delete an item that'd be kind of annoying if you had to go to item SL delete slash and then you have to tell it you know which specific item to delete so um the delete procedure um is slightly different but still follows the J same general conventions it'll you know have some reference to the database where it goes um in order to find the correct information and delete it and it'll um have some reference back to the view um so that the view knows what to do um so this is Ruby on Rails um I would take a look at the GitHub if you're interested and and um there's a lot of really cool documentation setting up um setting up users is really easy in rails compared to almost anything else there's a gem for it called devis that takes care of um a lot of um authentication issues makes a bunch of um pages and controllers in the background that you just have to kind of set up links to and your sign in sign out functionality is pretty much taken care of um it has cool um visualization features it has really cool um uh basically basically everything um so I would highly recommend using it uh it's super popular these days too but um yeah if you have any questions feel free to email me or stick around I'll be here and thank you so much for coming [Applause]

Original Description

Ruby on rails is an open source web development framework that is one of the most popular frameworks on the web. Rails has a lot to offer, but this seminar will focus on an introduction to rails and how to get a functional website up and running. It will review Model View Controller (MVC – you’ll be learning about this soon!) architecture and how to implement a basic MVC in Rails.
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from CS50 · CS50 · 0 of 60

← Previous Next →
1 Hello, World: Hadi Partovi
Hello, World: Hadi Partovi
CS50
2 Content Distribution and Archival in a Digital Age
Content Distribution and Archival in a Digital Age
CS50
3 CS50 2014 - Week 1
CS50 2014 - Week 1
CS50
4 CS50 2014 - Week 3
CS50 2014 - Week 3
CS50
5 CS50 2014 - Week 0, continued
CS50 2014 - Week 0, continued
CS50
6 CS50 2014 - Week 4
CS50 2014 - Week 4
CS50
7 Week 3, continued
Week 3, continued
CS50
8 Quiz 0 Review
Quiz 0 Review
CS50
9 CS50 2014 - Week 3, continued
CS50 2014 - Week 3, continued
CS50
10 CS50 2014 - Week 7
CS50 2014 - Week 7
CS50
11 CS50 2014 - Week 7, continued
CS50 2014 - Week 7, continued
CS50
12 Breaking Through The (Google) Glass Ceiling by Christopher Bartholomew
Breaking Through The (Google) Glass Ceiling by Christopher Bartholomew
CS50
13 Introduction to Amazon Web Services by Leo Zhadanovsky
Introduction to Amazon Web Services by Leo Zhadanovsky
CS50
14 CS50 2014 - Week 9
CS50 2014 - Week 9
CS50
15 How to Build Innovative Technologies by Abby Fichtner
How to Build Innovative Technologies by Abby Fichtner
CS50
16 Light Your World (with Hue Bulbs) by Dan Bradley
Light Your World (with Hue Bulbs) by Dan Bradley
CS50
17 Building Dynamic Web Apps with Laravel by Eric Ouyang
Building Dynamic Web Apps with Laravel by Eric Ouyang
CS50
18 CS50 2014 - CS50 Lecture by Steve Ballmer
CS50 2014 - CS50 Lecture by Steve Ballmer
CS50
19 CS50 2014 - Week 10
CS50 2014 - Week 10
CS50
20 This is CS50 with Steve Ballmer?
This is CS50 with Steve Ballmer?
CS50
21 Meteor: a better way to build apps by Roger Zurawicki
Meteor: a better way to build apps by Roger Zurawicki
CS50
22 Data Analysis in R by Dustin Tran
Data Analysis in R by Dustin Tran
CS50
23 Data Visualization and D3 by David Chouinard
Data Visualization and D3 by David Chouinard
CS50
24 CS50 2014 - Week 6
CS50 2014 - Week 6
CS50
25 Build Tomorrow's Library by Jeffrey Licht
Build Tomorrow's Library by Jeffrey Licht
CS50
26 CS50 2014 - Week 9, continued
CS50 2014 - Week 9, continued
CS50
27 Essential Scale-Out Computing by James Cuff
Essential Scale-Out Computing by James Cuff
CS50
28 iOS App Development with Swift by Dan Armendariz
iOS App Development with Swift by Dan Armendariz
CS50
29 Sam Clark Leads Yale Students on Tour to CS50 at Harvard
Sam Clark Leads Yale Students on Tour to CS50 at Harvard
CS50
30 3D Modeling and Manufacture by Ansel Duff
3D Modeling and Manufacture by Ansel Duff
CS50
31 CS50 2014 - Week 5, continued
CS50 2014 - Week 5, continued
CS50
32 hello, world
hello, world
CS50
33 CS50 2014 - Deep Thoughts - Hash Table
CS50 2014 - Deep Thoughts - Hash Table
CS50
34 CS50 2014 - Deep Thoughts - Binary Tree
CS50 2014 - Deep Thoughts - Binary Tree
CS50
35 CS50 2014 - Deep Thoughts - Scratch
CS50 2014 - Deep Thoughts - Scratch
CS50
36 CS50 2014 - Deep Thoughts - MySQL
CS50 2014 - Deep Thoughts - MySQL
CS50
37 LaunchCode Visits CS50
LaunchCode Visits CS50
CS50
38 CS50 Live, Episode 100
CS50 Live, Episode 100
CS50
39 CS50 Field Trip to Google
CS50 Field Trip to Google
CS50
40 This is CS50 AP
This is CS50 AP
CS50
41 Week 4: Monday - CS50 2011 - Harvard University
Week 4: Monday - CS50 2011 - Harvard University
CS50
42 Week 2: Wednesday - CS50 2011 - Harvard University
Week 2: Wednesday - CS50 2011 - Harvard University
CS50
43 Week 1: Wednesday - CS50 2011 - Harvard University
Week 1: Wednesday - CS50 2011 - Harvard University
CS50
44 Week 11: Monday - CS50 2011 - Harvard University
Week 11: Monday - CS50 2011 - Harvard University
CS50
45 Week 3: Wednesday - CS50 2011 - Harvard University
Week 3: Wednesday - CS50 2011 - Harvard University
CS50
46 Week 12: Monday - CS50 2011 - Harvard University
Week 12: Monday - CS50 2011 - Harvard University
CS50
47 Week 1: Friday - CS50 2011 - Harvard University
Week 1: Friday - CS50 2011 - Harvard University
CS50
48 Week 3: Monday - CS50 2011 - Harvard University
Week 3: Monday - CS50 2011 - Harvard University
CS50
49 Week 10: Wednesday - CS50 2011 - Harvard University
Week 10: Wednesday - CS50 2011 - Harvard University
CS50
50 Week 2: Monday - CS50 2011 - Harvard University
Week 2: Monday - CS50 2011 - Harvard University
CS50
51 Week 9: Monday - CS50 2011 - Harvard University
Week 9: Monday - CS50 2011 - Harvard University
CS50
52 Week 7: Monday - CS50 2011 - Harvard University
Week 7: Monday - CS50 2011 - Harvard University
CS50
53 Week 5: Monday - CS50 2011 - Harvard University
Week 5: Monday - CS50 2011 - Harvard University
CS50
54 Week 5: Wednesday - CS50 2011 - Harvard University
Week 5: Wednesday - CS50 2011 - Harvard University
CS50
55 Week 7: Wednesday - CS50 2011 - Harvard University
Week 7: Wednesday - CS50 2011 - Harvard University
CS50
56 Week 8: Monday - CS50 2011 - Harvard University
Week 8: Monday - CS50 2011 - Harvard University
CS50
57 Week 9: Wednesday - CS50 2011 - Harvard University
Week 9: Wednesday - CS50 2011 - Harvard University
CS50
58 Week 8: Wednesday - CS50 2011 - Harvard University
Week 8: Wednesday - CS50 2011 - Harvard University
CS50
59 Week 10: Monday - CS50 2011 - Harvard University
Week 10: Monday - CS50 2011 - Harvard University
CS50
60 Week 2: Wednesday - CS50 2010 - Harvard University
Week 2: Wednesday - CS50 2010 - Harvard University
CS50

Related Reads

📰
Use a model route manifest before Dify, Cursor, and Node.js share Vector Engine
Learn to reduce inconsistencies in shared API gateways by using a model route manifest with Node.js, Dify, and Cursor
Dev.to AI
📰
What 90 Days of Comments on AI Side Panels Taught Me About Distribution
Analyzing 90 days of comments on AI side panels reveals key insights on distribution and user engagement
Dev.to · AI Buddy
📰
Claude vs ChatGPT for Small Business (2026): The Real Numbers Behind the Quiet Takeover
Compare Claude and ChatGPT for small business productivity, with a focus on AI workflows that save time
Medium · AI
📰
AI Builds the Website in Minutes. So What Are You Actually Charging For?
Learn how AI is revolutionizing website production and challenging traditional hourly pricing models, and why you need to adapt your pricing strategy to remain competitive
Medium · AI
Up next
How to Create a Landing Page in Systeme.io: Full Tutorial
LoverFighterWriter
Watch →