avinmathew

import React from "react"
import { Route, Switch } from "react-router-dom"

const AppRoute = ({ component: Component, layout: Layout, ...rest }) => (
  <Route {...rest} render={props => (
    <Layout>
      <Component {...props} />
    </Layout>
  )} />
)

madcoda

import React, { Component } from 'react'
import { BrowserRouter as Router, Route, Link, Match, Redirect, Switch } from 'react-router-dom'

import OverviewPage from './page/OverviewPage'
import AccountPage from './page/AccountPage'

/*
  Layouts, inline define here for demo purpose
  you may want to define in another file instead
 */

patjun

<script>
(function($) {
	$(document).ajaxSuccess(function( event, xhr, settings ) {
		dataLayer.push({
			'event': 'ajaxSuccess',
			'eventCategory': 'AJAX',
			'eventAction': settings.url,
			'eventLabel': xhr.responseText
		});
	});

abury

// We only need to import the modules necessary for initial render
import CoreLayout from '../layouts/CoreLayout/CoreLayout';
import Home from './Home';
import LoginRoute from './Login';
import SignupRoute from './Signup';
import DashboardRoute from './Secure/Dashboard';
import LeadsRoute from './Secure/Leads';
import NotFound from './NotFound';

/*  Note: Instead of using JSX, we recommend using react-router

acdlite

// getComponent is a function that returns a promise for a component
// It will not be called until the first mount
function asyncComponent(getComponent) {
  return class AsyncComponent extends React.Component {
    static Component = null;
    state = { Component: AsyncComponent.Component };

    componentWillMount() {
      if (!this.state.Component) {
        getComponent().then(Component => {

markerikson

function timerMiddleware({dispatch, getState}) {
    const timers = {};
    
    

    return next => action => {
        if(action.type == "START_TIMER") {
            const {action, timerName, timerInterval} = action.payload;
            
            clearInterval(timers[timerName]);

ryanflorence

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

ryanflorence

.
├── actions
├── stores
├── views
│   ├── Anonymous
│   │   ├── __tests__
│   │   ├── views
│   │   │   ├── Home
│   │   │   │   ├── __tests__
│   │   │   │   └── Handler.js

hatefulcrawdad

/* The Grid ---------------------- */
.lt-ie9 .row { width: 940px; max-width: 100%; min-width: 768px; margin: 0 auto; }
.lt-ie9 .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -15px; }
.lt-ie9 .row.large-collapse .column, 
.lt-ie9 .row.large-collapse .columns { padding: 0; }
.lt-ie9 .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -15px; }
.lt-ie9 .row .row.large-collapse { margin: 0; }

.lt-ie9 .column, .lt-ie9 .columns { float: left; min-height: 1px; padding: 0 15px; position: relative; }
.lt-ie9 .column.large-centered, .columns.large-centered { float: none; margin: 0 auto; }