Pepeye

Setting up github and bitbucket on the same computer

Github will be the main account and bitbucket the secondary.

Create SSH Keys

ssh-keygen -t rsa -C "github email"

Enter passphrase when prompted. If you see an option to save the passphrase in your keychain, do it for an easier life.

Pepeye

Testing ES6 React components with Gulp + Mocha + Istanbul

Recipe to test your ES6 React components.

$ npm install gulp gulp-util gulp-mocha gulp-istanbul isparta run-sequence babel jsdom

Note: You must name all your files .js, even if they contains JSX, or istanbul will not instrument them.

Pepeye

import webpack from 'webpack'
import path from 'path'
import _debug from 'debug'
import ExtractTextPlugin from 'extract-text-webpack-plugin'

const ENVIRONMENT = process.env.NODE_ENV

const debug = _debug('app:webpack:base')
debug('Create configuration.')

Pepeye

{
  "presets": [
    "es2015",
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-runtime",
    "add-module-exports",
    "transform-decorators"

Pepeye

'use strict';

const CypherQuery = require('./cypher').CypherQuery;

module.exports = function createQueryExecutor(context) {
  const executor = function executeQuery(query) {
    if (typeof query === 'function') {
      return query(executor);
    }

Pepeye

const PersonType = new GraphQLObjectType({
  name: "Person",
  fields: () => ({
    friends: {
      type: new GraphQLList(PersonType),
      resolve() { ... },
    },
  }),
});

Pepeye

Setup ES6+Babel+JSX Linting with Atom/Nuclide

This sets up Atom to properly lint ES6+Babel+JSX using Airbnb's .eslintrc as a starting point.

Steps

1. Download Atom and get these two packages: Linter and [Linter-ESLint)(https://atom.io/packages/linter-eslint)
2. Run npm i -D eslint eslint-config-airbnb babel-eslint eslint-plugin-babel eslint-plugin-react eslint-plugin-react-native eslint-plugin-import eslint-plugin-jsx-a11y from your project root.
3. Add "extends": "airbnb" to your .eslintrc and "plugins": [ "babel", "react", "react-native", "jsx-a11y" ]
4. Run apm install linter-eslint this also installs linter which clashes with nuclide diagnostics

Pepeye

1. Create a group brew and add Stan
2. brew doctor (Allen checks if he installed brew correctly)
3. sudo chgrp -R brew /usr/local (Change the group of homebrew installation directory)
4. sudo chmod -R g+w /usr/local (Allow group members to write inside this directory)
5. sudo chgrp -R brew /Library/Caches/Homebrew (Change the group of homebrew cache directory)
6. sudo chmod -R g+w /Library/Caches/Homebrew (Allow group members to write inside this directory)
7. sudo chgrp -R brew /opt (Change the group of the cask installation directory)
8. sudo chmod -R g+w /opt (Allow group members to write inside this directory)
9. brew doctor (Stan checks if he can use homebrew)

Pepeye

Basics

• Learn how to start a new react native project
• Run it on ios simulator, on android emulator, on a real iPhone device and on a real Android device, with and without debugging enabled.
• Learn how to upgrade a react native project
• Learn how to add a package to the project
• Learn how to add a package that has a native dependency (https://github.com/airbnb/react-native-maps, https://github.com/evollu/react-native-fcm) - DO NOT USE COCOAPODS
• Learn how to use fetch to get data from your backend

Learn Navigation

• (https://github.com/exponent/ex-navigation#an-important-note-about-the-future)

Pepeye

Basics

• Learn how to start a new react native project
• Run it on ios simulator, on android emulator, on a real iPhone device and on a real Android device, with and without debugging enabled.
• Learn how to upgrade a react native project
• Learn how to add a package to the project
• Learn how to add a package that has a native dependency (https://github.com/airbnb/react-native-maps, https://github.com/evollu/react-native-fcm) - DO NOT USE COCOAPODS
• Learn how to use fetch to get data from your backend

Learn Navigation

• (https://github.com/exponent/ex-navigation#an-important-note-about-the-future)