Das Video kommt von YouTube: erst beim Abspielen verbindet sich die Seite mit YouTube (Google).
What Is MVC? Simple Explanation
Das Wichtigste aus dem Video
Tipp auf eine Zeit – das Video springt genau dorthin.
Transkriptautomatisch erstellt · 71 Zeilen
- Hey, what's going on guys? If you've been following my channel for a while, then you probably know that I like to take diff- uh difficult concepts and try
- to explain them in a simple way so that you can really wrap your head around it. So, in this video, I'm going to try and explain the basics of MVC. Now, I'm not
- going to go into too much depth because I want this to be beginner-friendly. I also want it to be short. And like I say in many of these videos, feel free to
- share your opinion and knowledge or disagree. Um just be respectful to everybody. So, MVC stands for
- Model-View-Controller, and it's a software architectural design pattern. Now, I'm explaining this from a web development point of view. It works a
- little different for other types of programming, and some programmers even say that you can't have true MVC in web development or in a web framework. And
- I'm not going to debate whether that's true or not, but uh I'm going to be explaining things from a web dev perspective.
- All right. So, MVC is definitely one of the most frequently used design patterns. Most of the popular web frameworks use at least some parts of
- MVC. And the general purpose or goal is to separate functionality. Not just functionality, but logic and the
- interface, um all kinds of things in in an application. So, this promotes organized programming, and it allows multiple
- developers to work on the same project with ease. Okay? This And this is somewhat true for all design patterns, but especially with MVC.
- So, before we take a look at the different components that make up MVC, let's take a look at some popular frameworks that use MVC concepts.
- Now, notice I said MVC concepts. The reason for that is because MVC can mean different things to different people, and frameworks can kind of borrow some
- of the concepts and still be considered MVC. And a good example of that would be something like Ruby on Rails or PHP
- CodeIgniter. These frameworks actually have folders in their file structure called or folder structure called models, views, and controllers. And then
- something like Django for Python just borrows certain concepts, but doesn't actually have that strict folder structure.
- And then another thing that can happen is one framework will put one aspect of the app in the controller and then another one would put it in the model.
- So, I think that's why MVC is so confusing because there's not just one way to do it. There's actually many, many ways to do it.
- All right. So, we're going to now get into the three components of MVC, which is model view controller. So, first we have the model, which is responsible for
- getting and manipulating the data. So, it's basically the brain of the application. Usually, it interacts with some kind of database. This could be a
- relational database like MySQL or a NoSQL database like MongoDB. It really doesn't matter and in many frameworks uh that support multiple databases, the
- model code will stay the exact same. Okay? It's just the database driver that needs to change. And it doesn't even uh it doesn't even have to be a database
- that works with it. It could be a simple file. Okay? So, you could just you could have your model interact with a JSON file and pull data from that.
- All right. So, it takes care of queries like select, insert, update, delete. The model also communicates with the controller. In most cases, the
- controller can request data through the model. And in most cases, the controller updates the view, but with some
- frameworks, the model can actually update it directly, update the view. Another example of what makes MVC complicated. So, just realize that
- there's different implementations and they can act differently from framework to framework. All right. So, next we have the view and
- you can probably guess what that takes care of. That that's the actual view of the application. So, it's the user interface. It's what the user sees when
- they interact with the application. So, the view usually consists of HTML and CSS along with dynamic values sent from the controller. So, the controller
- does communicate with the view uh as well as the model. Now, depending on which framework you use, the template engine may vary. And the template engine
- is what allows dynamic data. If you have straight HTML, we can't output variables. We can't use logic like an if statement. So, with template engines, we
- can do that stuff right in the view or or right in the template. So, some examples of template engines would be Handlebars, Dust. These are based on
- JavaScript. Then we have um for Ruby on Rails, we have ERB, which is embedded Ruby. Um you can also use Haml, HAML. And then with Python, you have Flask. Uh
- I'm sorry. With Flask, you have uh Jinja or Jinja2. And there's a lot more of them out there, and some do more than others. Some are better than others. But
- uh you have a lot to choose from, especially with JavaScript. All right. So, finally, we have the controller. And the controller takes in
- user input. So, this could be from uh from a user visiting a page or clicking a link, which makes a get request, or submitting a form, which makes a post
- request. And we also have delete requests, put requests uh for updating. And these can't be made directly from the browser. From the browser, you can
- only do a get or a post. But we do have HTTP clients that are at times built in with the framework that can do that. Now, the controller acts as kind of a
- middleman between the model and the view. The controller will ask the model to get some data from a database, and then the controller will take that data
- and load a view and pass that data into it, okay? And then from there the template engine takes over and can basically do some logic, do some output
- for the variables and things like that. All right. And the controller can also load a view without passing it data. So, just a plain web page with HTML and CSS,
- no no actual templating logic. So, here's a very simple example or diagram. Now, we have the user which sees the view of the application in the
- browser and it can make some kind of request with input to what's called a router, okay? And the request could be some kind of link that they clicked on,
- some kind of route. And then the router will call a specific controller method based on that route. And if data is needed, if you need to fetch some data,
- the controller will then interact with the model which interacts with the database. And then once the controller gets that data passed back, it can then
- load a view and it can send the data to the view and it'll get dealt with by the template engine, okay? And then once that's all done, it'll send
- it'll send the view back to the browser for the user to see. Okay, so hopefully that was hopefully you could understand that at least just
- a little bit. It's it is it's a little tough to to explain. All right. So, now we just want to take a look at some pseudo code that I wrote.
- This isn't in a a particular language. This isn't code that's going to work anywhere. It's just an example. So, how this whole thing works with MVC is you
- get some user input. In this example, we'll say the user clicked a link or or wrote in the URL yourapp.com/user/profile/1.
- So, ultimately they want to view the user's profile that has the ID of one. So, the first thing it's going to do is go into the routes and it's going to
- see if see what it matches. So, it would match this because it's users/profile, and then excuse me, /1. Now, one can change. I
- mean, obviously, you don't want to just load this one profile all the time. This could be anything. So, that's why we have the colon here in front of the ID.
- It's kind of like a placeholder. All right. So, it's going to match that route, and then we're going to just basically
- call this users .getprofile and pass in the ID. Okay. So, this is calling the users controller right here. Okay. And the class is going to match
- this in most cases. And that's going to have a function of get profile. You can see that's right here. It takes in an ID. And then what
- it's going to do is grab a variable profile and set it equal to this.userModel.getprofile
- ID. So, now it's calling a function called get profile within the model. Okay. And if we go down here in the user model class, we do have a function
- called get profile, and it's passing the ID in. So, this is where we want to interact with the database, because that's what the model does. So, it's
- calling this.db.get and passing in a query select all from users where the ID is equal to the ID that's being passed in. It's going to
- get that. It's going to put it in a variable called data, and then it's going to return that data back. Okay. So, that when it gets the data
- back, it'll be put in this profile variable. So, now we want to do is render a view. So, we're going to render a view that's
- in the users folder, and then profile. And we're going to pass the data we got into the view. Okay. And then down here in the actual
- view file, the template engine will basically make it so that we can insert these dynamic values right in the HTML.
- Um many of them use this syntax, the double curly brace. Some use one curly brace. Some use percent signs and curly braces. So, it's all different depending
- on what engine you're using. Um So, what it's doing is it's going to display the user's name in the H1, and
- then an email and a phone number in the list item. Okay, so that's how that all works. Hopefully, that was somewhat clear and
- you can understand. To me, this code uh looks a lot like CodeIgniter for PHP. But, um you know, they're all relatively sim- similar in
- some way. Okay, they all go by um you know, the model being the data and the controller being kind of the
- traffic controller and the view being what the user sees and also um interacts with. All right, so hopefully you guys liked
- this. Please subscribe if you're not. Please leave a like if you did like it. You can leave a dislike if you didn't. And thanks for watching.
Zum Nachlesen
Model View ControllerModel View Controller (MVC, englisch für Modell-Ansicht-Steuerung) ist ein Entwurfsmuster zur Unterteilung einer Software in die drei Komponenten …
VIPER (Entwurfsmuster)Es bezeichnet somit die einzelnen Bestandteile einer Softwarearchitektur und dient ähnlich wie Model View Controller oder Model View ViewModel zur Trennung …
Model View ViewModelModel View ViewModel (MVVM) ist ein Entwurfsmuster und eine Variante des Model-View-Controller-Musters (MVC). Es dient zur Trennung zwischen Darstellung und …
GeschäftslogikIn Verbindung mit der Objektorientierung wurde der Gedanke der Geschäftslogik zu sogenannten Geschäftsobjekten erweitert. Beim Model-View-Controller-Paradigma …