Skip to content

Instantly share code, notes, and snippets.

View 0bie's full-sized avatar

Obie 0bie

4 followers · 1 following
  • Vancouver, BC
View GitHub Profile
@0bie
0bie / ReactNotes2.md
Last active June 21, 2018 09:57
Beginner notes on React JS

React Notes 2

  • To prevent syntax repetition you can abstract common properties from the React object using ES6 Destructuring E.g:
//before
import React from 'react';

class Searchbar extends React.Component {
 static propTypes = {
@0bie
0bie / ReactNotes.md
Last active February 23, 2024 23:32
Beginner Notes on React JS

React Notes

JSX

  • JSX adds XML syntax to JS

  • JSX tags have a tag name, attributes, and children (similar to XML)

  • Similar to JS, quotes in JSX attributes represent strings. Numeric values and/or expressions should be wrapped in a curly brace.

@0bie
0bie / zIndex.md
Last active May 28, 2016 23:23
Guideline: Z-Index Scale

Guideline: Z-Index Scale

  • The default scale is a set of variables numbered from 1 - 9 E.g:
/* Base z-index scale */

:root {
  --zIndex-1: 10;
 --zIndex-2: 20;
@0bie
0bie / ModulePatternES5.md
Created May 15, 2016 01:29
Module Pattern in ES5
  • It is considered best practice to manage scope using the Module Pattern
  • It enables access to both a public and private scope in your code
  • In basic terms you may get this done by wrapping a function inside a function like so:
var Module = (function() {
  var _privateMethod1 = function() {
    console.log("private 1");  
  };
 var _privateMethod2 = function() {
@0bie
0bie / ClassPrototypeES5.md
Last active July 22, 2016 18:00
Class/Protoype in ES5

Boilerplate structure for working w/ classes in ES5

function Module(variable1, variable2) {
    this.variable1 = variable1;
    this.variable2 = variable2;
}
Module.prototype = {
   constructor: Module, // specifies the constructor for new instances of the Module class
   currentScope: function() {console.log(this);},
@0bie
0bie / ES6Notes.md
Last active November 2, 2016 19:10
ES6 Notes