add initial react app

client/README.md

@@ -0,0 +1,3 @@
+This is the entry point for the client
+Code that should only run on the client should be put here.
+NOTE(berks): For react specific stuff this should be the entry point

client/index.js

@@ -0,0 +1,20 @@
+import BrowserHistory from 'react-router/lib/BrowserHistory';
+import debugFactory from 'debug';
+import { Cat } from 'thundercats';
+
+import AppFactory from '../common/app/appFactory';
+
+const debug = debugFactory('fcc:client');
+const DOMContianer = document.getElemenetById('#fCC');
+const fcc = new Cat();
+
+// returns an observable
+fcc.render(AppFactory(BrowserHistory), DOMContianer)
+  .subscribe(
+    function() {
+      debug('react rendered');
+    },
+    function(err) {
+      debug('an error has occured', err.stack);
+    }
+  );

common/app/App.jsx

@@ -0,0 +1,25 @@
+import React, { PropTypes } from 'react';
+
+import Nav from './components/Nav';
+import Footer from './components/Footer';
+
+export default class extends React.Component {
+  constructor(props) {
+    super(props);
+  }
+
+  static displayName = 'FreeCodeCamp'
+  static propTypes = {
+    children: PropTypes.node
+  }
+
+  render() {
+    return (
+      <div>
+        <Nav />
+        { this.props.children }
+        <Footer />
+      </div>
+    );
+  }
+}

common/app/appFactory.jsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Router, Route } from 'react-router';
+
+// components
+import App from './App.jsx';
+import Jobs from './screens/App/screens/Jobs';
+
+module.exports = function appFactory(history) {
+  return (
+    <Router history={ history }>
+      <Route handler={ App }>
+        <Route
+          component={ Jobs }
+          path='/jobs' />
+      </Route>
+    </Router>
+  );
+};

common/app/components/Footer/Footer.jsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import { Col, Row, Grid } from 'react-bootstrap';
+
+import links from './links.json';
+
+export default class extends React.Component {
+  static displayName = 'Footer'
+  renderLinks(mobile) {
+    return links.map(link => {
+      return (
+        <a
+          className={ link.className}
+          href={ link.href }
+          target={ link.target }>
+          { this.renderContent(mobile, link.content) }
+        </a>
+      );
+    });
+  }
+
+  renderContent(mobile, content) {
+    if (mobile) {
+      return (
+        <span className='sr-only'>
+          content;
+        </span>
+      );
+    }
+    return content;
+  }
+
+  render() {
+    return (
+      <Grid className='fcc-footer'>
+        <Row>
+          <Col
+            className='hidden-xs hidden-sm'
+            xs={ 12 }>
+            { this.renderLinks() }
+          </Col>
+          <Col
+            className='visible-xs visible-sm'
+            xs={ 12 }>
+            { this.renderLinks(true) }
+          </Col>
+        </Row>
+      </Grid>
+    );
+  }
+}

common/app/components/Footer/index.js

@@ -0,0 +1 @@
+export { default as Footer } from './Footer.jsx';

common/app/components/Footer/links.json

@@ -0,0 +1,44 @@
+[
+  {
+    "className": "ion-speakerphone",
+    "content": " Blog  ",
+    "href": "http://blog.freecodecamp.com",
+    "target": "_blank"
+  },
+  {
+    "className": "ion-social-twitch-outline",
+    "content": " Twitch  ",
+    "href": "http://www.twitch.tv/freecodecamp",
+    "target": "_blank"
+  },
+  {
+    "className": "ion-social-github",
+    "content": " Github  ",
+    "href": "http://github.com/freecodecamp",
+    "target": "_blank"
+  },
+  {
+    "className": "ion-social-twitter",
+    "content": " Twitter  ",
+    "href": "http://twitter.com/freecodecamp",
+    "target": "_blank"
+  },
+  {
+    "className": "ion-social-facebook",
+    "content": " Facebook  ",
+    "href": "http://facebook.com/freecodecamp",
+    "target": "_blank"
+  },
+  {
+    "className": "ion-information-circled",
+    "content": " About  ",
+    "href": "/learn-to-code",
+    "target": "_self"
+  },
+  {
+    "className": "ion-locked",
+    "content": " Privacy  ",
+    "href": "/privacy'",
+    "target": "_self"
+  }
+]

common/screens/nav/Nav.jsx → common/app/components/Nav/Nav.jsx

@@ -1,31 +1,30 @@
-var React = require('react'),
-    bootStrap = require('react-bootstrap'),
-    Navbar = bootStrap.Navbar,
-    Nav = bootStrap.Nav,
-    NavItem = bootStrap.NavItem,
-    NavItemFCC = require('./NavItem.jsx');
+import React from 'react';
+import { Nav, Navbar, NavItem } from 'react-bootstrap';
+import NavItemFCC from './NavItem.jsx';
 
