dgowrie

React/Redux Style Guide

Table of Contents:

• React/Redux Style Guide
  • React Guidelines
    • Organization
    • Components
• Container Components

dgowrie

<?php 

 /* ————————————————————————— */
 /*  ACF Inline SVGs
 /* ————————————————————————— */ 
 
$repeater = 'repeater_field_name'
if ( have_rows( $repeater ) ): ?>
	<section class="content-main">
		<div class="container"> <?php 

dgowrie

var ReactTable = React.createClass({

  getInitialState: function() {
     return {currentData: this.props.data};
  },

  render: function() {

    var key = Date.now();

dgowrie

<snippet>
	<content><![CDATA[
import React from 'react';
import PropTypes from 'prop-types';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';

const propTypes = {
	name: PropTypes.string,
};

dgowrie

<snippet>
	<content><![CDATA[
import React from 'react';
import PropTypes from 'prop-types';

const propTypes = {
	name: PropTypes.string,
};

class ${1:${TM_FILENAME/(.+)\..+|.*/$1/:ComponentName}} extends React.Component {

dgowrie

<snippet>
	<content><![CDATA[
import React from 'react';
import PropTypes from 'prop-types';

const propTypes = {

};

function ${1:${TM_FILENAME/(.+)\..+|.*/$1/:ComponentName}}(${2:props}) {

dgowrie

import React, {PropTypes} from 'react';

export const Tab = (props) => {
    return (
        <li className="tab">
            <a className={`tab-link ${props.linkClassName} ${props.isActive ? 'active' : ''}`}
                onClick={(event) => {
                    event.preventDefault();
                    props.onClick(props.tabIndex);
                }}>

dgowrie

import React, { Component } from 'react'
import { Redirect } from 'react-router'

export default class ContactForm extends Component {
  constructor () {
    super();
    this.state = {
      fireRedirect: false
    }
  }

dgowrie

Let's say you start a project locally, and do some editing.

$ mkdir -p ~/git/foo && cd ~/git/foo
$ touch NEWFILE

Now you decide you want to create a new github repo and track it, but the directory is non-empty so git won't let you clone into it. You can fix this, thusly:

dgowrie

<?php

/*
	Plugin Name: Remote Uploads Directory
	Author: David Gowrie
*/

add_filter('upload_dir', 'remote_media_upload_dir');

function remote_media_upload_dir( $upload ) {