Directory Structure

Config/ ├── config.php Database/ ├── Factories/ ├── Migrations/ ├── Seeds/ ├── json/ ├── DatabaseTableSeeder.php ├── SampleDataTableSeeder.php Helpers/ Http/ ├── Requests/ ├── Middleware/ ├── Controllers/ ├── Backend/ ├── Frontend/ ├── FrontendController.php Libraries/ Models/ node_modules/ Providers/ Resources/ ├── assets/ ├── css/ ├── js/ ├── sass/ ├── lang/ ├── views/ ├── backend/ ├── frontend/ ├── layouts/ ├── default.blade.php ├── home.blade.php ├── welcome.blade.php ├── pages/ ├── index.blade.php Routes/ ├── api.php ├── backend.php ├── frontend.php Tests/ Vue/ ├── layouts/ ├── pages/ ├── routes/ ├── store/ ├── vaahvue/ ├── app.js composer.json package.json package-lock.json webpack.mix.js

# Blade File

At VaahCms/Themes/BlogTheme/Resources/views/frontend/ directory you will find 3 blade file.

  • Default: When the link has no content or page, you can call this view file.
  • Home: This view file represent the Home Page.
  • Welcome: This view file will shown only in new setup.

# Seeds

Seeds are used to generate necessary data or sample data for the module. At VaahCms/Modules/Articles/Database/Seeds folder you will find two files:

  • DatabaseTableSeeder.php: This seeder file will be called whenever you will activate the module from the backend of the VaahCMS.
  • SampleDataTableSeeder.php: This seeder file will be called whenever you will click on "Import Sample Data" button of the module.

# Assets

In the simplest form, assets means JavaScript, CSS, and images which lie directly under the public directory and are publicly accessible using a URL.

Laravel provides a helper function, asset(), which generates a URL for your assets. You can use this in blade syntax, e.g.

<script type='text/javascript' src='{ { asset('js/jquery.js') } }'></script>

# Compiling Assets

A mix is a configuration layer on top of Webpack, so to run the Mix tasks you only need to execute one of the NPM scripts that are included with the default Laravel package.json file.


It will compile our CSS and JS files and put the build inside a public folder.


If you run npm run production it will actually minify everything and not create a source map for the files. However since it's modified the files are smaller and harder to read.

In VaahCms, Publish path for assets is different from npm run dev & npm run watch. Assets are stored in VaahCms/Themes/BlogTheme/Resources/assets directory and when you reactivate Theme, assets will add to public folder.

We then include this CSS and JS files inside our master blade file. You can see the code inside the file webpack.mix.js file. The webpack.mix.js file resides in the Module and Theme folder.