 and you're the get started soon, get started. All right, so continuing where we left off last time, right? So for the sake of our new student here, I'm Ara. A software architect at a startup in Singapore. Actually, none of that really matters. The only thing that matters is that I know a little more Ruby on Rails than you guys and the whole point of this class is so that you can come up to my level. It's not really hard because my level is not really high. So to be fair. So going, moving forward, last time in last class, we had talked a lot about authentication and authorization and all that stuff. The, if you've noticed that, if you've noticed from the last class, I don't have a lot of slides because there was really no point in having a lot of slides because it is copy pasted. What I wanted to, for you guys to understand was how everything actually works together so that it's like this, right? So if you have like a vending machine, if someone tells you, press this button and put $1 all the time, you don't need to do that. Instead, if someone tells you what that $1 is and what the stuff are, you can choose whatever you want. So that's the whole point of this class, I'm assuming. So it's to help you guys create a website on your own and creating a website doesn't mean that you always be creating an event's website. So you might want to create anything you want and you might want to understand, you might not even want to create anything, you might just want to understand what's happening in the website that you're clicking or going into. So my point today will be along the same lines as well. Trying to get you guys familiarized with the next step after authentication on how any API or anything like that even works, right? So, are you guys all familiar with the device authentication system that I told you last time? The sign in, sign out, the sign up thing. So, the log, are you guys familiar? If you're not, see, this is a very small class so you have all the freedom to just shout at me saying I don't understand, so that's a good thing. So if you don't understand anything at any point, even if you don't understand a single word somewhere, just tell me, if it's too complex, I will try to simplify it somehow so that you can at least get the gist of what's happening, right? Don't go out of this class having a lot of doubts and knowing, not understanding and then being disillusioned because of that, right? So, again, so the device part, sign in, sign up, everyone understood what was happening. What is authorization and all that? No idea? Okay. Yes, so, okay, so I'll just give you a small gist of what happened last time. So last time, until the last class, they were just doing random stuff about APIs and just events and all that stuff. So last time, I asked them to implement a simple sign in, sign out system, sign up to create a new user to sign in when you log in and every time the browser comes in and all that. So to give a gist of what authorization means, so when someone signs in, there are two things that are happening. One is that you first identify which user is the one who's requesting for something. So for example, if you want to get all the events, let's take this example of the site that we're building, right? So if you want to get all the events that you have attended, right? The question is who are you, the UF part? Because everyone is connecting to the same browser. So that is a whole concept of why there is a login. There is a login because when you sign, get it, put in your username and you log in. You're telling the computer that this is me and from this point on, any data that you get for me is associated with me. So you don't get someone else's data, all right? So this is one part. The second part, after the username, you have a password. The password is to confirm that you are who you are. So the username is for the computer to know who you are. The password is for the computer to know if you're saying the truth about who you are, that's all. So basically, this is a very small gist of what we did last time, so you understood it. We don't per se, we might need the sign-in part today. We might, you might need to have completed it last time, but it's fine. Even without that, you can still continue. It's not really important. So yeah, so coming back to the, so first get your program running and all that stuff so that you have, so that you can actually see what's happening, just a minute. All right, is everyone up and running? Can you see the ugly login page that we created last time? Yes, no? Are you guys all at the login page or the homepage or whatever? Have you guys all been running? Let's do this one, all right? Because this is a very basic set, let's go one by one. Have you got it running? No. Any problems? Or you know how to do it? No. Okay. You? No. All right, awesome. Man, that is fine. If you're running on some pain, it's fine. After that, we can move around. Don't worry. Just switch off. Okay, but don't use it or go ahead and use it. Do you want to? Yes. You guys? Is it running? No. This one? You guys at the back? Is it okay? All right, the lady in red, is it okay? Okay, so let's move to the next step. So last time, if you guys saw, so what we did was, so we created a sign-up page, registration, then we created a sign-in page, let's say sign-in, then we created a log out, all right? So what we did last time was, I first, for the major part of the class, I was teaching you guys how to do it manually. Then towards the end of the class, I showed you guys a gem called, a library called device, which made it like a single click process. So now that, this is assuming that you're running device, because that's where we ended the class, right? So now what usually happens is that we have some home page, the home page is usually like about us or something like that, whatever you guys have. So when some user signs in, then it needs to take them to the about us page. If they, then on the top, there is like a nav bar or whatever. Then before this, before the sign-in, there's like a sign-up as well. If the user wants to create a new account. And there is a log out button, but we didn't decide where to put it in. So this is where we are at. So before moving on from here, since I didn't have time to finish it completely in the last class, so there are a few problems with it, all right? So the first problem is, if all of you are on the login page right now, you will see that there is like a bar above it. There is like a, sorry, there is like a blue bar on top. So imagine this, right? So imagine, this is like saying before even logging into Facebook, you have the newsfeed thing on top, like the place where you can clean. This doesn't make any sense, right? So this should only be shown after the user has logged in. Yes? So first of all, let's just clean it up a bit. So let's go into the header. Can you guys see it? Okay. So the header is this, the top blue thing is called as the header. And it'll be there in the views, layouts, underscore header, because I'm moving a bit fast because we did this continuously in the last class. We did this in a very detailed way in the last class, so I'm assuming you understand where the header is. So go to the header, and so I also told you that there is this variable called as current underscore user, which you will have if the user has signed it, meaning you'll know who the current user is. You can call for the current underscore user from anywhere in the app, and you will know which user has signed it. So for the people who are in the last class, you'd know it, but the people who are not in the last class, current underscore user is basically like a variable. If you call it, you will know who has logged into your site. So you can use that to display their name or the photo or whatever they want. So basically what we are saying is that, so if the user hasn't logged in, the current underscore user will be nil because there's no one who has logged in. Yeah, logically makes sense. So if the current under, if I'm saying if current user, it means that if the current user is valid, which means that it's not nil, if there is something inside it, then show this. If there is nothing inside that, that means the user is no valid user logged in, so there is no point in showing users, events, attendees and all that stuff. So do you guys understand it? So go to this page, forget everything that is there inside, all right? Just add, let me put it here. So open the notes thing that you have. So this should be the start and this should be the end of it, right? So you guys get it? So put it, how you put it is you go in, you go into the header, you put it on top, if on top and the end at the bottom. It means that this entire thing, which is inside the if, should only be run if the current user is valid, right? For the people who don't have the current underscore user variable, you'll get an error. So don't do this step, it's just some cleaning up that we're doing. So just understand what's happening, then you guys can move forward, all right? So did you guys put it? Now, has it disappeared from the top? See, one more thing, when I'm telling you guys these steps, right? These are probably not the best way to execute this, meaning there are many other ways to hide it. This is probably not a very clean way to do it, but in my opinion, the most unclean ways are the easiest to understand. So if I go in a very, very clean way, then it just becomes like mugging it up again. So I'm just teaching you guys what is happening so that you can put anything anywhere. Later on, when you guys have more experience, you can clean it up to a nicer way, all right? So now again, refresh the page. Can you, has the top bar disappeared in the login page? Yes, all right. So now we are at, a login page looks a bit saner, meaning it looks still, looks like batched ugly, but apart from that, it looks at least like decent. So you can understand what's happening around there, yeah? So now what you guys need to do is just log in. Like you would have created an account last time, right? With the username, if the email and password. Just log in using that. I think mine was something like this. If you haven't created, just sign up. Just click on the sign up and create a new account. So you'll go to some page, yes? Okay, from now on you guys can start. I'm assuming these things will be there in your pages, right? Okay. Are you guys in? Is everyone inside? For here, if you don't have this, don't care. So this is one thing that I added today. I will tell you how to add it. These things are just to make it a little more saner because if you have a sign in, you should also have a sign out button in your app, otherwise it doesn't make any sense. Yeah. Oh, don't forget it. I will tell you how to sign out. This, the button there, I'll tell you how to do it. Forget the old one. You just need to sign it here. And then go to the sign, flash user, flash sign, yeah? Yeah. Has everyone reached this page? Forget the bottom, the top two things. I will tell you how to do it. Don't worry about it. If you have minor changes and all this, like you don't have amber, it's the best, it's fine. Yeah? Okay. So let's move on, guys. Let's, okay. If you guys are shy, then you'll lose. So if you don't understand anything, just shout it. Yeah? So let's go back to the header again. So, you will have this thing called, in your previous app, you'll have something called UL class, nav bar, nav, users, events, attendees, and then the UL ends, right? What do you have after that? Can I see it? This UL. Do this with the flash user, or create something new for the current UL. From this, from the next UL to the, after this, whatever is there, inside the UL, just delete it. Don't want it. Yeah? And, meaning, replace it with this. Meaning, after this, there'll be something called UL, which is starting, and a slash UL, which is ending. Remove that, and put this UL and this slash UL and the content inside, all right? For the content, I'll just put it inside the Google Docs. If you use, if you put this, then just put this and tell you what is exactly happening there. This is just cleaning up, guys. So if you guys weren't completely lost, because you weren't here in the last class, just forget it. After like five minutes, I'll move on to a completely new topic. This is just to clean up what we did last class. Because there was no sign-on button in the last class, and I was pretty embarrassed about it. You don't feel? If an app cannot log out, then it's very bad, yeah. So, yep. You guys have copied it? Now, if you get any error, just shout, or whatever code you gave doesn't work or whatever. So, we can fix it. So now, go to the app and see what, if you can see the, refresh the page and you can see the top thing. Let's see, I'll sign out and the name of the person who has signed in. Yes, yes. We have one yes. No, completely wrong, okay. Oh, what the fuck? This is something after you've already done it. Can everyone see it? Okay, if everyone can see it, now pay attention to actually what's the hell's happening, because otherwise there's no point to this if you don't understand what's happening. So, what these UL, LI, and all these are, I will come to it in like another R, because those are HTML and CSS stuff, which we'll be teaching soon. What you need to understand is this. So, anything that is inside this percentage equal to percentage, you know that if something is inside that, that means it's like, it's executed in the Rails way. So, you can give Rails command inside that. Do you guys know this? You guys know that, right? Yes? No? Okay. Basically, what we have said is that current user is the object that we have of the user who has signed in. We have told the computer that inside this place, assume that this entire thing just says that you should position this on the right. That's all this says, all right? Inside that, the text should be the current user's email address. That's all it is. Wherever you use current user, you'll get the current user's list of object, like what he has, like email, name, password, and all that stuff. So, we just pick the email and display it there. And then in the sign out, we put it in the destroy users. You guys know what the path is, right? Don't worry, if you're completely lost, I'm gonna refresh it after this again. So, now are you guys at this place? Okay. So, now we actually come into the interesting part. Now that I've come past my cleaning up stage. So, all right. So, what we're gonna do is, you remember last class, I taught you guys how MVC works, what a model is, what a view is, and what a controller is, and all that stuff. When you guys first built this app, you had no idea what the hell each of this thing was. You just created something using a scaffold or whatever, like a scaffold migration and stuff like that. Now that you guys are a lot smarter, you guys have understood what a model is, what a view is, and what a controller is. Let's try to rebuild a lot of this from a scratch without even using the scaffolds and all that stuff. Let's take one part of it and let's see how, say in real life, if you have to build an app which has a feature, how would you guys go ahead with thinking about how to build a feature? That is what I wanna teach today, right? Because if I tell you guys how to build the events page is no point, because you need to know how to actually build something that you want. So coming back, a small primer on what MVC is for our new people here. So I'm pretty sure you know what a model view controller is, right? Like what a model is, what a view is, and what a controller is. So I was telling, do we have an erase? Thank you so much. Oh, I didn't see it, sorry. You did not hit my face, man. You can everyone see it? My handwriting is not usually so gigantic, but. So when some, so in every app, there are three elements called as model, view, and controller, all right? So wherever you store and a database, all the folders, there's a folder called DB inside your app, right? And you run migrations inside that and you have a schema and all that stuff. Basically, those are database. A database is just like a folder structure. You can just imagine it like that with a lot of files inside and stuff like that. So it's basically just a structure of how your data is stored, stored in this folder, stored in folder C and all that. How your app interfaces with a database is called a model. So the database is not part of your model. Keep that in mind. A database is not part of the app. Keep that in mind. A database can be accessed by any app. A database is just basically a folder. Like you can access the same folder from Keynote and you can access the same folder from Numbers, right? So a database, when you run a migration, you're just simply telling the common database that you have on how to structure itself. Anyone else can come and change it as well. So remember that. So the model is part of your app where you tell your app how to interface, how to contact and get data and put data inside the database, that's it. A controller is a place where you get and process data from the model. So for example, let's say if you want to get all the events of a particular person who what he has attended, then that data will be stored in the database. How to get the events of a particular person will be stored inside the model because these are app things. The database only stores junk, like values. And the controller decides how to get and how to process this. What does attending an event mean and all that stuff. So you get it. So the controller is where the logic is. The model is where the connectors are and the database is where everything is stored. The view is where everything is visible, that's it. So you can, if you guys cannot, meaning if you guys see the website and like see buttons and all that, that is part of the view. The way the view controller with, view talks with the controller is using roots. So you have a roots folder inside your, roots file inside your config in the folder structure. So you can find various routes. So this structure, as I was telling last time, is the base of any system at all in the world. So whatever system you want to, whatever website you wanna take, it'll have some weird version of MVC running on here. MVC meaning model view controller system running behind, yeah. So I'm going a little fast here because I explained in depth about what this meant last time and everything. So you guys understood this, right? All right, so now let's come to the interesting part. So now I'm, now let's do this, all right? Let's take a new feature that we want to build. Let's say events is some feature that we have not built. Like you already have like events inside your database, right? Let's say yeah, sure, why not? Let's start swimming. So events basically means that it's the list of events that you have that you want to store. So now you guys are going to build this website. So what are the things that you'll be first thinking about? The key here is that the key to actually architecting any system is to break down the system into as many logical elements as possible. The logical elements should be such that you understand each of the logical elements. Break it down until you go down deep into that level where you can understand, you see? So because where I understand it logically might be where I stop, but where you understand logically might be a much lower level because you wouldn't understand what a model is. You want to go deeper, you want to go on to validation. That is like a logical thing for you. You guys get it? So first of all, when we're architecting, when we're thinking about how to even write anything, first sit down and think what you are going to build, what are the features that you want inside and just write it down. Like from a, I personally like to write it from the user's perspective, instead of the programmer's perspective because our design-centric approach, in my opinion, works best because your entire app can be structured to what is needed instead of what is correct. So let's say that now, let's try to architect a completely new system, meaning the same system and a completely new one. So currently, let's say that you have the user and you have the current user variable. So basically you've done the login, log out, sign in and all that. So you just have one user, you have a user stable in your database and basically if someone signs in inside the app, you can just simply see who the user is and you have a sign-on button, that's all. Imagine that, all right? So now you guys want to build, say, Coding Girls app, which is basically like you have a list of Coding Girls events and you have the users who attend the event. So let's start out from the basic logical element that you would want to take the app from. So the first thing that you want to see is that you have many events. So the basic concept is that you need to have like a page where all the events are displayed, all the events available to the user are displayed. Assume that we don't have any funny things like featured events, starred events and popular events and all that. We just have the events page and every event that Rails Girls is going to conduct can be seen in there, let's say. So the basic requirement in your mind now is that I need a page. I need a page where there are many events displayed and now what else do you need? Now the next step is, now I know that there are many events going to be displayed but what does each event, what is going to be displayed about each event? Is it going to be like a photo or is it going to be like a text or a sign in, a sign in or whatever. The next step is this. So you've started from the most basic logical element and you slowly move up. The next step is, okay, let's say that a photo is too hard. I don't want a photo because I think it's too hard to build. Eventually you can build it but now I need it. So now let's just say that each event has like a, let's say each event is structured this way. You have like a title and a subtitle, like meaning a description and date and time. That's it. Is there anything else that you want to put in the event? Because you should imagine this, when I'm telling you guys this, I have no idea where I'm going to as well, I'm just winging it. I have no clue where this event is going. So that's why I'm asking you. Because I'm trying to give you an example of how any software person builds an app. There is nothing to it. It's not like some huge paper and they just write it down and all that. Everyone just starts off in a grid sheet or some scribbling pattern just scribbles down this way. So don't get worried about, even Facebook would have started out this way. So start out from a basic logical element. So let's say now we have this. Now we have decided what needs to be displayed in the view. The next step is this is the part of the view. The next step is we need to see how this is going to be stored. So where is this going to be stored? If I want to get this from somewhere, all these events have to be stored somewhere. So my approach to, there are various approaches to how anyone handles this architecture. My approach to this is coming down from the database. So you first see how you want to store it and where you want to store it. Then from there, you go into the model to for the interface. Then you go into the controller and then you go into the view, all right? But before that, you first need to see what other stuff you want to store so that you can create the database in the correct way. You guys understand everything? So wait, let me just move it around. Just give me a minute. My laptop is like just sleeping all the time. I need to swap to stop it. Okay, so now that we've decided every event should have three things. One is the title, another is a subtitle, another is a date and time. Is there anything else that you guys think that should be in the event before starting? Because I'm just ringing it so I know. Is there anything else that you want to learn before the event? You understand? This defines the entire event, it's fine. So because my point is just to make a point on how to build it. So even if something is not there, you will know eventually on how to build it, all right? So now we have decided that there are three things that are required in every event. So now we go into the creating the tables part. So first of all, let's see this. This is the flow that I'd like to follow. First the DB. The DB is where you create migrations and see how we want to store the stuff so that before you even start the app, you have some place where you can store it. So when you go into the other steps, you'll have something to get and post data inside. Because if you start building the, sorry. So if you start building the controller first, meaning all the actions for the controller first, when you're actually building it and there's no place to store the data, then nothing will work. You'll just build it like a RS which is close to the device and it just goes straight. So let's build from the most basic element. So we have three things. So the first thing that you will eventually do is how do you create something in the database? Can anyone, does anyone remember anything from the first class? I was not here, so I'm not sure. How do you create, so now that we have this step, every event should have three things. So what is the next, I'm telling you that first create the database, create the place where you can store it. How do you guys create it? Anyone knows? Any idea? No one has any idea at all? Okay. Migrations? No? All right. Okay. Okay. Yeah, sure. Yeah, so meaning, I don't need the command or anything. So that's the thing about computer science. You guys should understand something. When I'm asking you this question, I have, even I have no clue how to create a migration, meaning a sense of the syntax. No one knows it, like everyone just like wings it. Like you can just go and Google it saying how to create migration. What I want to know is, you should at least know that you should create a migration to do it. Only then can you even Google about it. So that is the key. You at least need to know how to Google about it. That is the step where you need to be there and to be a successful programmer. Yeah? So, so yeah, a migration is something that you create. You would have remembered earlier, just refresh your thought process and all that. A migration is like, you just simply say rails, generate migration and some name add column two and all that stuff, right? Basically a migration is something to create a structure inside the database. You can imagine a database. I'm assuming you guys have no clue about, you forgot everything about migration. That's why I'm going really basic. So, but if I'm going really slowly, just tell me I'm going really slow, all right? So coming back to migration, put this in your mind. If you, a database is like a folder. It's like an empty folder. There are various ways where inside the folder you can create many subfolders and many files and types of files and all that stuff. So database is basically just an empty folder. A migration is a way to tell the computer on what subfolders to create. Like if the database is called, I don't know, coding girls, inside that, the migration can tell one folder called events and inside that folder there'll be many event files. One other folder called user and inside that there'll be many user files and all that shit, all right? So this is a very basic explanation of a database. Very crude explanation of database, but it's enough. So a migration again is a way to tell the computer how to create the structure, all right? The reason why you need to do it is because assume that every app has like an empty folder to begin with. Now that you need to store this thing inside the database, you need to tell the computer that, okay guys, okay computer, listen, I have something called as events. It's called, when I call events, you should give me this and inside every event there are three properties. Each event will have one title, one subtitle and one, I don't know, one date time. So how the database is usually is, is that it's like an Excel sheet. You guys know Excel sheet, I don't really know Excel sheet. Okay, all right, so it's like this. So basically you tell the database that this, you see the sheet one, sheet two and all that in Excel, right? Sheet one is the database name, assume that. So we say that the database name is called events and inside that the first column is called title. The second column is called subtitle. The third column is called date time, all right? So what the database is, is that we have created this structure on the database so that the next time when someone adds a new event or wants a new event, it's just like every row. Like each row will be one more event, one more event and each event will have all these three properties. Understood? So inside each database, inside each table that we create, a table is basically just an Excel sheet. There is nothing advanced to it or anything like that at this level. All right, you guys understood? So coming back to the point, how do you create, so now that we have these three, what do you do now? How do you create the structure of the database? You can be wrong guys, it's fine. What did I say, no, migration. So a scaffold is, a scaffold, forget scaffolds, right? Like forget that they exist, forget that, erase that from your mind. A scaffold is for people who are just starting out or who know what they're doing. If you either don't know what you're doing or you guys are smart enough that you're in the sixth class already, you don't need a scaffold. You know, you have an idea about exactly what's happening. Basically a scaffold, if you say a scaffold, it'll generate a migration for you, that's it. So imagine, remember this again. A migration is a way to tell the database on how to make this structure so that you can store something inside it, yeah? Because if it's like an empty folder and you store everything inside it, there's no structure to it. If you get something from it, nobody knows what an event is and nobody knows what anything is. The database won't know, the database, it's like a text file where you just simply type everything randomly, yeah? Sorry. So how would you create the structure in the database? This thing that we want to create. Mine, create. I know that you guys know it. You guys are reluctant to say it because I'll think you're dumb, but don't be because I myself don't know how to create a migration, so I would even Google it myself. So don't worry about it, you're not so bad, yeah? So just, as I said again, you just need to know how this thing is structured so that at least you can Google about it. So that after this coding girls class and all that, you should be in a position where if you're searching for something and some idiot in Stack Overflow says, oh, you need to create a migration for it. You shouldn't be completely lost. You should be like, oh yeah, migration is a way to create a structure in the database or whatever. Because the programming community is not very welcoming of such doubts, so if you ask doubts like this without researching anything or without knowing any concepts, people just scold at you. Meaning people like the rant or whatever because everyone's behind the computer so no one can really see you so they can say whatever they want. So yeah, so the reason why I'm telling you this is so that you guys know the basic concepts where you can Google it yourself. All right, so let's move on because I know that you guys know what your migration is. So first, now that we, let's start from the database. My handwriting is a bit ugly, but I talk so much so you'll probably understand what I'm saying. So anyway, so the first step is to create a migration and inside the migration we need to create this. We are going to store all these three. So let's say we call a table saying events. Events is what? A table is what? A table is just the name of a sheet. Imagine that. It's the name of an Excel sheet. And then after we create the name of the Excel sheet we need to create the column names, which is what? So inside there is one title, subtitle and the date. That's it, all right? So now, okay, so this is how you start an app. If you guys are building a new app, this is the same process that you do. Write all these down in the paper, okay? I don't write it down because I remember it. If you can remember it, it's fine. If you want to write it down, it's much better. So first, write it down. So first for this to create, this is what you want to create. First, have a vision for what you want to do. Then from that vision, boil down to how you want to build it, all right? So this is the vision that I want to create. I want to create a page which lists down everything, all the events that are there to attend. So inside each events section, I want to have three things, information displayed, titles, apparel and date time. So now that I've, now this is my goal. This is what I want to build. Now I have this, I come to this street. How do I actually start building it? I start from the database. So to create something in the database, I need to create a migration. So first, write down migration. What is the migration that you want to create? I want to show a list of events. So the sheet name is called events, the demo name. And inside each event, there is a title, sub-paral and date, all right? Got it? Awesome. Okay. So the good part is that we've not even entered a Rails app yet. We are still in the folder structure. So let's enter into the Rails app and where Rails comes into place. So now that you've done this point, imagine this, right? So this is the Excel sheet that you have. Sorry. So now that you have an Excel tree structure, now you have to do it. So what are the things that are possible in Excel sheet? Just imagine this. Like what can you do in a sheet? There are four operations that are possible in any database or Excel sheet or whatever. Yeah. It's called grud. The reason why I'm giving you this term is because people on the online world, software engineers will keep saying the grud things and grud things and all that. There is no meaning to it. It's very simple. I'll tell you what it is. See is create, see R is read, U is update and D is delete, destroy or delete or whatever. So basically grud means that you can create something, read something, update something and destroy it. This is a very, this is like the, one of the problems with where women consider it as a barrier to enter into computer science is because of jargons like these. So the reason why I'm telling you this is so that you need to demystify this jargon. Any child who is like five years old can tell you what this means, what a create is, what read is, what update is and what destroys. So just, so don't be shooed away by these random jargons or random terms that people put out on the forums. It basically means that you can only do four operations. So what it means is that if you have a row, you can create a new row, meaning in the table what can you do. You can basically create a new row, you can get a value from a row, you can update the row, you can change the values in the row or you can delete a row. That's it. That is all it means. So now you want, so from now days you are also programmers so you shouldn't use terms like create, read and all that. Just use grud and sound smart. So moving forward, now that you guys understand what are the four basic operations available. So for every event in this database, in this table, there are four things that you can do. You can create a new event, meaning the admin, whoever is like and can create a new event. You guys are like the minions who come to the event. So you cannot create an event but you can read the event, meaning you can get the event and can then update the event if you want to change the date or something or someone can delete them. That's it. There is nothing else possible in this table at all. Even if someone says it's possible, it's not possible. So coming back to the model, so now that we have this table structure, it's a very dumb structure. So you can come in and create an event which doesn't have a title at all. She can come in and create an event. It's like in an Excel sheet you can create a row with, there is no rule to the row. You can do anything in a row. You don't need to fill in all the columns. You can just fill in one column. So this is a problem for us though because we don't want that to happen. When you go into Facebook and you go in without your email ID, Facebook doesn't want to go into your email without your email ID because they want to spam you with their emails. So they need your email ID and they wouldn't want someone to create a new user without the email ID. Similarly, let's assume that we don't want to create, we don't want anyone to allow to create a new event without these three. If they don't have a title or a subtitle or a date time, they are not allowed to create something. They should have all these three. Only then my app will look neat or whatever the reason is. So these are called as validations. It's just an English term. That's a good thing about Rails. Most of the terms are in English. So now that you've built a table, if you want to do some checks before someone stores it in the table or someone gets it from the table and all that stuff, these are called validations and functions that you have to do. This is where a model comes in. Basically, a controller can directly get data. As I said, a database is a common entity. Anyone can go and contact the database and get it. So if someone wants data from the database, you might ask me, why should I go to the stupid model thing? Can't I just go to the database and get the data that I want and show it back? The reason is to prevent things like this, where people create something without doing anything and all that. So to put this without having enough correct values and stuff. So to put this in perspective, a model is a place where it's like a fact checking. So before something is stored into the TV from the controller or before something is deleted or before something is updated or whatever it is, it needs to go through the model. So the model decides if it's like valid. Okay, guys, this makes sense. Okay, guys, this doesn't make sense. So if someone, if you have an amount that you need to pay for each event, you idiot cannot come and type ASD as the amount. It needs to be a number. So the model takes care of it. The model is like, okay, guys, there's not a number, so don't even go to the database. You're not allowed inside there. All right? So the next step is for you is to create the model. So inside the model, you need to first think about what are the things that you want to check before someone communicates with the database. Like I said, the first step is let's say that for a very simplistic sake, let's say we just want to validate if all these three are there. Meaning no one can create something without all the three elements. So let's say that we need to do some validation here. All three. All three of my columns. All right? So you guys got what model is, right? What is the purpose of the model? Can you, can you say what's the model? And I want a more basic level. A model is something where, which is the interface. It's the interface between your app and the database. So let's assume you have a, you have something, you have like a water, and you have like a pail of bucket to get the water out. That pail is the model. It's like a tool for you to get something from the database and tool for you to pour something into the database and all that. Yeah? So you guys understand what a model is, right? Yes. Okay. So what's the difference between a model and the database? Can you go? No, you can. There's no wrong answer. You can see what the hell you want from the app. Cool. Yeah. That's a very basic way of putting it, but it works. As long as you understand that much, it's fine. You can move forward. Yeah. So everyone's, everyone's understood what a model means. So do you see the progression that we're having? So the reason why I'm showing it like, like I'm showing it to a kid is because you guys need to understand that programming or engineering for that matter, whatever you're building, it's a very logical process. It doesn't happen like overnight or it's not like a creative thing I'm sleeping and it came to me or something like that. It's actually a very logical process. You split it into logical elements and go through it. The creativity actually comes in this part. After this part, it's only building and engineering. So I'm only here. I'm teaching you guys on how to do this because I'm sure that the creative, you guys have no doubts of creativity. You guys can probably come up with any system you want. All right. So now the first is the database. Now that we've created the model, basically in the model, we have made sure that that we have put in validations to make sure no one can create anything in the database without all these three. The next thing is the controller. The controller is the guy who actually executes the crud. You guys know what a crud is, right? Yeah. Okay. One thing you take out of the classroom. So, so the a crud basically means, so you need to have a function. You need to have some ability for the app to tell that, okay, if someone calls this with all these three things, then create something. If someone calls this, then delete it. If someone calls this, then update it and all that stuff. So it's, these things are just like tools on how to do it. This is where it's actually happening. So here, let's say that we have to create crud functions, all right? So crud functions means that we need to create an ability for the app to actually create something in the model or the database, update, read and destroy, all right? Understood? So controller is where that is done. The def, def, def, and all the defs that you see will be there, def index, def show, and if you have seen the app, yeah? The next thing is the view. Actually, no, the next thing is the roots. All right. So, all right. So now that you have an ability for someone to call, create, update and destroy and all that stuff, you need to expose on how to do that. This is an API. So you guys have heard API, API, give me the five APIs and all that stuff, right? An API is nothing but, I explained to you guys last class, if you've forgotten it, I'm doing it again. An API is nothing but, how do I put it? From a very basic perspective, it's, you've created an app, all right? It's, and you have like a view. It's, it's giving a set of rules on how the view, the computer that you're seeing can get an update data from your database, come from your database or your app, yeah? So let's say that you want to create some event, yeah? I'm saying it in English, create an event, but a computer is not so smart. You can't be telling it to create an event and it'll be like creating an event and all that stuff. So you need to give, define a particular way by which someone who's creating an event should call, so that it can be stored inside the database, all right? So basically let's say, we call this, let's say the app is called xyz.com and let's say that we define an API. This is an API. An API, we basically means a rule that we're saying that this is what you should follow to create an event, all right? So let's say event and with some parameters, like title, if someone calls this place with some box, with some parameter, parameters means like data, all right? With some titles, subtitles and date, then I will create an event, all right? If someone calls event with a particular ID for that event, then I will help the user get that event from the database and show it to the user and all that stuff. These rules of CRUD on how to do this CRUD and how to create and all that stuff is what an API is defining and that is defined inside your roots because your roots is where people call your app through. When someone calls your app, the first thing that you hit is the rules because it will be like if, that is, have you guys seen the error 404, page not found or whatever? You know, where is it coming from? It's coming from the rules. If there is no nothing like this that you're calling and there's nothing like this defined in the roots, then the computer by default will give you a 404 page not found. So, yeah, if you want to make a geek joke, you can use that 404 page not found and do something like that. So, that's the thing. So, you guys understand what a root is, right? Yeah? So, after creating the CRUD, the next thing that we do is we create, how do I put it? A way for these things to be accessed from the roots. So, we create like a list of CRUDs. So, we tell that inside the roots we'll tell that if someone calls xyz.com as events, then push them to this controller and this action, yeah? Because the controller already defines it. This, the root is one who connects the user to what should happen in the controller. Yeah? Understood? If you don't understand, just call and tell, yeah? Okay. All right. Okay. No, because there are some lost faces and there are some very confident faces. I don't know if you guys are confident because I've given up on learning. Moving on. So, the next thing is, the next thing is actually the interesting part, all right? Now that you've built all the shit, you're coming back finally to your vision. The view. Which is what you're going to see, yeah? So, the view part is where you're building all this thing. You're defining, oh, I need the animation to be there. I need this to be red color. I need this to be like moving around or whatever. A view is basically where you interface. It's the interface between your app and the user. So, it's how, what is shown there, yeah? So, inside the view, basically, the view communicates through the controller. So, the view might basically first, you might tell the browser that if someone loads this view, then call this root. This root basically will get call the controller saying get all the events and the controller will call the model, the model will call the database and it will trickle down. I'll tell you guys, it's very important to understand what's happening here, all right? So, now that you've seen all the elements that are in place, all right? So, what is going to happen? Let's come from your perspective of opening a browser. So, let's say that you've built everything and you're like, yeah, everything is going to be working and all that. The reason why I'm telling this view, this structure is because for sure you're going to get an error, 100%. So, you need to know where the error is so that you, for that you need to know how the path is even going, so that you can debug it, all right? So, let's say you open the browser and you type whatever your app's name is, like xyz.com and the first thing that you want to see is events page, all the events and all that stuff. So, what is going to, what should actually happen? So, the browser is completely done. It's like the dumbest thing ever, okay? So, your app is really smart. You guys have defined what to do and all that stuff. So, the first thing that you need to do is that inside the view, inside the view that it loads, you're telling the browser that, okay, inside this view, I've defined a rule called xyz.com slash events, which if I call, I know that if I call this xyz.com slash events in the roots, then I'll get all the list of events, all right? You know that, because you don't want to create that. You see, you don't know that then you're no more than the browser. So, yeah. So, you know, you're the one who created that. So, inside this view, you tell the browser, please first, before doing anything, just call xyz slash events. All right? What happens after this? Now, the browser, after this, the browser calls xyz.events. It first hits the roots of the app, because that is where you have defined it. The computer's app checks, okay, do I even have xyz.events? I have it, all right? Now, after this, it goes, the xyz.events is redirected to some controller. It's like, the app is like, okay guys, I have xyz.events. This, what to do for xyz.events is defined inside some controller saying events controller or whatever. All right? So, redirect everything there to this controller. Redirect what this guy is asking to this controller. So, my request goes to roots, then it goes to the controller, the root redirects it to the correct controller. Then the controller looks at it, okay, looks like this guy wants to get all the list of events. How do I do it? Let's go call the model, and the model will call the database for the list of all the events that are stored in the database. Now, the database, okay, retrieves everything from the Excel sheet that it has, like all the events that it has, goes back to the model again. The model is like, okay, okay, man, I've got all the events for you. Now, controller take it back. The controller is like, okay, the front end, whoever it is, I have prepared everything for you. I've downloaded all the events for you. I'll give it back to you again. This is the path. This is the path that every single app would follow in respect to how complex it is or how simple it is and all that stuff. It's a very, very basic level. Every single web app, I mean, there are other types of apps. So, you understand? View. In the view, let's just say that in this view, you're saying that if someone calls this view, the browser should call slash events in the roots because you've defined in the roots that is how to get it. All the events in the APIs, if you want to make it more jargon-y. So, the roots, if the root is valid because if someone calls it, if it's valid, it calls the controller that is responsible for it. The controller then looks at it, sees what the user wants and asks the model for the particular amount of data. If the user wants to create something, it tells the model to create it using the things that user gives. If the user wants to get something, then it tells the model, get me this. The model then contacts the database for the particular thing. The database again gives it back to the model. The controller gives it back to the view. And now once, what do you have here? Now that you've called this, you'll have the entire list of events that you have in a text form or whatever, in some format that you've defined. Once you have that, you can beautify it however you want. You can be like, the first event, if the event is like a featured event, then it should have a star. If it's not a featured event, it should not have a star. Need out? Everything is Rails. Everything is Rails. Once you call slash events on the browser, that is when Rails starts. Because the browser will call xyz.com slash events. And when someone calls xyz.com slash events, the first thing it will hit is Rails because we've defined that as Rails out. Everything after the browser and until the browser is Rails. When I say Rails, it doesn't mean Rails as a language. It's the Rails app. Rails app might have multiple languages inside. Like you have JavaScript inside, you have HTML inside, and CSS inside and all that stuff. So it's a Rails app. Basically it's your app. Everything here is defined by your app. That is why I wanted to explain everything properly in a particular way so that every single concept here will be inside your app. Understood? Yeah? Let me just get a drink. Alright guys, the teacher's back. Let's go. Any tables to create? Let me just run through a very simple structure of slides. My slides are very... Now that I've talked so much, you guys should understand what each slide means. So first, what did we say? I said let's rebuild. That's a logical element. The first thing is tables means DB. So the first thing is any tables to create, any tables to update or something. Second thing is models. What are the models that we need to create? What are the validations that we need to do? Whatever. The next thing is controller. The crowd operations. What are the create, update things? How do we create anything and all that? The fourth thing is the view. So the next step is actually building this. So, me telling you guys how to do it is all like magic and it's like working and you can understand everything. But actually when you do it, it'll take like 2 hours to actually go through all the errors. I want to do that. I'm going to do that. But before that, I want to take this time to... Because it's very paramount that you guys understand what's happening so that when you get an error, before even asking me, you guys would know, oh, if it says that oh, the model validation doesn't pass. You know what the hell it means. At least you need to know that you need to look in the model. You shouldn't be completely lost and be like, oh shit, there are 100 files. Where will I look in? That is the stage at where you should be there when you start doing it. So I'm going to give you like a minute. Just try to absorb this concept and if you have any doubt at all about anything or about any parallel that you want to draw, if you want to see... If you want me to give an example of some other thing apart from events because you're not understanding this. Now, one minute. Discuss or whatever. Yeah. So the idea is how instead of rules that you define in your app, you tell the world that if you want to contact my app, I guess you will then have to do this type of data. It's part of the rules. It's defined in the rules. See, it's the start. It's defined in the app, but the rules is where the basic API is defined. If someone calls slash x, y, z, what will happen? That is defined in the rules. If you're not defined in the rules, then you'll get rules on form, page on form. API is the definition of how to communicate with your app. Yeah. This is the time to shine. If you don't understand anything, then, yeah, please ask now. Because if you understand this, you don't even need me. I'm like a dead weight here. Yeah? Yeah? So you understand what a controller is. A controller defines the cards of data and all that. So in the front end of your app, if someone wants to create an event, for example, you want to do something completely different. They need to know how to communicate with your app. Say, let's say I want to get all the events. There needs to be a particular, like a command to give to your app. Say that, okay, fine. To which app thinks it needs to get all the events and so on, it can get all the events. This API is defined in the rules. Just like the rules, you will tell that if someone calls flash events, then it's a valid thing. Then convert that person into the particular controller that handles it, like an event controller or something. Say, let's say if someone calls flash events, you're telling them to redirect them to this controller and you're defining in the controller how to actually do it. Then what needs to be done? So, what needs to be done is to get the events. How to do it is defined in the controller. So, when I say what needs to be done from the view, the background, the computer needs to understand it and transfer it to the correct guy. It's like, you have a form. If you're going to a, I don't know, get a license, right? There are various licenses that you can get. It's like a white license. It says that, okay guys, we only have three sets of licenses to get. If you want a white license, fill this form. If you want a car license, fill this form, all right? So, this is the root. A root is defined saying that this is the forms in your license. If you want a car license, you fill this form and drop it. If you want a white license, you fill this form and drop it. How I fill this form is defined inside the form itself. So, once the form has been given, based on what kind of license it is processing a particular way and the result is going up. You understand? We're very honest with you. We have years. We have years. Yes. So, the study of this is about the page. Yeah. Yeah. If someone calls and opens the page, then what will happen? So, now it's like, we have to jump that way. We can't wait until the next page. Yeah. So, what does this mean? If I put slash update under store, it automatically refills this. So, if you don't do anything, you just assume that you have to go to this controller. So, how do you find this? It's saying, rate space use. So, because, forget all this rate of magic, if you type rate space use you can make your signal migration space use. Yeah. Yes. Now, we know all the routes that are available inside this tool will have something like this. Tool, tool, that's it. Or syndication case. Because it's great, it's smart. So, if there is a rate in get user's view, then it will be transferred to this. So, update that and you will see what it is transferred to. So, for which it means, how many of the people have this? Second rule, let's see, go to update events. See, update events. So, it's like, if someone calls post update events, they're saying that they should be calling events how it's not available. This means automatically assume but it's because you can't do it. It's just an assumption makes that you can do it too. So, which page? Which page? Because you put it inside the universe. Which page? This is not a page, because it's a post. A post means it's sending data to it. So, like when you're creating a login, right, like when you're creating username, password, login, you're sending username, password, login, password to the server. You know, we don't have any page that is on the button. So, on the button, this will be executed. When someone has to update an attendance, then you click update attendance and they'll send all the details about the attendance that they want to update. So, but you know which button which button? I don't know, because I don't think you have to button the ends because this is filled with a scaffolder and you might not even know it but you would understand it. So, when someone clicks a button, probably like someone, or someone who has a checkmark, say, if you click the checkmark, then it's like attended to whatever they want to update. So, you see, when you is filled with HTML, CSS, language back in your, you know, raw and real, major, real, it's a rotten thing. So, how do you make your application a compiler with server language in the roots? So, with the ERB actually speaking, there is a part. You see that open some view open any of the view and open any like header or HTML or DRM or something like that. You see that these things are HTML but when I put something inside this ampersand symbol, it's Ruby. So, that is how I combine. So, in the same page I can execute something in the Ruby way or I can also execute something in the HTML way. The HTML is to beautify the stuff the Ruby part is to actually show the, tell what stuff it is. Understand? So, this is, these are the things. What I try to say is that for use of use, that's the HTML and CSS but I mean when you're key in this data and your base data has been changed by the server so how does the server recognize the range Ruby? The server doesn't care. That is the whole point of the ETI. In the ETI, you tell the frontend on what you understand. You tell them that if you give me in this format meaning the data should be of the format such that it should be starting with a bracket then it should have like a name then it should have like a value then it should close the bracket. Assume that this is one format that I have defined. I tell the frontend using the API saying that this is the format I understand. The frontend doesn't care if I use Rails or whatever the language is. They don't care. Nobody cares. So, as long as someone is following this format, I will respond to it and the frontend, as long as I send this format from the frontend I can expect some data back. Okay, so server this is controlled by your API. This is controlled by the roots. So, we just say API. API roots. So, where did you get this API from? Roots. So, if you go to Roots these are all Rails terms of creating the roots. Just type rakespace roots to see actually what root are roots. See when I type rake roots I can see all the roots that are there in my app. Basically what is happening is if someone calls gate slash user slash sign underscore in I can translate them to this controller and all that stuff. So, this is the API list that I will give to the frontend or someone whoever is creating. I'll tell you they tell them that if you want to sign in then call user slash sign in and from inside the app I expect some name and password right and so I tell them that the name and password needs to be in this format. There are multiple formats. One such format is called as JSON. JSON is just one format to send the data. There are many other formats. So, basically I tell the frontend it needs to be in JSON format and it needs to have name and whatever columns I want and call this API. So, it looks like the work application is the chain. Everything you can build in your browser the app the application can install your browser because the Chrome Oh, that is just like a frontend. That is not the application installed in the browser. That is just your view this page installed there. Basically, when you call the page it's going to call your server again. Another application is the software your install is desktop. So, what's the difference with these kind of apps and your installation and office your open app. The MVC that you have here currently in the browser in the browser web app it's on a server so that anyone can access it here. If with the desktop why do you want to do this? So, it's why your own thing no one can come and access it and whatever you want. Like if you have like a movie, a PLC player your movies that you watched and all that stuff is only on your desktop. So, your desktop is to act as a server Basically, a desktop is a server for yourself. Understood? Any more questions? Actually, you guys should break it's been one and a half hours just break for break for That's it? Yes. Then if you call the video then your browser will say or your RAIDs app will say Oh, there is nothing called video what do you want to do? Then you need to find it if you want to do a thing. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. That's it. Thank you. That's it. That's it. Did you add something in the end of the experiment? Did you overwrite the method of the device? What was working last week? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment? Did you add something in the end of the experiment?