Learning Laravel 6 and VueJS for Javascript/NodeJS developer part 2 - Directory Structure explained

#vue #laravel #php #javascript

In part one, we installed laravel, its dependencies, and then run our app. In this part, we will talk about the structure of your project. At first, it can be overwhelming because laravel creates a lot of directories and files. After this blog post, it should be more clear to you where to find things and how to navigate around your project.

The root directory structure

Directory	Description
app	The main PHP code of your application. We will go deeper into this folder in the next chapter
bootstrap	This is where your `app.php` is, which is the start of your application. It also contains a folder called `cache`. This folder has some generate files by laravel to optimize the speed of your app
config	What do you think is in this directory? Yes, it has a lot of configuration files. Some of them are hardcoded in these files, and some are loaded from the .env file in the root directory
database	Here are all the files you need for your database. We will also talk about this in a later chapter
public	This directory exposes your app to the world. Everything here is publicly accessible by everybody. Every request goes through the `index.php`
resources	This is another essential directory. Here you will add all your raw javascript, assets, and CSS files. This is where the most of the frontend magic will happen
routes	The routes directory hold all your routs. The `web.php` file is where you will usually work the most with. We will talk about this more in another chapter.
storage	Here are all the files that are generated by laravel. Usually, you don't have to touch this directory.
tests	Here you should write your `PHPUnit` tests. We will talk about this in another chapter.
vendor	This is the `node_modules` folder of `composer`. You should not touch this folder and let `composer` handle all of it for you.

Now let's have a look at the root directory files.

Files	Description
.editorconfig	This file has some information for your code editor. For example, what `charset` to use and if the editor should use tabs or spaces and so on.
.env, .env.example	The `.env` file contains all your environment variables. It has general information about the app and also the database connection information and much more important information
.gitattributes	This is a `git` specific file. It helps `git` to better understand your file structure. Please comment down below if you want to know more about this file.
.gitignore	This file tells `git` what paths or files it should ignore.
.styleci.yml	A PHP coding style continuous integration service https://styleci.io/
artisan	the artisan command you run in the command line.
composer.json	If you are coming from nodejs then you can think of this file like the package.json. It has your dependencies and extra information needed for `composer`
composer.lock	This file is generated by composer and has the dependency tree of your application. You should not touch this file directly.
package.json	Your javascript dependencies file. It is like the composer.json file but for your javascript dependencies
phpunit.xml	Here, you can find your PHPUnit configuration.
server.php	This file is your development server and should only be used for this purpose. It is run when you type `php artisan serv`
webpack.mix.js	This is your webpack configuration, but it uses `Laravel Mix`. We will talk about `Laravel Mix` in a later chapter.