#native_company# #native_desc#
#native_cta#
  1. AngularJS Migration
  2. Case Study
  3. Project Structure

Project Structure

Hopefully at this point, you have the project set up successfully with a working contacts application up and running on your localhost. Let’s now take a look at the project structure to understand how everything is organized.

Files and folders

The project structure for the application is as follows:

data/
db.json
orig-db.json
node_modules/
src/
 app/
 css/
 img/
 libs/
 templates/
.bowerrc
.gitignore
.prettierrc
bower.json
package-lock.json
package.json
README.md

data

The data folder contains data for our API server. The orig-db.json file contains the complete database. The db.json file contains the current data of the contacts application. Any changes done to the application will reflect in the db.json file.

Note

Running npm run server will always override the db.json file reverting the application to it’s original state.

app

Contains all the application logic relevant to our application.

app.main.js

This is the initiation point of our application which bootstraps all modules required for our application.

app.routes.js

Contains routing logic for application based on the URL paths specified.

controllers.js

Contains all the controllers of our application.

filers.js

Contains all the filters of our application.

services.js

Contains all the services of our application.

README.md

Contains information such as project setup and execution.

package.json

Holds various meta-data relevant to the project. This file is used to give information to npm that allows it to identify the project as well as handle the project’s dependencies.

bower.json

Holds dependency information for the project via the older dependency management tool, bower. We will be moving from bower to npm during our migration process for dependency management.

index.html

This is the default page for our application.

templates

Contains all the html templates used in various directives and components.

libs

This folder contains all the dependencies installed via bower.

Caught a mistake or want to contribute to the book? Edit this page on GitHub!


Advanced JavaScript

This unique course teaches you advanced JavaScript knowledge through a series of interview questions. Bring your JavaScript to the 2021's today.

Level up your JavaScript now!