Magento Directory and File Structure

If you find Files and folders structure in Magento 2 sophisticated and difficult to understand, this article is meant for you! I’ll show you precisely what is stored in every file and how they are displayed in Magento 2.X.

Magento folder structure

The folder structure in Magento 2 is quite different from Magento 1’s. If you navigate through the root directory of Magento 2, you’ll see the folder structure like below:

app: Contains the core files of Magento 2.

By default, there are three sub-directories: design, i18n and etc.

• design/frontend: for storefront themes
• design/adminhtml: for admin themes
• i18n: stores language packages
• etc: contains the di.xml configuration file

You can also create the app/code directory to contain custom modules, we’ll explain the reason later.

bin: Contains Magento CLI executable script. The CLI script activates Magento commands that can be used to enable/disable cache; enable/disable modules; run an indexer, etc.

dev: automated functional tests and a few other tools for developers are stored here.

lib: Includes internal and web directories.

• internal: contains server-side libraries and several font files.
• web: contains client-side (JavaScript) libraries, jquery, modernizr, requirejs, prototype, scriptaculous.

phpserver: Has the Router.php file, which can be used to implement the PHP built-in server. It’s not recommended to work with this file as it may cause potential security holes on your site.

pub: Contains index.php controller and all the publicly accessible files. It should be set as your web root on the server you use. 

setup: consists of files related to Magento’s installation setup.

var: includes raw cache files, logs, sessions, and reports.

vendor: This directory is generated by composer using composer.json file. It includes packages that have been defined under composer.json file.

Structure of Component Files

*Components are recommended to be placed in <Magento install directory>/app. If installed in the <Magento root dir>/vendor directory, Magento will add them to <Magento install directory>/.gitignore file.

Required files

These files are required for all installed components:

registration.php: the component will be registered with Magento with this file. And the component’s root directory name is used as the component name.

etc/module.xml: defines the basic information about the component like component dependencies and version number. 

composer.json: defines the dependencies that the component will need at runtime.

Module File Structure

Here is a typical Magento 2 module file structure:

Common directories

Below are the common module directories:

Block: contains PHP view classes as part of Model View Controller(MVC) vertical implementation.

Controller: has PHP controller classes.

etc: consists of configuration files; in particular, module.xml (required).

Model: includes PHP model classes.

Setup: has classes for module database structure and data setup. The data is invoked when installing or upgrading.

Additional directories

You can insert additional folders like the following:

Api: contains PHP classes exposed to the API.

Console: stores CLI commands. 

Cron: includes cron job definitions.

CustomerData: contains section files.

Helper: contains aggregated functionality.

i18n: has localization files.

Observer: contains files for executing commands from the listener.

Plugin: stores needed plug-ins.

UI: consists of data generation files.

view: includes view files like static view files, design templates, email templates and layout files.

Theme file structure

A typical theme file structure looks like this:

├── composer.json
├── etc
│   └── view.xml
├── i18n
│   └── en_US.csv
├── LICENSE_AFL.txt
├── LICENSE.txt
├── media
│   └── preview.jpg
├── registration.php
└── web
    ├── css
    │   ├── email.less
    │   ├── print.less
    │   ├── source
    │   │   ├── _actions-toolbar.less
    │   │   ├── _breadcrumbs.less
    │   │   ├── _buttons.less
    │   │   ├── components
    │   │   │   └── _modals_extend.less
    │   │   ├── _icons.less
    │   │   ├── _layout.less
    │   │   ├── _theme.less
    │   │   ├── _tooltips.less
    │   │   ├── _typography.less
    │   │   └── _variables.less
    │   ├── _styles.less
    │   ├── styles-l.less
    │   └── styles-m.less
    ├── images
    │   └── logo.svg
    └── js
        ├── navigation-menu.js
        └── theme.js

Common directories

etc: includes configuration files such as the view.xml file which contains image configurations for all images and thumbnails.

i18n: Translation dictionaries.

media: Theme preview images can be stored here.

web: Optional directory that contains static files organized into the following subdirectories:

• css/source: Contains a theme’s less configuration files that invoke mixins for global elements from the Magento UI library and the theme.less file that overrides the default variables values.
• css/source/lib: includes view files that override the UI library files stored in lib/web/css/source/lib.
• fonts: folder for the different fonts for your theme.
• images: folder for Static images.
• js: folder for JavaScript files.

Language package file structure

This is a typical directory structure for two language packages:

├── de_DE
│   ├── composer.json
│   ├── language.xml
│   ├── LICENSE_AFL.txt
│   ├── LICENSE.txt
│   └── registration.php
├── en_US
│   ├── composer.json
│   ├── language.xml
│   ├── LICENSE_AFL.txt
│   ├── LICENSE.txt
│   └── registration.php

The top-level directory is required for language packages. To identify the locale, it’s recommended that the directory name match the ISO code.

So this is the file structure in Magento 2. Understanding the structure and each folder’s structure can help you with the installation of new extensions and custom code implementation.