ALL the things to do when starting a new Github Project - IR JavaScript | TypeScript

NEW_OPENSOURCE_TODO.md

Step 1 - Create nest on Github

1. Click Plus
2. New Repository
3. IR/REPO_NAME
4. PROJECT_DESCRIPTION
5. Do not initialize with anything (easier to add after)
6. Star your repo
7. Pull your repo down locally and cd to it

Step 2 - Stub JavaScript

Create new Node Module?

1. npm init or yarn init and follow directions (start at 0.0.1)
2. Add the fig. 1 to your .gitignore file
3. Create _art folder README graphics/gifs
4. Add the fig. 2 to your .npmignore file
5. Add the fig. 6 to your .editorconfig file
6. Setup Prettier
   1. Add the fig. 7 to your .prettierignore file
   2. Setup prettier (yarn add prettier --dev)
   3. Add the fig. 8 to your package.json config
7. Get Ready to Ship Node Module
   1. Setup np (yarn add np --dev)
   2. Add script shipit to package.json for releases (basic script "shipit": "np")
8. Commit local working tree. git commit add . && git commit -a -m "begin package :package:"
9. Push to github git git push -u origin master
10. Publish to npm (by running npm run shipit) to claim the package name. (failsauce with yarn for some reason)
11. Add npm badge to Readme (https://badge.fury.io/)

Creating a new Project?

1. Run project ininitalizing command

Step 3 - Setup local Checks

1. Add tests to your project
   • "test": "jest",
   • "test:ci": "jest --ci --runInBand", For CI builds
2. Add Lint checking to your project
   • If JS we use Standard
   • If TS you need to do the following
     1. yarn add tslint-config-standard
     2. setup tslint.json. see fig. 5
3. Add script format to package.json scripts object
   • JavaScript version "format": "prettier --write \"**/*.js\" -l \"warn\" && standard --fix",
   • TypeScript version "format": "prettier --write \"**/*.ts\" -l \"warn\" && tslint -p . --fix",
     • TypeScript build script can format before compile now "build": "yarn format && tsc",
4. Add madge to check for circular dependencies yarn add --dev madge then add to test script
   • JavaScript version yarn madge --circular ./src
   • TypeScript version yarn madge --extensions ts --circular ./src
5. Add coverage report to your project

Step 4 - Setup CI

1. Add project to Travis or Semaphore CI
2. Have CI report tests and coverage
3. Setup each CI to ignore the config file changes of other CIs

Step 5 - Update Github

1. Click website at top of GH page and paste PROJECT_WEBSITE
2. Click on topics and type at least 6
3. Ensure Readme, if not add via Github
4. Add License
   1. Click "Create New File"
   2. Type file name as "LICENSE"
   3. "Choose a license template" will appear top right (CLICK & FOLLOW)
5. Add Code of Conduct
   1. Click "Create New File"
   2. Type file name as "CODE_OF_CONDUCT"
   3. "Choose a code of conduct template" will appear top right (CLICK & FOLLOW)
6. Add fig. 3 to the bottom of your README.md
7. Add badges from CI/Coverage to readme

Step 6 - Create Docs

1. make a docs folder
2. Use something like docsify to manage your docs
3. Make contributors guide doc to tell people how to get contributing (see fig. 4 for example template)
4. Tell github to use /docs folder for website
5. Set website of Github page as Docs website (in top edit)
6. Run your Readme through cool people like FeedMeReadMe
7. Update your README.md to have gifs, and friendly setup instructions. Animate important commands

Step 7 - Are we releasing to Web/Appstore/Playstore?

1. Create a keys-to-the-kingdom doc in a private repo to share internally - Example

Reference figures

fig. 1

# Common Cruft
.DS_Store
npm-debug.log
yarn-error.log
coverage
.nyc_output
node_modules/
.vscode/*
!.vscode/cSpell.json
.idea
dist/

fig. 2

_art/
__tests__/
src/
.node-version
coverage/
yarn.lock
*.log

fig. 3

## Support
#### Open Source
This project is free and open source.  It's MIT Licensed and we'll always do our best to help and quickly answer issues.  If you'd like to get a hold of us, join our [community slack](http://community.infinite.red).

#### Premium
[Infinite Red](https://infinite.red/) offers premium support and general mobile app design/development services. Email us at [hello@infinite.red](mailto:hello@infinite.red) to get in touch with us for more details.

fig. 4

# How do I get started contributing?

## A moment before you start contributing
Be sure to mention that you're going to take on a task on the designated issue [on Github](<Issues link here>).  If there is no issue on Github, please create one first.  This will limit the number of people who accidentally create PRs that do not fit the roadmap of the tool

## Running Locally
To test this project, you'll need to pull it down and configure your local system to run the development version of the project.  We've made this as simple as possible!

**To get started**
* Pull down project to your local machine
* `cd` into project root
* Run `yarn` to install dependencies
* ...

You can now type `<change me>` and it will run <change me>

## Submitting a PR
Here's a friendly checklist for submitting your PR
1. Make sure any extraneous files (_i.e._ build dependencies, IDE configs, etc.) are removed or added to the `.gitignore`
1. Make sure any files non-critical to the package are added to the `.npmignore`
1. Update docs with details of changes to the interface.  This includes public interfaces, file locations, or changes in parameters.
1. Make sure you have tests covering your new or changed functionality.
1. Make sure `yarn test` passes.  Otherwise, your PR cannot be merged.
1. Reference your Gihub issue in your final PR

fig. 5

// Comments ok in TS JSON files
// I'm the `tslint.json 
{
  "extends": "tslint-config-standard"
  // Option to modify standard if we want
  // "rules": {
  //   "trailing-comma": [true, {"multiline": "always", "singleline": "never"}]
  // }
}

fig. 6

# http://editorconfig.org

# top-most EditorConfig file
root = true

[*]
indent_style = space
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.{json,js,jsx,html,css,ts,tsx}]
indent_style = space
indent_size = 2

[.eslintrc]
indent_style = space
indent_size = 2

[*.md]
trim_trailing_whitespace = false

fig. 7

.vscode
readme.md
dist/

fig. 8

  "prettier": {
    "printWidth": 100,
    "semi": false,
    "singleQuote": true,
    "trailingComma": "es5"
  },

fig. 9

example appveyor.yml

build: off

environment:
  nodejs_version: "7.8.0"

install:
  - ps: Install-Product node $env:nodejs_version
  - npm install

before_test:
  - node --version
  - npm --version

test_script:
  - npm run test:ci

skip_commits:
  files:
    - travis.yml
    - '*.md'