mikeyamadeo

import style from './style'
import React from 'react'

const Btn = React.createClass({
  render () {
    return (
      <button className={style.Btn}>
        Submit
      <button>
    )

mikeyamadeo

import style from './style'
import CSSModules from 'react-css-modules'
import React from 'react'

/**
 * Notice use of `styleName` vs. `className`
 */
const Btn = React.createClass({
  render () {
    return (

mikeyamadeo

.Btn {
  padding: .8em 1.5em;
  color: white;
  background-color: #EC87C0;
  border: none;
}

.disabled {
  background-color: #BBBBBB;
}

mikeyamadeo

import React from 'react'
import Job from 'JobComponent'

const jobData = {
  title: "Looking for help",
  employerId: "uniqueId"
}
    
const JobRenderTypes = React.createClass({ 
  render () {

mikeyamadeo

import React from 'react'
import JobListing from './components/org.JobListing'
import JobHeading from './components/org.JobHeading'
import JobCard from './components/org.JobCard'

// well this is repetitive :/.... 
const renderAs = {
  listing (data) {
    return <JobListing data={data} />
  },

mikeyamadeo

render () {
  const { data, renderAs } = this.props
  const types = {
    listing: JobListing,
    heading: JobHeading,
    card: JobCard
  }
  const render = {
   me: types[renderAs]
  }

mikeyamadeo

render () {
  const { data, renderAs } = this.props
  const types = {
    listing: JobListing,
    heading: JobHeading,
    card: JobCard
  }
  const component = types[renderAs] // this one will NOT work
  const $component = types[renderAs] // this one WILL
  return (

mikeyamadeo

render () {
  const { data, renderAs } = this.props
  const types = {
    listing: JobListing,
    heading: JobHeading,
    card: JobCard
  }
  const component = types[renderAs] 
  const $component = types[renderAs] 

mikeyamadeo

import style from './style'
import React, { PropTypes } from 'react'
import CSSModules from 'react-css-modules'
import createJob from 'JobFactory'
import listing from './components/org.JobListing'
import heading from './components/org.JobHeading'
import details from './components/org.JobDetails'
import card from './components/org.JobCard'

const DEFAULT_RENDER_TYPE = 'listing'

mikeyamadeo

const DynamicRenderer = React.createClass({
  render () {
    const component = this.props.condition 
      ? SomeComponent
      : SomeOtherComponent
      
    // This will NOT work as expected
    return <component />
  }
})