Thoughts on todotasks repo

thoughts.md

Creating a new Task Runner Example

README.MD

Every task runner should have a README.MD file with the following sections:

• Overview

  • Explain the focus/goals of the task runner and include links to resources and tutorials.

• Highlights

  • Describe all the things that this task runner is known for being very good at doing.

• Considerations

  • Describe the tasks/situations not suited for this task runner. This should include any special cases, incompatiblities, or weak points that should be considered.
  • It can be tough to point out the problems in the tools that you love, but please be as honest and objective as possible.

Tasks

Your task runner example must implement all of the tasks below. Each task should be mapped to an npm script prefixed with todotasks:in the package.json file.

Example package.json:

{
  "name": "todotasks-template-gulp",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "todotasks:lint": "gulp lintme",
    "todotasks:dev": "gulp watchmystuff"
  },
  "author": "",
  "license": "ISC"
}

(((With these mappings, we can create a scripts to measure and validate each task runner example. Validation could be part of the acceptance of PRs... Metrics could include things like timings for tasks and number of dependencies. )))

todotask:clean Delete all files in the dist directory.

todotask:lint Run eslint on all js files in the src/plainjs directory using thje .eslintrc file included in the template.

todotask:stylus Use stylus to compile /src/stylus/*.styl and output to /dist/stylus.css

todotask:sass Use none-sass to compile /src/css/*.scssand output to /dist/sass.css.

todotask:uglify Take all JavaScript from /src/plainjs/*and generate a single concatenated+uglify'd file at dist/ugify.js. Please use uglfy for this task.

If you need to write the concatenated file to the filesystem before uglifying, write it to dist/concat.js.

todotask:transpile Take all JavaScript from src/es6/* and transpile all files to es5. Output a single concatenated file to dist/es6.js.

todotask:browserify Use browserify to generate dist/browserify.js from the file src/commonjs/app.js

todotask:webpack Use webpack to generate dist/webpack.js from the file src/commonjs/app.js

todotask:build This task should perform all of the above tasks in order. Note that this should use the task runners own internal task references (do not use the todotask:*npm scripts).

todotask:dev This is the most complicated task. It should watch src/plainjs for changes and when a change is detected do the following: - run eslint against all files insrc/plainjs and display any errors to stdout. Linting errors should not stop this task. - rebuild a concatenated+uglify'd file at dist/ugify.js. To make this task fast, strive to rebuild only what needs to be rebuilt.

(((other potential tasks to add

• sprite generation?
• smoke tests?
• image compression?)))

WIP Notes

Potential repository structure:

├── CONTRIBUTING.md
├── package.json
├── README.md
├── scripts
│   ├── generate-metrics.js //analyze all examples
│   └── validate-task-runner.js // validate an example
├── template // copy this dir for new examples
├── todotask-blah
├── todotask-grunt
└── todotasks-gulp

template - this is the default set of files to use whne creating a new task runner example. As described in the tasks above, the files are quite arbitrary (instead of being a real project) in order to keep things even simpler. It may still be a good idea to include a fully working app in each example as well... maybe a todomvc directory where we ask for a fully functional example that is not part of the metrics and is loose on requirements to give some freedom. Thoughts on this?

generate-metrics.js - for each task runner example, capture a series of metrics and spit out a little report. Can be pretty quick/dirty - timings for build task - analyze package.json and count required dev dependencies

validate-task-runner.js -- this would be a series of tests that would ensure the example meets the requirements. It can start out simply as a script that runs npm run todotask:build then verifies that all the output files exist. It could evolve from there as needed

Notes:

Kill todotasks: prefix. All scripts should be todotasks, so a todotasks prefix is not needed, and only adds typing.

Kill stylus - only one css transform task is needed. This isn't about picking which css preprocessor is best. It's about getting a general overview of which taskrunner is best suited for a tech-agnostic general purpose build system.

Kill transpile.

Kill webpack.

Again, this is about general purpose build systems, not about specific tech implementations. We'll look at webpack vs browserify elsewhere.

├── todotask-blah
├── todotask-grunt
└── todotasks-gulp

What's the purpose of these?

├── template // copy this dir for new examples

Where do we store implementations? I think it would be instructive to have a place for them so that we can automatically build a website similar to TodoMVC from this repo.

Please discuss here.