From a8540bee35d561adeb5daa9c88dcf8553335dc0c Mon Sep 17 00:00:00 2001 From: Berkeley Martinez Date: Wed, 17 Jun 2015 21:04:28 -0700 Subject: [PATCH] add initial react app --- client/README.md | 3 + client/index.js | 20 ++++ common/app/App.jsx | 25 +++++ common/app/appFactory.jsx | 18 +++ common/app/components/Footer/Footer.jsx | 50 +++++++++ common/app/components/Footer/index.js | 1 + common/app/components/Footer/links.json | 44 ++++++++ .../nav => app/components/Nav}/Nav.jsx | 55 +++++---- .../nav => app/components/Nav}/NavItem.jsx | 0 common/app/components/Nav/index.js | 1 + common/app/components/README.md | 1 + common/app/routes/Admin/README.md | 1 + .../routes/Bonfires}/Actions.js | 0 common/app/routes/Bonfires/README.md | 1 + .../bonfires => app/routes/Bonfires}/Store.js | 0 .../routes/Bonfires/components}/Bonfires.jsx | 0 .../routes/Bonfires/components}/Results.jsx | 0 .../routes/Bonfires/components}/SidePanel.jsx | 0 .../routes/Bonfires}/executeBonfire.js | 0 common/app/routes/Bonfires/index.js | 6 + common/app/routes/FAVS/README.md | 1 + common/app/routes/Jobs/README.md | 1 + common/app/routes/Jobs/components/Actions.js | 15 +++ common/app/routes/Jobs/components/Jobs.jsx | 28 +++++ common/app/routes/Jobs/components/List.jsx | 13 +++ common/app/routes/Jobs/components/Store.js | 9 ++ common/app/routes/Jobs/index.js | 19 ++++ common/app/routes/index.js | 11 ++ common/app/shared/README.md | 1 + .../shared}/displayCode/Display.jsx | 0 .../shared}/displayCode/index.js | 0 .../{screens => app/shared}/editor/Editor.jsx | 0 .../{screens => app/shared}/editor/index.js | 0 common/screens/App.jsx | 19 ---- common/screens/Router.jsx | 34 ------ common/screens/bonfires/index.js | 1 - common/screens/context/Actions.js | 34 ------ common/screens/context/Store.js | 18 --- common/screens/footer/Footer.jsx | 106 ------------------ common/screens/footer/index.js | 1 - common/screens/nav/index.js | 1 - package.json | 5 +- 42 files changed, 299 insertions(+), 244 deletions(-) create mode 100644 client/README.md create mode 100644 client/index.js create mode 100644 common/app/App.jsx create mode 100644 common/app/appFactory.jsx create mode 100644 common/app/components/Footer/Footer.jsx create mode 100644 common/app/components/Footer/index.js create mode 100644 common/app/components/Footer/links.json rename common/{screens/nav => app/components/Nav}/Nav.jsx (56%) rename common/{screens/nav => app/components/Nav}/NavItem.jsx (100%) create mode 100644 common/app/components/Nav/index.js create mode 100644 common/app/components/README.md create mode 100644 common/app/routes/Admin/README.md rename common/{screens/bonfires => app/routes/Bonfires}/Actions.js (100%) create mode 100644 common/app/routes/Bonfires/README.md rename common/{screens/bonfires => app/routes/Bonfires}/Store.js (100%) rename common/{screens/bonfires => app/routes/Bonfires/components}/Bonfires.jsx (100%) rename common/{screens/bonfires => app/routes/Bonfires/components}/Results.jsx (100%) rename common/{screens/bonfires => app/routes/Bonfires/components}/SidePanel.jsx (100%) rename common/{screens/bonfires => app/routes/Bonfires}/executeBonfire.js (100%) create mode 100644 common/app/routes/Bonfires/index.js create mode 100644 common/app/routes/FAVS/README.md create mode 100644 common/app/routes/Jobs/README.md create mode 100644 common/app/routes/Jobs/components/Actions.js create mode 100644 common/app/routes/Jobs/components/Jobs.jsx create mode 100644 common/app/routes/Jobs/components/List.jsx create mode 100644 common/app/routes/Jobs/components/Store.js create mode 100644 common/app/routes/Jobs/index.js create mode 100644 common/app/routes/index.js create mode 100644 common/app/shared/README.md rename common/{screens => app/shared}/displayCode/Display.jsx (100%) rename common/{screens => app/shared}/displayCode/index.js (100%) rename common/{screens => app/shared}/editor/Editor.jsx (100%) rename common/{screens => app/shared}/editor/index.js (100%) delete mode 100644 common/screens/App.jsx delete mode 100644 common/screens/Router.jsx delete mode 100644 common/screens/bonfires/index.js delete mode 100644 common/screens/context/Actions.js delete mode 100644 common/screens/context/Store.js delete mode 100644 common/screens/footer/Footer.jsx delete mode 100644 common/screens/footer/index.js delete mode 100644 common/screens/nav/index.js diff --git a/client/README.md b/client/README.md new file mode 100644 index 0000000000..b75516ce38 --- /dev/null +++ b/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 diff --git a/client/index.js b/client/index.js new file mode 100644 index 0000000000..68baa7ec0a --- /dev/null +++ b/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); + } + ); diff --git a/common/app/App.jsx b/common/app/App.jsx new file mode 100644 index 0000000000..f3a77cae51 --- /dev/null +++ b/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 ( +
+
+ ); + } +} diff --git a/common/app/appFactory.jsx b/common/app/appFactory.jsx new file mode 100644 index 0000000000..b8732a89c6 --- /dev/null +++ b/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 ( + + + + + + ); +}; diff --git a/common/app/components/Footer/Footer.jsx b/common/app/components/Footer/Footer.jsx new file mode 100644 index 0000000000..f95e0e3adc --- /dev/null +++ b/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 ( + + { this.renderContent(mobile, link.content) } + + ); + }); + } + + renderContent(mobile, content) { + if (mobile) { + return ( + + content; + + ); + } + return content; + } + + render() { + return ( + + + + { this.renderLinks() } + + + { this.renderLinks(true) } + + + + ); + } +} diff --git a/common/app/components/Footer/index.js b/common/app/components/Footer/index.js new file mode 100644 index 0000000000..c50e0cda87 --- /dev/null +++ b/common/app/components/Footer/index.js @@ -0,0 +1 @@ +export { default as Footer } from './Footer.jsx'; diff --git a/common/app/components/Footer/links.json b/common/app/components/Footer/links.json new file mode 100644 index 0000000000..54071917b4 --- /dev/null +++ b/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" + } +] diff --git a/common/screens/nav/Nav.jsx b/common/app/components/Nav/Nav.jsx similarity index 56% rename from common/screens/nav/Nav.jsx rename to common/app/components/Nav/Nav.jsx index 52a9a8728b..f5c339c2c1 100644 --- a/common/screens/nav/Nav.jsx +++ b/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({ +export default class extends React.Component { + constructor(props) { + super(props); + } - propTypes: { signedIn: React.PropTypes.bool }, + static displayName = 'Nav' + static propTypes = { + signedIn: React.PropTypes.bool + } - getDefaultProps: function() { - return { signedIn: false }; - }, - - _renderBrand: function() { + renderBrand() { var fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg'; return ( learn to code javascript at Free Code Camp logo + className='img-responsive nav-logo' + src={ fCClogo } /> ); - }, + } - _renderSignin: function() { + renderSignin() { if (this.props.signedIn) { return ( - Sign In + href='/login'> + Sign In ); } - }, - - render: function() { + } + render() { return ( + toggleNavKey={ 0 }>