Skip to content
This repository has been archived by the owner on Feb 19, 2022. It is now read-only.

Full archetype including builder-init sample app #1

Merged
merged 57 commits into from Mar 4, 2016
Merged
Show file tree
Hide file tree
Changes from 8 commits
Commits
Show all changes
57 commits
Select commit Hold shift + click to select a range
8a89d4f
Configured with regular and dev archetype w/ starter lint scripts
zachhale Jan 12, 2016
0386eca
Merge branch 'master' of github.com:FormidableLabs/builder-react-app
zachhale Jan 12, 2016
a5b9a00
builder-support generated files
zachhale Jan 13, 2016
bd83f47
Moved all tasks over from converter-react
zachhale Jan 21, 2016
d53b94d
Update configs to be properly linted
zachhale Jan 21, 2016
843f1b0
Fixed hot webpack config
zachhale Jan 21, 2016
2b629e1
Updated README and DEVELOPMENT
zachhale Feb 3, 2016
6553412
Added sample react app for builder-init
zachhale Feb 22, 2016
582b075
Update docs
zachhale Feb 22, 2016
b5c58d6
Add .DS_Store to gitignore
zachhale Feb 23, 2016
7cf0c01
Remove .DS_Store and update .gitignore to keep them out
zachhale Feb 23, 2016
feb288b
Switch from exclude to include
zachhale Feb 23, 2016
41f1f65
Remove escapes from gitignores
zachhale Feb 23, 2016
4fedc58
Return promises in mocha tests instead of funky done callbacks
zachhale Feb 23, 2016
10ecf5f
Un-templatize server util
zachhale Feb 23, 2016
8f9ca79
Pass lint
zachhale Feb 23, 2016
9ff24c0
It's a whiz-bang-app|server, not component
zachhale Feb 23, 2016
928115c
Add node 4 to CI configs
zachhale Feb 23, 2016
2fd37e3
Update gitignores
zachhale Feb 23, 2016
7510490
Recommended builder install
zachhale Feb 23, 2016
f6e4aaa
Update CI node versions
zachhale Feb 23, 2016
a813442
Stage 2 babel
zachhale Feb 23, 2016
580ef2c
Use es6-react-test config defaults and update npm dependencies
zachhale Feb 23, 2016
20ee619
Disable no-magic-numbers
zachhale Feb 23, 2016
7559e9d
Add additional tweaks to webpack config
zachhale Feb 23, 2016
9dd2e6a
Remove eslint config overrides
zachhale Feb 24, 2016
2f7bd00
Update eslint-config-defaults and fix lint errors
zachhale Feb 24, 2016
4cfa9eb
Update dependencies to latest
zachhale Feb 24, 2016
73d7c60
Update lodash and karma-spec-reporter dependencies
zachhale Feb 24, 2016
4311a00
Init projects with 1.0.0
zachhale Feb 24, 2016
8f0930f
Rename start to npm:start and update README
zachhale Feb 24, 2016
587691f
Refactor webpack configs into partials
zachhale Feb 25, 2016
8373c74
Introduced peerDependencies
zachhale Feb 26, 2016
985a2cc
Rename test script to test-base
zachhale Feb 26, 2016
5da5560
Add a .travis.yml
zachhale Feb 27, 2016
72a19c1
Fix bug with test -> test-base
zachhale Feb 27, 2016
74cc2db
Updated boilerplate app dependencies
zachhale Feb 27, 2016
0b9c156
Add logger to init template
zachhale Feb 29, 2016
cb0fcd8
Add favicon handling to init
zachhale Feb 29, 2016
051806d
Refactor prod webpack config and remove dedupe plugin
zachhale Feb 29, 2016
8aabc98
Update gitignores with additional coverage
zachhale Feb 29, 2016
7bf3071
Update docs on including your node_modules/.bin in your PATH
zachhale Feb 29, 2016
8665246
Remvoe eslintrc-base
zachhale Mar 1, 2016
2c68cdf
Use SourceMapDevToolPlugin
zachhale Mar 1, 2016
ba886a1
Use .default instead of .partial
zachhale Mar 1, 2016
119ec36
Remove unnecessary then
zachhale Mar 1, 2016
ca2bc54
Pull out vars that dont need to be created on every render
zachhale Mar 1, 2016
d8d0a1f
Source map es6 mistake
zachhale Mar 1, 2016
5ef1853
Decompose server render method
zachhale Mar 1, 2016
65cda50
Remove unnecessary apple meta tag
zachhale Mar 1, 2016
136a1a0
Update dev package
zachhale Mar 1, 2016
cd66b6d
Remove const
zachhale Mar 1, 2016
351b6ed
Fix missing semicolon
zachhale Mar 1, 2016
066b271
Remove peerDependencies from normal dependencies
zachhale Mar 1, 2016
a3a631a
Lines at end of gitignores
zachhale Mar 1, 2016
2c3a77c
Remove $ from non-shell code
zachhale Mar 3, 2016
e220f25
Bump builder-support dependency to protect our peerDependencies
zachhale Mar 3, 2016
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
@@ -0,0 +1 @@
node_modules
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add dist

edit: never mind, that is only for init/{{gitignore}}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You need a full .gitignore here that applies to all the files in the archetype, so like init, config, etc.

Should probably at least have:

\.git
\.hg

\.DS_Store
\.project
node_modules
npm-debug\.log*
phantomjsdriver\.log

