overthemike

import React, {Component} from 'react'
import ReactDOM from 'react-dom'

import App from './components/App'
import Mobile from './components/Mobile'

class Main extends Component {
  state = {
    width: window.innerWidth
  }

overthemike

// THIS IS OUR SERVER CODE SNIPPET
// this is the api call on our express server
// it's job is to take a call from our frontend
// and call another api when it's called and return
// that data back to the frontend
router.get('/mycall', function(req,res,nex){
  request.get('http://someotherdomain.com/api/a/call/to/make', function(error, response, body){ 
    // notice the difference between res and response
    // now we respond back to our frontend with the
    // data from the other domain's api

overthemike

/* Color palette */
:root {
  --black: #333333;
  --greyish-brown: #565656;
  --lightgrey: #f0f0f0;
  --punchcodegreen: #7eff83;
  --light-grey: #dcdedc;
  --white: #ffffff;
  --error: #ff0043;
  --darkest: #1e1b1c;

overthemike

import React, {Component} from 'react'
import {connect} from 'react-redux'
import {addFoo} from '../actions/foo'

class MyComponent extends Component {
  static defaultProps = {
    foos:[]
  }
  
  state = {

overthemike

import axios from 'axios'

function api(user, pass) {
  return axios.create({
    'X-User':user,
    'X-Password':pass
  })
}

overthemike

let fields = document.querySelector('#fields')

let htmlStr = '<form>'

formData.forEach(function(item){
  if (item.type === 'text' || item.type === 'email' || item.type === 'tel') {
    htmlStr += `<input type="${item.type}" placeholder="${item.label}" id="${item.id}" />`
  }
  if (item.type === 'textarea') {
    htmlStr += `<textarea id="${item.id}" placeholder="${item.label}"></textarea>`

overthemike

//Usage
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import Route from './AuthRoute';

import Login from './Login';
import Private from './Private';

export default () => 
  <Router>

overthemike

// make sure to yarn add jquery
import $ from 'jquery'
import store from './store'

function getData() {
  $.getJSON('https://api.etsy.com/v2/listings/active.js?api_key=h9oq2yf3twf4ziejn10b717i&keywords=whiskey&includes=Images,Shop&callback=?', function(data){
    store.dispatch({
      type: 'GET_DATA',
      action: data.results
    })

overthemike

import React, {Component} from 'react';
import FontIcon from 'material-ui/FontIcon'
import {cyan500} from 'material-ui/styles/colors'

const remote = require('electron').remote
const dialog = remote.require('dialog')

class PhotoHover extends Component {
  constructor(props) {
    super(props)

overthemike

import React from 'react';

export default React.createClass({
  getInitialState: function() {
    return {
      list: [],
      text: ''
    }
  },