Project Structure

It consists of information about how the project structure looks like containing various folders and sub-folders inside it so that it will be easy for users to identify it

Downloaded Zip File Structure

Web ng Starter File Structure
  • Documentation: It will explain how to setup this project, configure and customize the application.

  • License: Terms and conditions for use, reproduction and distribution of this software piece.

  • angular: Angular UI version available in this directory. It develop with latest angular 5.X version with angular-cli. It has more than 100 components and page UI. All the product data render through JSON file. It's quite easy to integrate any Rest API and easy to customize to build any type web applications.

  • React : React + Redux version coming very soon.

Angular Code Structure

Inside app folder we have all the project File.

This project created with angular-cli and follow modular approach . You can changes it as own needs.

src > app : It's a main folder where you start own development work .

  • Layout: It have some common module that will use throughout the app like header and footer components.

  • Pages: It contains all the page modules like Home, Shop, Account, UI Components etc. You can Go inside any of these modules and you can see it has several components that we import in our module.ts. All these submodule then imported in our main module app.module.ts. You can remove or delete or add any components inside any module.

  • typeScript: Some of MDB component we have added inside this directory like calendar, timepicker etc. You don't need to do anything inside this directory.

  • Components CSS: If you want to customize any components css directly add own css inside components.scss file. You can see each component directory has HTML, SCSS and TS file. You can add all the custom css inside scss file.

src > asserts > Theme: It has all the scss file required in template.

main.scss: You can see in main.scss we have import each scss file. base, components, helpers, layout, modules, ng-bootstrap. If you want to changes any of these scss file you can do as well. If you add any more modules you can create scss file in this directory and include into your main.scss. It always best practice to write inside components so in future if we release next version it will easy for you to update project.