coverage

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ryan-roemer what's the reasoning for the escaped .s?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@zachhale -- Long habit. But I don't remember my escaping / globbing rules where. I'd consult a modern gitignore reference and check -- the slashes may well be not needed.

188 changes: 188 additions & 0 deletions DEVELOPMENT.md
@@ -0,0 +1,188 @@
Development
===========

We use [builder][] and `npm` to control all aspects of development and
publishing.

Install `builder` globally will provide easy access to the script but will
still respect the specific builder version defined in your project.

```sh
$ npm install builder -g
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ryan-roemer Is this recommended?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nope! Definitely not recommended.

Replace with:

We use [builder][] and `npm` to control all aspects of development and
publishing.

As a preliminary matter, please update your shell to include
`./node_modules/.bin` in `PATH` like:

```sh
export PATH="${PATH}:./node_modules/.bin"

So you can type builder instead of ./node_modules/.bin/builder for all
commands.


You can add a link to https://github.com/FormidableLabs/builder#usage if you'd like.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No problem, I thought this was the recommended usage. Updating.

```

## Development

All development tasks consist of watching the demo bundle, the test bundle
and launching a browser pointed to the demo page.

Run the `demo` application with watched rebuilds either doing:

### Basic Watched Builds

```sh
$ builder run dev # dev test/app server
$ builder run open-dev # (OR) dev servers _and a browser window opens!_
```

### Watched Builds + Hot Reloading

Same as above, but with hot reloading of React components.

```sh
$ builder run hot # hot test/app server
$ builder run open-hot # (OR) hot servers _and a browser window opens!_
```

From there, using either `dev` or `hot`, you can see:

* Demo app: [127.0.0.1:3000](http://127.0.0.1:3000/)
* Client tests: [127.0.0.1:3001/test/client/test.html](http://127.0.0.1:3001/test/client/test.html)


## Programming Guide

### Logging

We use the following basic pattern for logging:

```js
if (process.env.NODE_ENV !== "production") {
/* eslint-disable no-console */
if (typeof console !== "undefined" && console.warn) {
console.warn("Oh noes! bad things happened.");
}
/* eslint-enable no-console */
}
```

Replace `console.warn` in the condtional + method call as appropriate.

Breaking this down:

* `process.env.NODE_ENV !== "production"` - This part removes all traces of
the code in the production bundle, to save on file size. This _also_ means
that no warnings will be displayed in production.
* `typeof console !== "undefined" && console.METHOD` - A permissive check to
make sure the `console` object exists and can use the appropriate `METHOD` -
`warn`, `info`, etc.

To signal production mode to the webpack build, declare the `NODE_ENV` variable:

```js
new webpack.DefinePlugin({
"process.env.NODE_ENV": JSON.stringify("production")
})
```

Unfortunately, we need to do _all_ of this every time to have Uglify properly
drop the code, but with this trick, the production bundle has no change in code
size.


## Quality

### In Development

During development, you are expected to be running either:

```sh
$ builder run dev
```

to build the lib and test files. With these running, you can run the faster

```sh
$ builder run check-dev
```

Command. It is comprised of:

```sh
$ builder run lint
$ builder run test-dev
```

Note that the tests here are not instrumented for code coverage and are thus
more development / debugging friendly.

### Continuous Integration

CI doesn't have source / test file watchers, so has to _build_ the test files
via the commands:

```sh
$ builder run check # PhantomJS only
$ builder run check-cov # (OR) PhantomJS w/ coverage
$ builder run check-ci # (OR) PhantomJS,Firefox + coverage - available on Travis.
```

Which is currently comprised of:

```sh
$ builder run lint # AND ...

$ builder run test # PhantomJS only
$ builder run test-cov # (OR) PhantomJS w/ coverage
$ builder run test-ci # (OR) PhantomJS,Firefox + coverage
```

Note that `(test|check)-(cov|ci)` run code coverage and thus the
test code may be harder to debug because it is instrumented.

### Client Tests

The client tests rely on webpack dev server to create and serve the bundle
of the app/test code at: http://127.0.0.1:3001/assets/main.js which is done
with the task `builder run server-test` (part of `npm dev`).

#### Code Coverage

Code coverage reports are outputted to:

```
coverage/
client/
BROWSER_STRING/
lcov-report/index.html # Viewable web report.
```

## Releases

**IMPORTANT - NPM**: To correctly run `preversion` your first step is to make
sure that you have a very modern `npm` binary:

```sh
$ npm install -g npm
```

Built files in `dist/` should **not** be committeed during development or PRs.
Instead we _only_ build and commit them for published, tagged releases. So
the basic workflow is:

```sh
# Make sure you have a clean, up-to-date `master`
$ git pull
$ git status # (should be no changes)

# Choose a semantic update for the new version.
# If you're unsure, read about semantic versioning at http://semver.org/
$ npm version major|minor|patch -m "Version %s - INSERT_REASONS"

# ... the `dist/` and `lib/` directories are now built, `package.json` is
# updated, and the appropriate files are committed to git (but unpushed).
#
# *Note*: `lib/` is uncommitted, but built and must be present to push to npm.

# Check that everything looks good in last commit and push.
$ git diff HEAD^ HEAD
$ git push && git push --tags
# ... the project is now pushed to GitHub and available to `bower`.

# And finally publish to `npm`!
$ npm publish
```

And you've published!

[builder]: https://github.com/FormidableLabs/builder