• Introduction  

    Magento 2 is a latest upgrade of magento and also a ecommerce-platform built on Open-Source technology for making Ecommerce Websites for Online Merchants. Magento 2 Contains various tools that prove to be helpful for the Development, Testing, Cache Management, SEO process. Apart from other frameworks Magento 2 works on MVVM Architecture(Model View ViewModel) .


    Before Beginning with the Installation we should have a basic understanding about languages such as  XML, HTML , CSS and PHP. Since there will be a lot interaction between these Programming languages.


    1. Beginning with the Installation, we will be downloading and Installing Magento from its official website. Here is the link for Downloading Magento 2.2.7 : Download Magento 2.2.7. Also you might have to register on its official site to download the zip format of Magento 2.2.7 files.

    2. Once the zip file has been downloaded. We have to extract the file to the destination folder from where we can access magento from our localhost server. After Extracting the folder we have to provide the permission to that folder using the following command in terminal:   

    sudo chmod 775 -R /path/to/your/MagentoDirectory/

    3. Now Open your web browser and type the following link i.e : "localhost/MagentoDirectory".

    This will open Magento Setup Page. Now Click on the 'Agree and Setup Magento' button.

    Step 1: On the Next page click on 'Start readiness Check' as shown below:

    Once we click on the Readiness Check Button Magento will look for the required permissions, extensions, settings and php version. If everything is correct you will get a screen like this :

    Step 2: Clicking on the 'Next' button will take to the database configuration page. Create a database on the mysql server and feed that database details on configuration page. Once the details are filled properly, click on the next button.

    Step 3: The next step is the Web Configuration which will show your store and admin panel url, for chrome users we recommend that we keep url with ip address instead of localhost because you will not be able to login and register on the store site.

    We can fill the details in the following way and click next :


    Step 4: The next step will be Customization of your store where you can select the Timezone, Currency and Language. Once the details are selected, click on next.

    Step 5: Fill the admin account details for the store and click on next.

    Step 6: Click on Install Now.

    Now Magento 2.2.7 is installed on your system

    Magento 2.2.7 Architecture

    Magento's Architecture was made in such a way that the source code could be as modularised and extensible to a great extent. The reason behind this approach was to make Magento more adaptable as well as customizable according to the requirements.

    Customizing basically refers to changing of source code in such a way that the behaviour of your platform changes, but if we use best practices for coding then we can avoid such changes in the core code. This would help to be beneficial for our project because we can keep our project up to date with the latest security updates.

    Magento is a MVVM(Model View ViewModel) system. MVVM is closely related to MVC. The MVVM architecture has a  more robust separation between the Model and the View Layers. The explanation for those Layers is as follows :

    1. Model

    The Model Consists of the Business logic of the Application, Model depends on the ResourceModel Class for Database Operations. Models rely on Service Contracts to Expose their functionality with the other layers of  the Application.

    2. View

    The View basically consists of the structure and layout that we see on the screen (i.e. HTML). This is made possible with the help of PHTML files in each Module. The PHTML files are connected to each ViewModel  in the Layout XML files, which are referred to a Binders in MVVM local language. Also the layout files can assign JavaScript files that can be used in final page.

    3. ViewModel

    The ViewModel Interacts with the Model Layer of the Application, by getting required information to the View Layer. In Magento this is handled by Block Class of the Module. In MVC this would be the role of Controller but in MVVM the role of the controller is render a page, receive data or to redirect to another page.

    Folder Structure

    All the core modules are located in the Vendor > Magento directory .

    The Folder structure of each Module is as follows :

    1. Api : Service Contracts, defining Service and Data Interfaces.

    2. Block : This Folder has the ViewModel of the MVVM Architecture.

    3. Controller : Controller is responsible for redirection, rendering and receiving data of a page.

    4. etc : The etc folder consists of the XML configuration files of the module (models, routes, blocks, observers, cron jobs ). The etc files can be used to override the functionality of a non-core module in Magento.

    5. Helper : Helper Classes holds the code for used in More than one application layer. For example: in the cms module the hepler class is responsible for preparing html for presentation in the browser.

    6. i18n : The i18n file holds the Internationalization CSV files that are used for translation.

    7. Model :  Model Consists of the Model and ResourceModel Files.

    8. Observers : Contains observers which holds Models for observing System Events.

    9. Setup : For Migration , schema and data Creation.

    10. Test : For Unit tests.

    12. UI : UI elements such as grids and forms that are used in the admin site.

    13. View :  Consists of the layouts and templates(PHTML) files for frontend and admin site.

    Here is the folder Structure of a module for a better Understanding  :

    References: https://www.toptal.com/magento/magento-2-tutorial-building-a-complete-module

0 Years in
0 Loyal
0 Successful

Words from our clients


Tell Us About Your Project

We’ve done lot’s of work, Let’s Check some from here