-var NavBarComp = React.createClass({
-
-  propTypes: { signedIn: React.PropTypes.bool },
+export default class extends React.Component {
+  constructor(props) {
+    super(props);
+  }
 
-  getDefaultProps: function() {
-    return { signedIn: false };
-  },
+  static displayName = 'Nav'
+  static propTypes = {
+    signedIn: React.PropTypes.bool
+  }
 
-  _renderBrand: function() {
+  renderBrand() {
     var fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg';
     return (
       <a href='/'>
         <img
-          src={ fCClogo }
           alt='learn to code javascript at Free Code Camp logo'
-          className='img-responsive nav-logo' />
+          className='img-responsive nav-logo'
+          src={ fCClogo } />
       </a>
     );
-  },
+  }
 
-  _renderSignin: function() {
+  renderSignin() {
     if (this.props.signedIn) {
       return (
         <NavItem
@@ -36,27 +35,26 @@ var NavBarComp = React.createClass({
     } else {
       return (
         <NavItemFCC
+          aClassName='btn signup-btn signup-btn-nav'
           eventKey={ 2 }
-          href='/login'
-          aClassName='btn signup-btn signup-btn-nav'>
-            Sign In
+          href='/login'>
+          Sign In
         </NavItemFCC>
       );
     }
-  },
-
-  render: function() {
+  }
 
+  render() {
     return (
       <Navbar
         brand={ this._renderBrand() }
+        className='nav-height'
         fixedTop={ true }
-        toggleNavKey={ 0 }
-        className='nav-height'>
+        toggleNavKey={ 0 }>
         <Nav
-          right={ true }
+          className='hamburger-dropdown'
           eventKey={ 0 }
-          className='hamburger-dropdown'>
+          right={ true }>
           <NavItem
             eventKey={ 1 }
             href='/Challenges'>
@@ -77,5 +75,4 @@ var NavBarComp = React.createClass({
       </Navbar>
     );
   }
-});
-module.exports = NavBarComp;
+}

common/app/components/Nav/index.js

@@ -0,0 +1 @@
+export { default as Nav } from './Nav.jsx';

common/app/components/README.md

@@ -0,0 +1 @@
+things like NavBar and Footer go here

common/app/routes/Admin/README.md

@@ -0,0 +1 @@
+in case we ever want an admin panel

common/app/routes/Bonfires/README.md

@@ -0,0 +1 @@
+This folder contains things relative to the bonfires screens

common/app/routes/Bonfires/index.js

@@ -0,0 +1,6 @@
+export default {
+  path: 'bonfires/(:bonfireName)',
+  getComponents(cb) {
+    // TODO(berks): add bonfire component
+  }
+};

common/app/routes/FAVS/README.md

@@ -0,0 +1 @@
+future home of FAVS app

common/app/routes/Jobs/README.md

@@ -0,0 +1 @@
+This folder contains everything relative to Jobs board

common/app/routes/Jobs/components/Actions.js

@@ -0,0 +1,15 @@
+import { Actions } from 'thundercats';
+
+export default class JobsActions extends Actions {
+  constructor() {
+    super();
+  }
+  static displayName = 'JobsActions'
+
+  getJob(id) {
+    return { id };
+  }
+  getJobs(params) {
+    return { params };
+  }
+}

common/app/routes/Jobs/components/Jobs.jsx

@@ -0,0 +1,28 @@
+import React, { PropTypes } from 'react';
+import { createContainer } from 'thundercats';
+import { Grid, Row } from 'react-bootstrap';
+
+@createContainer({
+  store: 'JobsStore'
+})
+export default class extends React.Component {
+  constructor(props) {
+    super(props);
+  }
+
+
+  static displayName = 'Jobs'
+  static propTypes = {
+    jobs: PropTypes.array
+  }
+
+  render() {
+    return (
+      <Grid>
+        <Row>
+          foo
+        </Row>
+      </Grid>
+    );
+  }
+}

common/app/routes/Jobs/components/List.jsx

@@ -0,0 +1,13 @@
+import React, { PropTypes } from 'react';
+
+export default class extends React.Component {
+  constructor(props) {
+    super(props);
+  }
+
+  static displayName = 'JobsList'
+  static propTypes = {}
+  render() {
+    return null;
+  }
+}

common/app/routes/Jobs/components/Store.js

@@ -0,0 +1,9 @@
+import { Store } from 'thundercats';
+
+export default class JobsStore extends Store {
+  constructor(cat) {
+    super();
+    let JobsActions = cat.getActions('JobsActions');
+  }
+  static displayName = 'JobsStore'
+}

common/app/routes/Jobs/index.js

@@ -0,0 +1,19 @@
+/*
+ *  show: /jobs
+ *  showOne: /jobs/:id
+ *  edit /jobs/:id
+ *  delete /jobs/:id
+ *  createOne /jobs/new
+ */
+
+export default {
+  path: '/jobs/(:jobId)',
+
+  getComponents(cb) {
+    require.ensure([], require => {
+      cb(null, [
+        require('./components/Jobs')
+      ]);
+    });
+  }
+};

common/app/routes/index.js

@@ -0,0 +1,11 @@
+export default {
+  path: '/',
+  getRoutes(cb) {
+    require.ensure([], require => {
+      cb(null, [
+        // require('./Bonfires'),
+        require('./Jobs')
+      ]);
+    });
+  }
+};

common/app/shared/README.md

@@ -0,0 +1 @@
+Here is where all components that are shared between multiple views