{"id":13481922,"url":"https://github.com/dsebastien/modernWebDevGenerator","last_synced_at":"2025-03-27T12:31:47.252Z","repository":{"id":57247967,"uuid":"42766836","full_name":"dsebastien/modernWebDevGenerator","owner":"dsebastien","description":"A Yeoman generator for Modern Web development projects","archived":true,"fork":false,"pushed_at":"2018-06-02T17:30:30.000Z","size":234,"stargazers_count":73,"open_issues_count":66,"forks_count":13,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-03-12T23:48:41.940Z","etag":null,"topics":["angular","yeoman","yeoman-generator"],"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/dsebastien.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.MD","contributing":null,"funding":null,"license":"LICENSE.MD","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-09-19T09:10:35.000Z","updated_at":"2024-11-07T14:40:13.000Z","dependencies_parsed_at":"2022-08-24T16:31:21.240Z","dependency_job_id":null,"html_url":"https://github.com/dsebastien/modernWebDevGenerator","commit_stats":null,"previous_names":[],"tags_count":27,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FmodernWebDevGenerator","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FmodernWebDevGenerator/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FmodernWebDevGenerator/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dsebastien%2FmodernWebDevGenerator/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dsebastien","download_url":"https://codeload.github.com/dsebastien/modernWebDevGenerator/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245845063,"owners_count":20681826,"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":["angular","yeoman","yeoman-generator"],"created_at":"2024-07-31T17:00:57.463Z","updated_at":"2025-03-27T12:31:46.991Z","avatar_url":"https://github.com/dsebastien.png","language":"JavaScript","readme":"# Modern Web Dev Generator\n\n[![NPM version](https://img.shields.io/npm/v/generator-modern-web-dev.svg)](https://www.npmjs.com/package/generator-modern-web-dev)\n[![Downloads](https://img.shields.io/npm/dm/generator-modern-web-dev.svg)](https://www.npmjs.com/package/generator-modern-web-dev)\n[![Build Status](https://secure.travis-ci.org/dsebastien/modernWebDevGenerator.png?branch=master)](https://travis-ci.org/dsebastien/modernWebDevGenerator)\n[![Coverage Status](\nhttps://coveralls.io/repos/dsebastien/modernWebDevGenerator/badge.svg?branch=master\u0026service=github\n)](\nhttps://coveralls.io/github/dsebastien/modernWebDevGenerator?branch=master\n)\n[![Dependency Status](https://david-dm.org/dsebastien/modernWebDevGenerator.svg?theme=shields.io\u0026style=flat)](https://david-dm.org/dsebastien/modernWebDevGenerator)\n[![devDependency Status](https://david-dm.org/dsebastien/modernWebDevGenerator/dev-status.svg?theme=shields.io\u0026style=flat)](https://david-dm.org/dsebastien/modernWebDevGenerator#info=devDependencies)\n[![Gitter](https://img.shields.io/badge/gitter-join%20chat-green.svg?style=flat)](https://gitter.im/dsebastien/modernWebDevGenerator?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge)\n[![License](https://img.shields.io/cocoapods/l/AFNetworking.svg)](LICENSE.MD)\n\n## About\nModernWebDevGenerator is a [Yeoman](http://yeoman.io/) generator that will help you quickly get up and running with [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild).\n\nProjects created with this Yeoman Generator will be able to directly leverage the awesome Gulp-based build provided by the [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild) project, which includes many tasks and features out of the box (e.g., transpilation of TypeScript/ES2015 to ES5, SASS transpilation to CSS, Minification, Bundling, Code quality \u0026 code style checks, Sourcemaps, support for unit testing, ...).\n\nThis project comes with a fully working Angular 2 configuration.\n\nThis generator includes all the folders \u0026 files listed by [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild) as mandatory as well as the recommended ones so as to promote good practices. README.md files are placed in multiple locations to describe what to put where, provide some guidance/design guidelines, ...\n\nThe generated projects also include:\n* a working setup of Angular 2 (this might later move to a separate sub-generator)\n  * a root component (app/core/boot.ts)\n  * a home page (app/pages/home.ts)\n  * a basic component router configuration\n* a good [HTML5 boilerplate](https://html5boilerplate.com/)\n* a good SASS \u0026 styling starting point\n* an embedded folder structure and design guidelines (componentization, separation of concerns, naming conventions, ...)\n* a set of TypeScript code style/quality rules (tshint.json)\n* a set of ES2015 compliant code style/quality rules (.jscsrc and .jshintrc)\n* ...\n\nThe general idea is that you can remove anything you don't need assuming it's not in the list of mandatory folders/files of [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild) (otherwise you'll break the build ^^).\n\nAny feedback/contributions are welcome to improve the project so don't hesitate!\n\nThis project is available as an NPM package; check out the usage instructions below.\n\n## Demo\nClick on this link to see a demo of how to install \u0026 use this project and the modern web dev build:\n\u003ca href=\"http://www.youtube.com/watch?feature=player_embedded\u0026v=Wc5iTInYOBw\n\" target=\"_blank\"\u003e\u003cimg src=\"http://img.youtube.com/vi/Wc5iTInYOBw/0.jpg\"\nalt=\"ModernWebDev Build and Generator Demo\" width=\"240\" height=\"180\" border=\"10\" /\u003e\u003c/a\u003e\n\n## Background\nPlease note that this project is heavily inspired from:\n* Google's [Web Starter Kit](https://github.com/google/web-starter-kit)\n* [HTML5 Boilerplate](https://html5boilerplate.com/)\n* Brad Frost's [Atomic Design](http://bradfrost.com/blog/post/atomic-web-design)\n* Nicolas Gallagher's [SUIT CSS](https://github.com/suitcss)\n* Countless blog articles\n  * [Dan Walhin](https://twitter.com/DanWahlin)'s TypeScript posts \u0026 course)\n\t* [Introduction to TypeScript](https://www.edx.org/course/introduction-typescript-microsoft-dev201x-0)\n  * A gazillion Gulp articles\n* Many others I'm forgetting :(\n\n## Status \u0026 roadmap\nCheck out the issues/labels \u0026 milestones to get an idea of what's next.\nFor existing features, refer to the previous sections.\n\nCheck out the [change log](CHANGELOG.MD)\n\n## Usage\nIn order to use this generator you first need to install Yeoman:\n\n```bash\nnpm install --global yo\n```\n\nOnce Yeoman is installed, you can install this generator:\n\n```bash\nnpm install --global generator-modern-web-dev\n```\n\nYou will also need to install gulp globally:\n```bash\nnpm install --global gulp\n```\n\nCreate a new folder, go into it then invoke the generator by running the following command:\n```bash\nyo modern-web-dev\n```\n\nOnce you've answered all the questions, the generator will do its thing.\nOnce done, you'll be able to run the development web server and start hacking away using:\n```bash\nnpm start\n```\n\nEnjoy!\n\nNote that the [ModernWebDevBuild](https://www.npmjs.com/package/modern-web-dev-build) project has other tricks in store for you; be sure to check out [the docs](https://www.npmjs.com/package/modern-web-dev-build).\n\n## Options\nThere are two main approaches to use this generator:\n* interactive mode: the generator asks you all the questions\n* batch mode: you provide the information directly to the generator\n\nIn practice nothing prevents you from mixing both though :)\nIf you pass a setting directly to the generator, it will not prompt you for that value.\n\nYou can list all the options with a brief description using `yo modern-web-dev --help`.\n\nBy default, the generator will install all project dependencies (not the global requirements listed in the 'Usage' section!). You can skip the installation of the project dependencies by passing the `--skip-install` option.\n\nThe generator will check for updates once in a while but you can disable the update check by passing the following flag: `--no-update-notifier`.\n\n## Generated projects dev dependencies\n* [gulp](http://gulpjs.com/): JavaScript task runner\n* [babel](https://babeljs.io/): ES2015 to ES5 transpiler. Needed so that the Gulp configuration file can be written using ES2015 (gulpfile.babel.js)\n* [nodemon](https://www.npmjs.com/package/nodemon): monitoring of certain files (used by npm scripts defined in package.json): https://www.npmjs.com/package/nodemon\n\n## Generated projects runtime dependencies\nThe following dependencies are managed by JSPM (in the JSPM section of the package.json file):\n* [Angular 2](https://angular.io/)\n* [RxJS](https://github.com/Reactive-Extensions/RxJS): Reactive Extensions. Forget about Promises and use Observable, the future of async in JavaScript!\n* normalize.css: Nicolas Gallagher's Normalize CSS (alternative to CSS resets): https://www.npmjs.com/package/normalize.css\n\n## Generated projects configuration files\nThe project includes multiple configuration files.\n\nFor more details about the configuration files, check out the [ModernWebDevBuild](https://github.com/dsebastien/modernWebDevBuild)'s documentation.\n\nHere's some high level information about these:\n* .babelrc: Babel configuration file\n* gulpfile.babel.js: gulp's configuration file. This is where the Modern Web Dev Build tasks are loaded\n* package.json: NPM's configuration file. This is where all dependencies are defined: project ones under 'jspm' and build-related ones under 'devDependencies' (more information: https://docs.npmjs.com/files/package.json)\n* .dockerignore: files that are ignored by Docker when creating images\n* .editorconfig: helps configure code style for various text editors (more information here: http://editorconfig.org)\n* .gitattributes: allows to define git attributes per path (more information here: http://git-scm.com/docs/gitattributes)\n* .gitignore: configures files/folders that are ignored by git\n* .jscsrc: configuration file for JSCS. It defines the JS code style (more information: http://jscs.info/overview.html#options)\n  * note that it is configured to use ES Next (ES2015+)\n  * rules reference: http://jscs.info/rules.html\n  * news: https://github.com/jscs-dev/node-jscs/blob/master/CHANGELOG.md\n* .jshintrc: JSHint configuration\n  * rules reference: http://jshint.com/docs/options\n  * more information: http://jshint.com/docs/)\n* .jshintignore: stuff that JSHint should ignore\n* .travis.yml: Travis CI configuration files (more information: http://docs.travis-ci.com/user/build-configuration/)\n* Dockerfile and DockerfileDev: Docker configuration files used to describe how Docker images should be created for this project (more information: https://www.docker.com/ and http://docs.docker.com/reference/builder/)\n* jspm.conf.js: JSPM/SystemJS configuration file\n* karma.conf.js: Karma test runner configuration file\n* runOnDocker.sh and runDevOnDocker.sh: build scripts that create/run Docker images\n* tsconfig.json: TypeScript compiler configuration. Contains all compiler options, code style rules and file selection/exclusion rules (bypassed by the gulp-typescript plugin!)\n  * http://json.schemastore.org/tsconfig\n  * https://github.com/Microsoft/TypeScript/wiki/tsconfig.json\n* typings.json: typings configuration file: list of TypeScript type definitions files to retrieve\n* tslint.json: TypeScript code style configuration (more information: https://www.npmjs.com/package/tslint)\n* Makefile: for \\*NIX afficionados\n\n## Adding project dependencies\nAs you go along, you'll surely need to add new dependencies for your application. If the dependency you want to add is required at runtime, then you should use JSPM to add it.\nInstalling a dependency with JSPM is as simple as `jspm install x`. For more information about JSPM, check out the official site: http://jspm.io/\n\n## Contributing\nTake a look at the project's open [issues](https://github.com/dsebastien/modernWebDevGenerator/issues) and [milestones](https://github.com/dsebastien/modernWebDevGenerator/milestones).\n\nIf you know what to do then:\n* Fork the project\n* Create a feature branch in your fork\n* Rebase if needed to keep the project history clean\n* Commit your changes \u0026 push to GitHub\n* Try and flood me with pull requests :)\n\n## Building from source\nIf you want to build from source, you need to:\n* install NodeJS (4.2+) and npm (3+)\n* clone this git repository\n* install gulp: `npm install --global gulp`\n* run `npm run setup`\n* start hacking :)\n\n## Releasing a version\n* commit all changes to include in the release\n* edit the version in package.json\n  * respect semver\n* update CHANGELOG.MD\n* commit\n* git tag \u003cversion\u003e\n* git push --tags\n* draft the release on GitHub (add description, etc)\n* npm publish\n\n## Authors\n### Sebastien Dubois\n* [@Blog](https://www.dsebastien.net)\n* [@Twitter](https://twitter.com/dSebastien)\n* [@GitHub](https://github.com/dSebastien)\n\n## License\nThis project and all associated source code is licensed under the terms of the [MIT License](https://en.wikipedia.org/wiki/MIT_License).\n","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdsebastien%2FmodernWebDevGenerator","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdsebastien%2FmodernWebDevGenerator","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdsebastien%2FmodernWebDevGenerator/lists"}