Benjamin Wood - 15 years later; How to build a blog in 15 minutes with Rails

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
welcome everyone all right so there are no slides for the sokka's we're gonna have a coding a live coding adventure together the premise of my talk is how to create a blog using Ruby on Rails and 15 minutes and we're not actually in Newton 15 minutes because this talk is supposed to be closer to 40 minutes and length and we'll be doing some explaining but the idea is is that is that if you sat down and you were just writing this code that you probably could build it in 15 minutes in the original talk it actually was 15 minutes and length but I intend to do a little bit more explaining tonight given that when we announced us I said no experience necessary and I gave this talk for my wife last night as she was like hey you should practice rehearsing this she's like okay so you said no experience necessary so like what is rails and I'm like okay well I said no experience necessary but like you know the folks that will be there will have a premise of kind of the basics of web and such so this this talk is is definitely geared towards folks that maybe don't have experience with Ruby or have experience with rails but have some surrounding knowledge with web development and things of that nature also one more disclaimer is that the kind of code that I'll be writing tonight is what I would consider maybe prototyping code so this is not necessarily code that you should think okay this is how exactly I'm going to write my code I think the goal of the talk is to inspire folks that maybe are beginning and interested and so we're not going to get too hung up on writing things in a super verbose way okay so with that let's get started first thing I'm going to do to see if I can take over the screen so give me a moment all right cool there we go all right so when DHH originally gave this talk he said something when whenever something happened that you were supposed to be surprised about he said whoops does anybody remember that this thing it was like like he I think maybe he coined it or somebody else did later but they called it the whoops video so I'm gonna try to remember to say whoops every once in a while as we go through this together pull up some notes okay so you can see I have my terminal on the right and I have a browser on the left I'm gonna try to keep things and one space here so we're not switching around too much I've done very little setup for this so far so I'm actually gonna start by going into my project directory here this is where I keep my personal things Benjamin wood and the first thing that you would do is you would gem install rails this assumes that you already have Ruby installed on your machine and ruby gems and that's kind of outside of the scope of this discussion I'm actually already have installed authorities again we're gonna be working with the latest version of rails which is rails 6 also if I Ruby - B we can see we're on Ruby 2.7 okay all right so the first thing that you would do when you're starting a rails project is you would say rails new and if you don't know what you're doing with it you'd probably say something like this you'd say help we won't go through all the options because this is a bit overwhelming I suppose but basically rails new is a command that you would run like such you can see rails new app path and then options you can you can customize things about the new rails project that it starts if we go down towards the bottom you can see there's a nice example here called rails new and it gives a path to a blog - or a weblog I should say web blog I guess that's how you pronounce it we're gonna do it similarly rails new we're going to say blog and I'm gonna give it two options one is to skip the the actual bundle which is basically going to stall other dependant libraries gems as we call them I already have them installed so it's just gonna save us a little bit time and the other is I'm gonna skip installing tests not because we're not going to do tests hopefully we'll have time for it but we're going to use our spec for it which is another tool that is not installed by default so already done creating most of the files what doing now is it's doing JavaScript things which is why it takes so long that's about that's a burn sorry yeah it's actually just installing web web pack things and downloading dependencies and such but it's done already great so now we're going to CD into our blog directory and I'm gonna open up a editor so we can look at it that's probably true just not the execution of JavaScript but the tooling maybe okay let's see I'm going to open up a yeah great whoops okay hold on all right I don't accidentally just close my editor so hold on a moment let's do this recent and block great okay so I'm using vs code which you may or may not be familiar with and I'm going to open up a terminal here and we're in the blog directory here the first thing I'm gonna do before doing anything else is I'm going to start up a rail server so we can see what we have without doing anything else at all other than just installing rails and going into the directory and saying rails s s is short for server you can type real server same command you can see that by default we are yeah here's what it says so this is this is what localhost actually is okay this IP address here port 3000 I'm just gonna go to localhost here localhost port 3000 and you can see it says rails yay you're on rails this screen has changed a little bit since 2005 but this is more or less the same experience that DHH described 15 years ago generating a rails project starting a rail server and here we are so we're off to a good start alright the next thing that I want to do is just talk about the folder structure a little bit here it's often said that one of the most difficult things in programming is naming things I think that's definitely true I would say the other one it's just like coming up with a convention for where you put your files which I can't you think is kind of in the same category because you've got so many choices that's one of the things that's nice about Rails is even though a lot of these directories are more or less empty and even a lot of these files are empty they're here for you and a few of those might be like your models directory here your views directory has just a few basic things in it and controllers rails is an MVC framework as anybody unfamiliar with an MVC framework you know what school okay I'll I'll go through it really briefly so Model View controller MVC model these are the objects that represent typically things in your database at least in rails and the view the view layer is the layer where you're actually presenting things to the user they're interfacing with your application typically that's your HTML web forms things of that nature right and then you have your controllers which is kind of a glue that binds them so the thing that sits between your database and your views and how do you render your views and show your information to user and when they submit it like how does that information get back to the database communicate and that's what the controller does so tonight we're gonna be looking in a few of those areas so one of the one of the next things that we want to look at I'm going to stop the server for a moment is the rails generate command let's see here do this okay in fullscreen this so we can see a little better great rails rails gee is short for generate I like using short hand rails G does just help what's that there G is it G is the oh gee I guess okay so scrolls a little fast see slowly okay so you can see the usage of the command here is rails generate and then you specify a generator and you can give some options and arguments there's a number that you can choose from and they're listed here there's a couple that we're going to be looking at tonight one is scaffold and the other is resource a little bit later on if you want to see what the specific options are for a given generator you can say rails G and give it the name of the generator so like scaffold - - help and we can learn a little bit more about what scaffold does okay so I'm not gonna read the entire description but this little first section here gives a good overview of what the scaffold generator does okay so it's Capel it scaffolds an entire resource from model and migration to controller and views along with a full test suite which actually that parts going to get skipped for now the resource is ready to use as a starting point for your restful resource oriented applications and that if it doesn't make sense yet I think we'll make a little bit more sense as we go on again there's some nice examples down here at the bottom and it just so happens that one of the examples that's here is more or less what we what we want so see if I can get up here I'm going to copy the second one notice I'm skipping the published boolean here I'm gonna explain what this does so rails generate scaffold posts so our resource is going to be called post remember we're building a blog so of course the building block first building block of a blog is to have a post and then it has a a title of type string and I'm talking about database type here so it's a database column that is a string type column and then there's a body attribute as well and that is of type text and then of course if we wanted to deal with publish that would just be a boolean is true or false is the article published or not but we're skipping that so with that we run it okay and it generates some files for us which is excellent let's do this let's say rails yes they were yep yep the scaffold command was there was one small difference 15 years ago with scaffold which is that by default the command didn't actually generate all the code that's inside of the controllers and views it was like something that kind of sat behind the scenes you customize if you want now it actually just generates all the code for you just get in there changing it right away which is a little bit more friendly a little bit less magical so actually did something on purpose here which is that I didn't run our migrations a database migration rail rails handles that for us it creates a database migration but doesn't actually run the migration it gives you a chance to look at it and perhaps change it in this case I think we should so let's go take a look at that the folder structure here we have a config direct sorry on untrue a database directory and inside of that there's something called migrate and you can see that we now have one file in there that then it exists before let's look at that so this migration create posts and inside of this class here there's something called change and then there's kind of almost a DSL here where we have create table and the table we're creating is post should make sense right and we talked about our two attributes or columns one is title and body and just like the types that we define the command line right we want to be good developers and we want to add something to these we want to say null false to both of them what this is going to do is it's going to ensure that you that the database restricts you from creating a post that doesn't have a title or that doesn't have a body okay so we added that to it rails actually in recent years this is something that didn't is this 15 years ago is you have a button you can click to run the migrations from your browser which is very nice it might save you a few seconds we'll run migrations the more traditional way in a little bit so here we are back at our home page and what happens if we just without doing anything else go to posts and whoops there it is okay I said it so we have a posts index view and from here we have a button where we can click new post and we can say you can see I've done this before hello Vancouver I like rails we can create a post and voila just like that you can look at our URL up here we have a path that looks like post / one one represents the ID of our post which this is the first post so it gets post one and if we go back we get back to our index view and we now see a listing of posts now I'm going to create one more here and we'll call it hello Portland I'm not terribly original so we're gonna go first in placeholder text and do something just a little bit longer there's anybody else use this resource right here it's pretty great if you don't have a shorter way of getting some there is which I should have used for hello Portland you're right yeah what was I thinking so true yeah that's true I could edit it okay let's do it so what does that hipster yep some did I get that right hipster ipsum beer me okay well we'll just we'll just not read it too closely okay so you guys can see here we have some some hip strips and okay we'll get to look at that and we get to test our edit action as well expand out a little bit paste it in there gluten-free no it's not yeah this it's not very fitting that we have hip strips in here this does not react it's true yep okay so we have our posts but this isn't looking very much like a blog yet would you agree this is this is looking very very boilerplate cred create update and destroy we can do all these things but it doesn't look like a blog yeah so yes exactly it looks like an engineer design this which one did and if we go back into our app directory we're gonna look at a couple of things and then we're going to dive into looking at some views so one is I want to show you that it created a post model here which is empty currently it also created a post controller means that a little bigger and as you can see there's some code in here we're not actually going to take the time right now to look through each action but you can see we have like an index action which we looked at show you and new so this is a restful controller that provides credit basic credit actions okay and if we go down to views we see we now have a nice directory here with views that have been pre-populated for us and that's actually what is is creating what we see here on the left so if we go over to our index index.html ear B we have something a little like this now you may if you've done web development you may look at this and go oh cool I know where we're at this is HTML and it is it's also er B and E are B is the templating language of choice for most rubyists and definitely the default for rails and you can see some of these special little looking tags in here like these guys right here and then inside of that you have just regular old Ruby code it is convention to use helper methods and have a little bit of Ruby code it actually straight in your views but you wouldn't write a lot of Ruby code in your views so like into what you see here is common one of the first things I think we should do is we should take the title which is an h1 and we should call this Ben's block and we see that if we update that and we switch over and hit refresh that we instantly get our change for Ben's block which is great yes you do have to hit refresh however you want to have to hit refresh if we were using webpack and and it was regenerating or bumble for us it would it would refresh yes some JavaScript okay that's that's where you were okay so now we have been blogged and of course the main problem with this blog is that it's a table and nobody's blog is a table in 2020 or in 2005 actually so let's cruise on down here to the the table body and just cut this out of here and let's get rid of all the rest of this stuff because we don't really need it and I'm gonna correct some annotation here and now we're still we're left with you know the meat of the table but there are still some tags in here that we don't want so let's just get rid of these see if I can do this properly I want to delete okay and then let's change this to a div so here yeah I know right come on now okay I'm just gonna type it I see that yeah it's gonna do this okay all right so with that this should render but it's not gonna quite look right yeah but actually it already looks better somehow I think maybe not so I think I think something that would definitely help would be if we took our title and we made it a heading tag so let's wrap this title in an h2 and save it and voila we have nice titles now for each of our posts you can see what this is doing that in I didn't describe it already but you know we have a collection of posts here which is provided by your controller and then we're just iterating over the collection of posts and so inside of this do block which is all this code right here we are dealing with a single post and we have to define our HTML to render it okay we should probably put our post body in a in like a paragraph tag or something like that that's actually it's probably not true but let's just put in a paragraph tag for now for some for some padding given that each of our posts currently have only one paragraph again we're prototyping okay and let's refresh what we got okay that's starting to look pretty good let's go up here beneath the heading to tag and we're gonna use a small tag because that's still a thing in HTML that nobody uses and let's out of created a created that date if we had a published at would probably display like a published date but let's just work with creator oh by the way you may notice I created where that come from that wasn't one of our columns when we created posts rails provides you with a column to store the created date of your object and also when it was last updated I don't mean to be calling this created at was gonna say created I'm gonna insert a new yarby tag here I'm gonna say post dot created at and let's see what that looks like we have it listed there but that's not a very friendly date so we can do a little bit of formatting on that which rails provides us with a shortcut to formatting a date in a way that we can utilize what I say up to s it was mad because I type over there okay so created February 19th and it has a time it's definitely not 3:21 this must be like I don't know yeah it's Linux it's a Linux thing thanks Josh that's true it's it's it's probably you - yes UTC it's absurd its UTC yeah okay so great we have a created a date another thing down here we have this this button for show but if you have a blog you're probably going to like link the title of it or something to actually click on and go to the post right so let's let's go ahead and grab this tag and let's move it up here and let's take our post title delete that tag and replace show with the post title you can see how this works or you might guess oops another editor okay link to is a view helper method that rails provides that creates just a href tag essentially essentially you can have a some text to display for the link and then a URL this obviously is not a URL but rails knows how to take a post and give you the show view for a post and actually will generate the path for us automatically so with that we hit refresh and voila we can now go to each of these like such which I won't click on I'm one final thing I think we should do is let's move these links up to that small tag and let's separate them with a pipe character maybe there we go this is looking this is looking more like a blog already so if we click on one of these like Hello Portland that's a bummer it it displays it but it doesn't use any of the code that we just wrote and we don't want to rewrite the code that we just wrote to display here again wouldn't it be nice if we could take the code we wrote and we could share it with the show view while rails provides a way for us to do that as well using something called a partial so let's look at our post directory here under views and create a new file and we're gonna start with an underscore which is a rails convention for naming partials and we're gonna call it post and the idea here is that we're going to take the code that is for a single post and we're going to use it here we're going to render it in the index view and then we're also going to go use it in the show view which is pretty straightforward to do everything inside of the do block has to do with that signal post so we're just gonna cut it out of there and paste it here what's not twice and fix the indentation and then here we add a tag we say render post and with that if we go back to the index view and refresh if it looks exactly the same then we did the job right because we effectively wanted to change nothing here we were just moving the code to a different location well what's great about this is now we can go to the show view which is right here and if we click on hello Portland you can see how this code maps to what you're seeing on the screen we have like a title body right this these are like strong we're strong tags right let's remove these and let's do a similar thing we're gonna say render this time we're gonna say at post because I'm not iterating over a collection of posts we have the post assigned to an instance variable by the controller so we're working with a single post and that's what that sign means Ruby is this an instance variable and voila that works now in a real blog you probably want to have your index view and your show view be exactly the same but for the purposes of our demonstration today we're just gonna say great this is this is what we want one other thing we could do here is we could remove the Edit action from the show view that's down here see it says edit because we already have edit up here and we don't really need it twice so now we just have a back button okay great so this is good but this is the internet and people like to have a voice so why don't it be great if our blog had the ability to leave comments yes comments I am yes the trolls in the audience they're like yes just let me comment on this and I'm sure they will so this is called remember how when we were looking at generators earlier we said we're gonna look at scaffold and we're also gonna look at resource we did scaffold already to create post and now we're gonna look at the resource generator so let's see here let's close some stuff so we can make this fullscreen again okay rails G resource - - help and we can see what it does so description okay there okay so again the description this is just a little bit different very similar though it stubs out a new resource including an empty model and controller suitable for a restful resource oriented application pass the singular model name either camel case or underscored as the first parameter and an optional list attribute pairs the main difference here between this and scaffold is that as you can see it says it creates an empty model which so they scaffold but also an empty controller so the controller isn't gonna have all the actions filled out and it it's also not going to create all the views which is good because we don't all want we don't want all that stuff for a comment we want to be able to create a comment and maybe if there's a real blog there's other stuff you want to do but at this point we just want to have a forum where you can type something in the box hit create and it's going to display there okay so down here we have some examples again we can kind of follow suit rails G resource this time it's going to be comments and our first attribute is actually going to be post because we want our comments model and therefore our comments database table to have a relationship to post we want a comment to belong to post and this is how you would do that is you would say post and references and what that's going to do is create that it's going to create that relationship for you automatically and we'll go look at the code that does that the other thing we want is a body attribute and this will be of type text this will be what stores the actual comment text so let's run that and it did some stuff for us which is great let's go look at that a little bit just keep that up yes yes you might you might notice that like there's no concept of users or like who's an admin created up a blog article or anything like that you can do all that with rails we're not doing it right now because that would that would take us a little too long I think let's see here so I was going to go to database migrate and now we have another migration and this time we're creating comments you can see that we have something here called references post which it already knows and it defaults to null false which is great this means that you can't create a comment that doesn't belong to a post because that would be invalid in the system also creates apps absolutely yep and actually somebody had asked earlier at dinner if the process had changed much from 2015 to the talking tonight this is one of the areas and we should change which is that in 2005 and I said 2015 earlier in 2005 they didn't have migration so he was actually going to like a like a my sequel like GUI interface and creating tables and stuff so so yeah so rails was matured a bit we have a built-in way to actually make those changes to your database schema right yeah yeah that's true yep okay and then another thing we can see here is it has a foreign key true which is a default which is great which means that you you can't delete a post and end up with a comment that is related to that post that is now invalid because the post doesn't exist even that post idea is referencing something that isn't there anymore so that's what the foreign key does in this case again we're gonna add null false to our body because we don't want people to create empty comments who Steve I'm depressed okay so earlier I'd said that would run migrations another way and the more traditional way and that would be to actually run this from the console and we can do that by saying rails DB : migrate kind of like our generate command there's other commands that rails provides it's not for generating things but it's for executing stuff this is one of them so rails DB migrate should run the migration notice that didn't do anything with the first migration because that one's already done where else keeps track of that which is great it just runs changes new migrations that haven't already been applied to the database we haven't looked at this yet but I think it would be useful if we could go and create a comment that's associated with our post and implement the part that displays the comment in the show view before we actually implement the form to create a new one so let's look at the console we can say rails c c a short for console and if we get our posts we should say like a post at all we can see that we have a collection of posts so this is our first one here is hello Vancouver and if you look a little bit further down the line there there's hello Portland let's look at our post dot last is hello Portland and we can say comments which this actually isn't gonna work because I forgot something which is that we need to go look at the let's look at the comment model first see that it has a relationship here to post belongs to posts so a comment it's it bullet well okay it belongs to a post it's associated with the post right and then the other side of the relationship should be on post and what a post is is it has many comments this is how you express the relationships and in rails world so I guess I guess the diff the differentiator is where the foreign key lives foreign key lives on comments so it belongs to one post a comment can't belong to more than one post however a post can have many comments right you can create obviously create more than one comment so if we come back down to our console and reload and try this again there we go it's empty because no comments exist yet which makes sense right notice what is returned here is an active record associations collection proxy it's not actually just an empty array and what that provides us is the ability to say something like create on the end of here method chaining and here's where we would give the attributes of the comment that we want to create so let's say body is I like your post because everybody's nice on the Internet and sure enough we we see that a comment is returned it has a nice post ID and all that if we look here again at it's anonymous yet post that last comments we got our comment back yes yeah this is a rare occurrence to take a picture everybody okay friendly anonymous that's right yeah that's not rare e right people do that probably from the console yeah okay so with that we're gonna close the models I'm just gonna get back to close that close that mm-hm see here we don't wanna be an index I'm gonna be here this seems right yeah okay so this is our show view and here we have I need to start the server rails s it can it is not automatically right now it can on save or you can you can like hit a key to do it did it seem like it was like just catch one yeah we're not in community I just forget that yeah it's boonies version-control okay yeah it's 2005 did it get even exist okay so so here we are if we say hello we should see this over here we just make sure we're in the right view hello there we are okay great and notice we're not gonna put this in our post partial because we don't want the comments to display on the index P we only want them to display here so we're gonna put them right under where we render the post partial so let's do this let's let's insert a er B tag and it's going to be at post dot each do oops not post up its going to post comments each do comment it's more like it and then an end here and with inside of the block we can define how we want the comment to display so let's just put a div here and let's have a comments body seems pretty reasonable whoops there it is I like your posts so this is great but I I would like it if other people could comment on my blog and not just me saying how much I like my own blog ya know what's the magic that gives us access to comments it was a relationship absolutely yep because nope you actually only need that as many relationship in this case yep anywhere and now that we've added that has many posts or sorry has many comments on the post model anywhere that you have an instance a post you now have comments on it yep yes exactly yeah previously you could say if you had a comment you say comment about post and you can see it but not the other way around so now we have both which is great okay so let's see here let's before we start creating our forum which is definitely the next thing that we want to do let's take a venture over to our routes file we haven't talked about this yet but as you can see there's already a couple of entries in here that relate to things that we've been doing and that's because our generators have created this stuff for us when we created the the post scaffold they've put in resources posts when we created the comment scaffold putting resources comments this is close to what we want but in this in the for the sake of comments at least we actually don't want it just like this it's not equal to posts I'm a comment is something that belongs to post and we want our URLs to reflect that and that's what routes are all about rails actually generates your URLs and maps and do your controller actions so you can have responses and all those sorts of things right and let's do actually not before we do this it'll make more sense if we look at what the routes look like right now yes exactly I'm so glad you asked rails provides the command rails routes mmm well okay that's interesting it must be from zsh running the last command that's really funny I was like it just worked why did it work I don't think so I don't think I don't think I do yeah anyways so this is a lot to read and you can actually see if things are wrapping around funny which makes it hard to read so just kind of disregard this for a second except to make note that hey you can see a full listing of all the routes that rails has created things that relate to stuff that we're not dealing with right now as well but you could learn more about certainly let's take a look though specifically at our routes that relate to a comment as of right now so I'm gonna grep for comment comments actually grep is just a way of saying show me lines that have the occurrence of this string and in comments we can do more with grep but we'll just do this okay great so you can see we have we have routes these this is where it shows the path and then here's the controller and the action that it corresponds to and it has index create new it has all the same stuff that post has which makes sense because if you were to look at the routes file and we just did they're equal like it's the same exact thing for both of them but all we really actually want there's this one right here comments create and we actually want our path to look a little bit different too so I'm gonna make a change to the routes file then we're gonna look at this again which should help make this make a little bit more sense so we're gonna say post du and and we're going to just move the comments resource inside of this block that I just added here for posts we're also going to say only create and we're going to do our command here again and see what we get great so now we have just one route it still goes to the same action which is good because we didn't want to change that but notice that it's now post slash post ID and then comments so when we submit our comments we're going to have to embed what posts that comment is supposed to be associated with in the URL itself which is great and the way restful things should work okay well close wraps for now and let's start working on our web form so rails just like we've seen some helpers like link to it provides other helper - using your view and one of them is form 4 and what do we want to form 4 well we want to form for a comment and specifically we want a form for a comment that belongs to the post that we're working with so we're gonna pass an argument here called post we're gonna say comments dot new so we're just gonna build a comment we're not actually creating one notice we we called create when we were creating one earlier right now we're just saying new which builds an instance of it but does that doesn't actually put it the database and then we're going to give it a URL specifically because it doesn't actually know about how the resource is now nested that we just created we're gonna say post comments path and we're from right here so when you look at your routes one of the pieces of information that it gives you okay goodness gracious right there is it tells you your the names of your route helpers rails provides we route helpers to actually generate your URL so that you don't have to like construct the URLs yourself so post comments path is going to generate the path with the appropriate ID in it because we're passing post to it as the first argument which which part that the method it's a method yeah yep right yep it's a method yes dynamically going to generate based on what argument we pass to it and we're gonna say do in this case we're passing the forum object into the block which we're gonna use in just a moment and we end our block here and we're going to say F dot Texas field no text area and we're going to say body and we're also gonna have a submit button like that and we're gonna put a break tag in the middle because we're not writing CSS oops rails s I'm really impatient apparently I did something wrong and the thing I did wrong is that I didn't can anybody spot it got it hey great so okay yep yeah in a perfect world in a perfect world they would so this should be expected right because we just submitted it but we haven't written our controller action yet it doesn't know what to do with the form that we've submitted and rails is nice enough to give us a nice error and say something like unknown action the action create could not be found in the comments controller so let's go take a look cool so empty controller right we can create a method in here called create to handle this the first thing that we want to do is we want to find the post that this comment is supposed to belong to and what we can do there is we can say post we're going to assign it to a variable or it's a post equals post dot find params post ID I know that in our HTTP parameters I know that it is the the thing that we're after it's called post ID because it said that in the display of routes when we were looking earlier it might not have made note but it was there so we have a post and then this is pretty familiar we know how to create a comment at this point so let's say post comment stop create and this is where normally we would say body and would give us some parameters right it happens that we only have one argument that we're assigning so we're actually just gonna do that it's simple I Rams and this would be comment and this would be body and then we're going to say redirect to redirect to post and we're gonna display notice to this I was like created comments created so rails provides us this ability to display a notice after something happens just to give the user some context about what's going on notice we said we just redirect a post again rails this is kind of some magic it knows what URL to redirect them to one way to say redirect to post it means go to the show view of the post so if we did everything right we can just hit refresh comment created I'm a troll I don't like your post there is all right ladies and gentlemen we're actually we're actually a little bit over time already I had a couple other things that I wanted to show but I think we should probably pause here and that's a shame because the next thing was tests nope we got to write some tests at some point we got to stuff we got to stop adding features we got to write some tests our sink or our spec yeah I mean that that sentence actually worked because I'm thinking like set up our sink then we'll take it from there like hard time parsing that for a moment yeah ah heck let's let's do it unless anybody's opposed it should be pretty quick okay let's go down to let's just go here this is a gem file we haven't looked at this yet but this was generated for us notice it has things like rails in it some other dependencies that our application uses this is where we define the dependencies of our of our blog or a rails application I'm coming down here I'm going to say gem and we're gonna say r-spec rails I think it's an underscore and we're going to kill the server and we're gonna puddle bundle is a way of saying it was okay r-spec rails it's a - I was wrong it's just gonna install the dependencies and the only dependency that we have to add is our spec rails okay and then see remember we can rails G for some help if you just if you don't say help if you just run a command without any arguments it's the same thing as saying - - help now notice that we have this whole other section here for r-spec and one of the options is r-spec you install right here so of course if you're doing this like you know you can go out them out on our specs install guide and it has a nice walk through and how to install r-spec I've done it a few times and there's a little bit of breadcrumbs here to help and remember how to do it so this is it we would say rails G r-spec install with no arguments I think okay so it created some stuff for us like a spec directory a spec helper a rails helper the stop file for r-spec there's not actually a lot that we need to do to have like a simple a simple smoke test for like less air index video of course I turned off my server so that's not gonna work let's do rails G r-spec let's do a request spec request and I think you just give it a resource name but let's see what it is name that seems right unfortunately there's no examples provided but let's just say post posts I think you should be plural cool it created a file for us noise let's go take a look at it great so we're describing post r-spec provides a more or less at DSL to write tests for your code a bunch of helpers for things like expectations and mocks and assertions and whatnot there are other ways of writing tests in Ruby which is what we actually skipped when rails installed that some people prefer and I like r-spec but mainly just because it's the tool that I use and know really well there is kind of a I want to say steep learning curve but there's a lot to know about our spec so once you once you've put in the time to learn it it's a really great tool if you're just starting out I wouldn't necessarily recommend it but not because it's like elite it's just there's it does more which can also be helpful yeah it's it's a great it does yeah yeah and that's kind of the idea and the reason is it's built kinda like a DSL is the idea that maybe non developers or pseudo you know there's roles and a lot of companies that are not necessarily developer roles but they're working with developers they want those folks to be able to go in and look at the tests that have been built and read them more or less like English so you know we're describing posts and then we're saying we're describing get this slash post action we say it works now write some real specs because it doesn't really know how to write the tests for us but we're yeah I think it pretty much will with maybe without any modifications at all actually should probably give this okay so we're just gonna say r-spec and give it the path to the spec if we didn't give it any path at all actually you know what we don't have any other spec so just forget the path we're just gonna run r-spec it's gonna run our whole test suite which is just this one post so post index path yeah it's actually just post path I don't know why I put index in there so this should work great so not a really great run-through on specs but from here you can just start adding specs for other things that work like this the great place to start is just to write an expectation on I make a request and here's what status I expect back and it in fact if you write nothing else if you write tests that just expectations' on the response codes of of your controllers or in your request specs you're gonna cover a lot of your code which is great not encouragement to do that but sometimes writing good tests is a challenge start there what's that okay so so Josh josh is suggesting that we are good developers and we see a green test actually we saw it fail already once but that was because a test was broken not because the code was broken what we want to see is that the test is really actually passing so we want to make the test fail in some way on purpose to go from red to green so we see a failing test and then we see a passing test if we were really wanting to do this we probably would have written the test and see it fail probably because you know the rat helper doesn't exist or something like that then we would have generated our code and then we would have worked on it until the test actually passes but we're kind of doing this backwards I guess so we're gonna go to the post controller and let's just this was my favorite here I like to raise hell which is gonna raise in there yeah my let's explicit whoops I just okay hold on wrong command r-spec to see I'll make this big okay here we go yay so it fails with an error we can see that doesn't really prove a whole lot to us but it proves at least that's going through the controller action it's getting that far and that we could stop it at that point there's other ways anybody have any other suggestions how we could read this it's more useful yeah that's that's probably better so instead of raising an error here let's go down here and say head like I don't know what's it what's what's a non 200 status I should return for for for sure okay so head 404 if I'm doing this right we'll basically just return a status code of four oh really oh yeah you're right let's just do that okay r-spec let's see if this works great should have had 200 but the status was 404 there we go so with that we can be reasonably sure that our test is actually testing the right action this this seems like a silly practice to go through a lot of times but it's when you don't go through the practice that it bites you and you find out that it's not silly yeah yeah yeah yeah we we run into false positive stuff a lot as consultants working on other people's stuff like stuck code that hasn't been touched for years and everybody just assumes this fine and then you're like as its passing this should never pass oh it never should have passed or never was passing truly okay okay one more thing since we're going over time reals s there's one more thing what I wanted to say which is that remember when we went to the index view and it's like yeah you're writing on the rails that's not a really great experience for our blog visitors to come to the front of our website and see yeah you're writing on Rails and then have to go to like slash posts to get there yeah exactly we don't want them to know that we're on Rails cuz we're we're in barest rails is slow and Ruby is dead that's a joke it's not so we're so we're gonna change this real quick remember how we said only down here we can do something similar with posts where we say accept accept index and now this should blow up with a except I could do this mean except index oh right sorry yeah what we would need to do is we need to go slash posts to see that this is dead and it is okay oh no it's okay so yeah no route matches so we got rid of our index route now let's go down and say route and we're gonna say the controller is posts and the action is index and if we come over here and refresh voila one more thing that I happen to know and look at that even prepared and have this in here from earlier when I was testing all this we have a bunch of route helpers that are referencing post help post path to post URL and we can just find and replace all those real quick like such which is great and yet with any luck we should be able to click around and click back and should go back to the root path and it does and that is how to build a blog in like more like an hour question questions what about me does the disappear that's great it won't actually and let's let's prove it and and that's good because it should fail under that circumstance because that route doesn't even up okay we got rid of that route and his testing index isn't it oh one of the things that I found in replaced was route path so it does pass because we remembered that that's true that is true you are right with find and replace that's true yeah slap up you tag in there any other questions you still can't it's a good question actually I don't know I don't I never use the web console like personally like I did a couple times to see it and it's very cool that it's there so I'm not sure if you can okay gotcha yeah yeah yeah so when it was talking about is when you have an error page display they used to be like you know there's an error and then it was like hey here's some helpful stuff about what happened there like improved where it gave you more context and now they've gone so far as to actually drop in an interactive console where they're heard so that you can debug it right in place like from the browser which is very cool any other questions all right Thanks [Applause]
Info
Channel: Vancouver Full Stack
Views: 72
Rating: undefined out of 5
Keywords:
Id: N-2-QeY6e8Y
Channel Id: undefined
Length: 55min 33sec (3333 seconds)
Published: Fri Feb 21 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.