Skip to content

Instantly share code, notes, and snippets.

Andrew Stewart Gibson goofballLogic

Block or report user

Report or block goofballLogic

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View bootstrap webpack react app
Create the app:
npm init
Add React:
npm install --save react react-dom
Add webpack:
npm install --save-dev webpack webpack-cli webpack-dev-server
Add babel:
View constructor function
fetchForLater().then( resp => {
if ( !resp.ok ) { throw new Error( "Failed to fetch for later people" ); }
return resp.json();
} ).then( json => {
const savedForLater = json.map( ( [ id, person ] ) => person );
this.setState( { saved: savedForLater } );
View my-api.js
function sendJSON( method, data, url ) {
return fetch( url, {
body: data && JSON.stringify( data ),
method: "POST",
mode: "cors",
headers: {
"Content-Type": "application/json"
View gist:14266a822317ea07893a4e6a5cfb0a9f

Having dived a bit deeper, I'm concluding that there are some design decisions which need to be made here.

For a normal scenario like:

Feature: my feature
 Scenario: my scenario
  Given step 1
  When step 2
  Then step 3
View api-to-module.md

Create a folder named "routes", and one named "middleware"

api
   middleware                        <---
   node_modules
   routes                            <---
   .gitignore
   index.js
   package-lock.json
View add-person-details.md

Add a person details component (with children)

const PersonDetails = ( { person, children } ) => <div className="person-details">

  <p className="name">{person.name} {person.surname}</p>
  <p><span className="label">Region</span>{person.region}</p>
  <img src={person.photo} />
  {children}
View People component.md

1. Add the People component:

class People extends Component {
  constructor() {
    super();
    this.state = { people: [] };
    this.callAPI();
  }
  callAPI() {
@goofballLogic
goofballLogic / create-react-app.md
Last active May 9, 2018
Bog standard create-react-app
View create-react-app.md

We're assuming you already have node.js installed

1. Install the create-react-app package:

npm install -g create-react-app

2. Create an application:

View sample.js
/*eslint-env node*/
/*
This class is for:
1. Creating Authentication HTTP headers
2. Creating Accept-Language headers
3. Sending a HTTP request
@goofballLogic
goofballLogic / gist:61e4e7df3e7671b9ff66114a32c8ad9d
Last active Sep 26, 2016
Not sure that serialization "works"
View gist:61e4e7df3e7671b9ff66114a32c8ad9d
> new RegExp( "/" )
/\//
> var x = new RegExp( "/" )
undefined
> x.test( "/hello" )
true
> var y = new RegExp( x.toString() )
undefined
> y.test( "/hello" )
false
You can’t perform that action at this time.