| Name of thing | Sorta like... | Mounted? | Can you even setState? | What would you say... ya do here? |
|---|---|---|---|---|
| constructor | initialize() | nope | nope | init stuff NO side effects |
| componentWillMount | beforeDomReady() | nope | yeah but don't | Only needed in createClass now use constructor for most things |
| render | render | nope | please no | render stuff and don't set any state please |
| componentDidMount | domReady() | yup | yup | DOM is a go init jQuery plugins dispatch stuff |
| componentWillReceiveProps | onChange() | yup | yup |
Tyler Malone rtmalone
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| class Month | |
| attr_reader :month, :year, :first_wkday_of_month | |
| # weekdays = "Su Mo Tu We Th Fr Sa" | |
| def initialize(month, year) | |
| @month = month | |
| @year = year | |
| @days_in_month = days_in_month(month, year) | |
| @first_wkday_of_month = Zellers.calculate(month, year) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| If you are using google maps with foundation you may have noticed the nav controls over to map not rendering correctly. It appears some CSS foundation sets interferes with such things on a google map. Here is the fix: | |
| #map img { | |
| max-width: none; | |
| } | |
| http://foundation.zurb.com/forum/posts/173-google-map-css-issue |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| /* ENVIRONMENTS */ | |
| // specify a white list of global variables that are not formally defined in the source code. | |
| // See "environment" options in JSHINT Docs | |
| "globals": ["node", "jquery", "browser"], | |
| /* ENFORCING */ | |
| // This option requires you to always put curly braces around blocks in loops and conditionals |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "disallowEmptyBlocks": true, | |
| "disallowKeywordsOnNewLine": ["else"], | |
| "disallowKeywords": ["with"], | |
| "disallowMixedSpacesAndTabs": true, | |
| "disallowMultipleLineBreaks": true, | |
| "disallowMultipleLineStrings": true, | |
| "disallowMultipleSpaces": true, | |
| "disallowNewlineBeforeBlockStatements": true, | |
| "disallowOperatorBeforeLineBreak": ["."], |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use strict'; | |
| angular.module('rabbleClientApp') | |
| .directive('htmlplayer', function ($rootScope, $state, $timeout, $detection, PlayerUtilsService, constants, LogService, ListensService, SocketUtilsService, MessageService) { | |
| var directive = { | |
| restrict: 'E', | |
| transclude: true, | |
| templateUrl: '/views/templates/htmlplayer.html', | |
| scope :{ |
rtmalone
/ Broadcast related
Last active
April 2, 2016 04:18
rtmalone
/ whole react index.html
Created
April 2, 2016 04:18
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>React Tutorial</title> | |
| <!-- Not present in the tutorial. Just for basic styling. --> | |
| <link rel="stylesheet" href="css/base.css" /> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.16/browser.js"></script> |
rtmalone
/ SampleComponent.js
Created
April 12, 2017 04:47
— forked from yamadayuki/SampleComponent.js
Use keyframes property with React using inline style
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import injectStyle from './path/to/injectStyle'; | |
| export default class SampleComponent extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| const keyframesStyle = ` | |
| @-webkit-keyframes pulse { | |
| 0% { background-color: #fecd6d; } |
rtmalone
/ react-lifecycle.md
Created
June 26, 2017 14:23
— forked from jcreamer898/react-lifecycle.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const _location = window.location | |
| const uAgent = window.navigator.userAgent.toLowercase() | |
| const query = <grab the query params according to your code base> | |
| if (uAgent.match(/iphone|ipod|ipad/i)) { | |
| handleIOS(location, query) | |
| } else if (uAgent.match(/android/i)) { | |
| handleAndroid(location, query) { | |
| } else { | |
| <User is on a desktop; I just logged a message to the console> |
OlderNewer