Skip to main content

MVC EXPLAINED FOR BEGINNERS

Hola!. In this article, I am going to break down the terrifying design model known as MVC for easy understanding to all. You might consider reading this article as a beginner or maybe preparing for that scary interview ☺.

As usual, many developers just get excited and start writing code without having a good mastery of these concepts which are very necessary in building, programming and writing better code. Hey! friend ☺, don’t think you are reading what won’t help you ok!.

MVC which is known as model view controller is an architectural pattern used in building web apps nowadays. This architectural pattern separated an application into three parts:

  • Model
  • View
  • Controller 

In this article, will explain the following 

  1. Components
  2. Advantages

Now let’s begin with;

COMPONENTS

As mentioned earlier, MVC architectural pattern states that, an application is made up of three parts which are model, view and controller. Now let us break them down;

The view is the user interface. Meaning the view is actually what the user sees like web pages, texts, buttons and any other thing that the user can see.

The model simply represents the data used by the app. It could get data from the database or manipulate data and send to the database.

The control is the main man who accepts user’s requests, sends them to the model and finally tells the view to update what the user is seeing. The controller tells the view and model what to do at the appropriate time. Thus, the name controller!

There’s this illustration I would love to use in simple terms so we get this straight forward step by step how MVC works and how the three components are interconnected pr work together.

  • A user through his browser makes a request along route, like trycoder.com/exams 
  • The controller takes charge of the request and responds based on the request. The request could be to serve a certain page or for the model to carry out a certain logic. If the request requires some logic to be carried out, 
  •  The model performs the logic, get the required data from database and responds according to the controller’s command. 
  •  The controller then passes the data to the view so the user interface can be updated.

So that’s it guys. I leave you with an assignment.

  1. Find out other architectural pattern used in development 

Thanks for reading. Feel free to drop your comments, questions or anything new. See you in the next article where I will show you how this MVC pattern can be implemented in node js and express js.

gracias! 😍
Labels:

Comments

Post a Comment

Please do not enter any spam link in the comment box.

Popular posts from this blog

JavaScript Functions

  Hi there, and welcome to another exciting lesson on JavaScript. If this is your first time here, please do well to check out our previous lessons. In the previous lesson, we were discussing JavaScript math methods. It was very intuitive as we got to learn how to use the various math methods. To proceed, we shall be looking at JavaScript functions.  A function in JavaScript like in every other programming language could be defined as a block of code that is written to perform a particular task, and this function is usually invoked or called before it is being implemented. We have been talking about methods throughout the previous lessons right. Do you know that those methods are actually functions? Yes they are functions. You can now have an overview of the importance of functions in every programming language. How do we create a function in JS? To create a function, you follow the format function functionName(Argument) {//Block of code }. Some functions do have a return val...
Post a Comment
Read more

JavaScript Math Methods

Hello everyone, and welcome to another exciting JavaScript lesson. In the last lessons you have been seeing other methods being used in JS (for example, the string methods). We shall go further into exploring other methods. This time, it’s going to be math methods. Do not move an inch because it’s going to be a very exciting. Before we look at what a math method is, let’s have an overview of math objects. A math object in JavaScript is a static built-in object that includes properties and methods used in performing mathematical tasks. Talking about math properties, they have the syntax Math.property . Some examples are Math.E that returns Euler’s number, Math.PI that returns PI, Math.LN2 that returns the natural logarithm of 2, and many others. The various JavaScript methods contained in the math object, thus, make mathematical operations easier and reduce effort as well as time in math-oriented programming. Some JS methods include abs( ), ceil( ), cos( ), sqrt( ), pow( ), log( ) ...
Post a Comment
Read more

How to generate random numbers using NumP1

Hello. Welcome to another edition on this platform. For more better understanding, do checkout our YouTube channel to get the video tutorial. In this article of today, we are going to see how to generate random numbers using any of the following methods: Generating a random number Generating a random float and integer Generating random number arrays Generating random number from an array What is a random number? This is a number which cannot be predicted before its occurrence. This number might not different every time. Programmatically, they are two categories of random numbers:     Pseudo-Random numbers       True Random numbers. Just as programs which are written by programmers are a set of instructions, we must follow an algorithm to generate random numbers. Random numbers which are generated using an algorithm are called Pseudo-Random numbers. To generate a true random number, it is important to get the data from sources such as the keyboards, mou...
Post a Comment
Read more