{"id":14973425,"url":"https://github.com/merty/angular-boilerplate","last_synced_at":"2025-10-27T01:30:33.959Z","repository":{"id":35821147,"uuid":"40103888","full_name":"merty/angular-boilerplate","owner":"merty","description":"An opinionated boilerplate project for AngularJS applications, crafted with best practices in mind.","archived":false,"fork":false,"pushed_at":"2016-09-18T21:56:32.000Z","size":21,"stargazers_count":85,"open_issues_count":2,"forks_count":3,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-02-01T01:25:07.394Z","etag":null,"topics":["angular1","angularjs","boilerplate"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/merty.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-08-03T03:48:48.000Z","updated_at":"2023-03-11T17:23:52.000Z","dependencies_parsed_at":"2022-09-01T13:00:36.618Z","dependency_job_id":null,"html_url":"https://github.com/merty/angular-boilerplate","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/merty%2Fangular-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/merty%2Fangular-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/merty%2Fangular-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/merty%2Fangular-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/merty","download_url":"https://codeload.github.com/merty/angular-boilerplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238418217,"owners_count":19468865,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular1","angularjs","boilerplate"],"created_at":"2024-09-24T13:48:42.027Z","updated_at":"2025-10-27T01:30:33.648Z","avatar_url":"https://github.com/merty.png","language":"JavaScript","readme":"# angular-boilerplate\n\n[![Build Status](https://travis-ci.org/merty/angular-boilerplate.svg?branch=master)](https://travis-ci.org/merty/angular-boilerplate)\n[![Code Climate](https://codeclimate.com/github/merty/angular-boilerplate/badges/gpa.svg)](https://codeclimate.com/github/merty/angular-boilerplate)\n[![devDependency Status](https://david-dm.org/merty/angular-boilerplate/dev-status.svg)](https://david-dm.org/merty/angular-boilerplate#info=devDependencies)\n\nAn opinionated boilerplate project for AngularJS applications, crafted with best practices in mind.\n\n## Getting Started\n\nIt is highly recommended that you read the project yourself to have a better understanding of how the project is composed.\n\nIn addition to that, sample codes provided within the project are also thoughtfully written so following those practices (such as using IIFEs and choosing named functions over anonymous functions) should also be helpful.\n\nBelow you can find instructions on using the project, an outline of how the project is composed and brief explanations of parts of the project.\n\n## Usage\n\nInstall the packages from NPM and Bower repositories:\n\n```\n$ npm install\n```\n\nPerform the build operations using Gulp:\n\n```\n$ npm run build       # Builds for production\n$ npm run build-dev   # Builds for development\n```\n\nServe the application using Browsersync: *(for development purposes)*\n\n```\n$ npm run-start       # Serves the production build\n$ npm run-start-dev   # Serves the development build\n```\n\nRun unit tests using Karma:\n\n```\n$ npm run test-unit\n```\n\nRun end-to-end tests using Protractor:\n\n```\n$ npm run start-test  # Start a web server for testing\n$ npm run test-e2e    # Run the tests\n```\n\n## Directory Structure\n\nThe root directory is composed of directories `src` and `tests`, as well as configuration and deployment-related files.\n\n`src` directory contains every single file the application needs to run. Think of this directory as the public facing directory.\n\n`tests` directory contains integration-testing-related files. It comes with an `e2e` directory by default where you can place your end-to-end testing files.\n\nThe rest of the files are either to configure the development environment or to handle various deployment processes.\n\n```\n.\n├── src                                # Complete client application\n│   ├── app                            # AngularJS application files\n│   │   ├── components                 # Directive definitions\n│   │   ├── core                       # Core module\n│   │   ├── modules                    # Application-specific modules\n│   │   │   └── home                   # An example module\n│   │   └── services                   # Service definitions\n│   ├── assets                         # Third-party or non-JS assets\n│   │   ├── images                     # Image files\n│   │   ├── stylesheets                # CSS files\n│   │   └── vendor                     # Third-party assets\n│   │       ├── angular                # AngularJS core\n│   │       ├── angular-loader         # AngularJS module loader\n│   │       ├── angular-mocks          # AngularJS mocking library for unit tests\n│   │       ├── angular-route          # AngularJS routing library\n│   │       ├── angular-sanitize       # AngularJS HTML-sanitizing library\n│   │       └── html5-boilerplate      # HTML5 Boilerplate library\n│   ├── build                          # Combined and minified CSS \u0026 JS files\n│   └── layout                         # Partial HTML files for the application layout\n├── tests                              # Integration tests\n│   └── e2e                            # End-to-end test specifications\n├── .bowerrc                           # Bower package definition file\n├── .editorconfig                      # Editor configuration file\n├── .gitattributes                     # Git configuration file\n├── .gitignore                         # Git configuration file\n├── .jscsrc                            # JSCS configuration file\n├── .jshintrc                          # JSHint configuration file\n├── .travis.yml                        # Travis-CI configuration file\n├── LICENSE                            # Project license text\n├── README.md                          # The file you are reading right now\n├── bower.json                         # Bower dependencies file\n├── gulp.conf.json                     # Gulp configuration file\n├── gulpfile.js                        # Gulp tasks for build automation\n├── karma.conf.js                      # Unit-testing configuration\n├── package.json                       # Node.js package definition file\n└── protractor.conf.js                 # End-to-end testing configuration\n```\n\n## App Structure\n\nThe AngularJS application has its own directory inside the `src` directory. Everything AngularJS (except the third-party libraries) should be within this directory.\n\nApp module is the main module, therefore it resides at the root of the `src/app` directory, together with its own configuration file.\n\n```\nsrc/app                                # Everything that composes the AngularJS app is here\n├── components                         # Directive definitions\n├── core                               # Core module\n├── modules                            # Application-specific modules\n├── services                           # Service definitions\n├── app.config.js                      # App configuration\n└── app.module.js                      # App module definition\n```\n\n## Core Module Structure\n\nCore module is considered special, therefore it has its own directory within the `src/app` directory.\n\nCore module is responsible for loading global dependencies such as `ngRoute` and `ngSanitize`.\n\n```\nsrc/app/core/                          # Has its own folder within the app directory\n├── core.config.js                     # Configuration\n├── core.module.js                     # Module definition\n└── core.route.js                      # Route definition\n```\n\n## Sample Module Structure\n\nEach module has its own directory to increase its reusability.\n\nIf the module has partial HTML files, they can be stored in a `partials` directory within the module.\n\nUnit test specifications are also stored together with the module to make it easier to write unit tests as you go.\n\n```\nsrc/app/modules/home/                  # Should have its own directory under app/modules\n├── home.controller.js                 # Controller definition\n├── home.html                          # HTML file associated with the module, if any\n├── home.module.js                     # Module definition\n├── home.route.js                      # Route definition\n└── home.spec.js                       # Unit tests for the module\n```\n\n## Sample End-to-End Test for a Module\n\nEach module has its separate end-to-end test scenario file within the `tests/e2e` directory, named as `\u003cmodule\u003e.scenario.js` where `\u003cmodule\u003e` represents the name of the module.\n\n```\ntests/e2e/                             # Under the directory for end-to-end tests\n└── home.scenario.js                   # Test file, named as \"\u003cmodule\u003e.scenario.js\"\n```\n\n## Extras\n\nThis project comes with JSCS and JSHint pre-configured for you. You may make changes on them to your taste by editing `.jscsrc` and `.jshintrc` in the root directory. These tasks run each time you run `npm run build`, as a part of the `build` task defined in `Gulpfile.js`.\n\nYou can also run the build sequence manually:\n\n```\n$ npm run gulp build\n```\n\n...or maybe build for development purposes:\n\n```\n$ npm run gulp build:dev\n```\n\n...or just run the JS task which also runs js:style, js:lint and js:deps tasks:\n\n```\n$ npm run gulp js\n```\n\n...or simply just run JSCS and JSHint:\n\n```\n$ npm run gulp js:style\n$ npm run gulp js:lint\n```\n\nIf you have `gulp` installed globally, you may omit `npm run` in the commands listed above. For other Gulp tasks, please take a look at `gulpfile.js`.\n\n## Changelog\n\n**0.3.0**\n\n* Updated dependencies\n\n**0.2.0**\n\n* ngRoute is replaced with UI Router\n* CSS and JS bundles are now automatically injected into the HTML file\n* Bower assets are now automatically added to the bundles\n* HTML files are now compiled and cached using $templateCache\n* Integrated Browsersync to make development easier\n* Added JS files in the root directory to the linting\n* All gulp plugins are now used via gulp-load-plugins\n\n**0.1.0**\n\n* Initial release.\n\n## Author\n\nMert Yazicioglu - [Website](https://www.mertyazicioglu.com) \u0026middot; [GitHub](https://github.com/merty) \u0026middot; [Twitter](https://twitter.com/_mert)\n\n## License\n\nThis project is released under the MIT License. See the `LICENSE` file for details.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmerty%2Fangular-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmerty%2Fangular-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmerty%2Fangular-boilerplate/lists"}