diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/.babelrc b/frontend/.babelrc
new file mode 100644
index 0000000..47c9ace
--- /dev/null
+++ b/frontend/.babelrc
@@ -0,0 +1,4 @@
+{
+ "presets": ["es2015", "react"],
+ "plugins": ["transform-object-rest-spread"]
+}
diff --git a/frontend/.eslintrc b/frontend/.eslintrc
new file mode 100644
index 0000000..8dc6807
--- /dev/null
+++ b/frontend/.eslintrc
@@ -0,0 +1,21 @@
+{
+ "rules": {
+ "no-console": "off",
+ "indent": [ "error", 2 ],
+ "quotes": [ "error", "single" ],
+ "semi": ["error", "always"],
+ "linebreak-style": [ "error", "unix" ]
+ },
+ "env": {
+ "es6": true,
+ "node": true,
+ "mocha": true,
+ "jasmine": true
+ },
+ "ecmaFeatures": {
+ "modules": true,
+ "experimentalObjectRestSpread": true,
+ "impliedStrict": true
+ },
+ "extends": "eslint:recommended"
+}
diff --git a/frontend/.gitignore b/frontend/.gitignore
new file mode 100644
index 0000000..57bad08
--- /dev/null
+++ b/frontend/.gitignore
@@ -0,0 +1,70 @@
+# Created by https://www.gitignore.io/api/osx,linux,node,vim
+node_modules
+.env
+.test.env
+db/
+build/
+
+.DS_Store
+.AppleDouble
+.LSOverride
+
+### Linux ###
+*~
+
+# temporary files which can be created if a process still has a handle open of a deleted file
+.fuse_hidden*
+
+# KDE directory preferences
+.directory
+
+# Linux trash folder which might appear on any partition or disk
+.Trash-*
+
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+.tern-project
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules
+jspm_packages
+
+# Optional npm cache directory
+.npm
+
+# Optional REPL history
+.node_repl_history
+
+### Vim ###
+# swap
+[._]*.s[a-w][a-z]
+[._]s[a-w][a-z]
+# session
+Session.vim
+# temporary
+.netrwhist
+*~
+
+# auto-generated tag files
+tags
diff --git a/frontend/package.json b/frontend/package.json
new file mode 100644
index 0000000..dc51e76
--- /dev/null
+++ b/frontend/package.json
@@ -0,0 +1,39 @@
+{
+ "name": "frontend",
+ "version": "1.0.0",
+ "description": "",
+ "main": "webpack.config.js",
+ "scripts": {
+ "build": "webpack",
+ "watch": "webpack-dev-server --inline --hot"
+ },
+ "keywords": [],
+ "author": "",
+ "license": "ISC",
+ "dependencies": {
+ "babel-core": "^6.26.0",
+ "babel-loader": "^7.1.2",
+ "babel-plugin-transform-object-rest-spread": "^6.26.0",
+ "babel-preset-es2015": "^6.24.1",
+ "babel-preset-react": "^6.24.1",
+ "clean-webpack-plugin": "^0.1.16",
+ "css-loader": "^0.28.7",
+ "dotenv": "^4.0.0",
+ "extract-text-webpack-plugin": "^3.0.0",
+ "file-loader": "^0.11.2",
+ "html-webpack-plugin": "^2.30.1",
+ "node-sass": "^4.5.3",
+ "react": "^15.6.1",
+ "react-dom": "^15.6.1",
+ "react-redux": "^5.0.6",
+ "react-router": "^4.2.0",
+ "react-router-dom": "^4.2.2",
+ "redux": "^3.7.2",
+ "sass-loader": "^6.0.6",
+ "superagent": "^3.6.0",
+ "uglifyjs-webpack-plugin": "^0.4.6",
+ "url-loader": "^0.5.9",
+ "webpack": "^3.5.6",
+ "webpack-dev-server": "^2.7.1"
+ }
+}
diff --git a/frontend/src/action/auth-actions.js b/frontend/src/action/auth-actions.js
new file mode 100644
index 0000000..6b9dc99
--- /dev/null
+++ b/frontend/src/action/auth-actions.js
@@ -0,0 +1,35 @@
+import superagent from 'superagent';
+
+export const tokenSet = (token) => ({
+ type: 'TOKEN_SET',
+ payload: token
+})
+
+export const tokenDelete = () => ({
+ type: 'TOKEN_DELETE'
+})
+
+export const signupRequest = (user) => (dispatch) => {
+ return superagent.post(`${__API_URL__}/signup`)
+ .withCredentials()
+ .send(user)
+ .then( res => {
+ dispatch(tokenSet(res.text));
+ try {
+ localStorage.token = res.text;
+ } catch (err) {
+ console.log(err);
+ }
+ return res;
+ })
+}
+
+export const loginRequest = (user) => (dispatch) => {
+ return superagent.get(`${__API_URL__}/login`)
+ .withCredentials()
+ .auth(user.username, user.password)
+ .then(res => {
+ dispatch(tokenSet(res.text))
+ return res;
+ })
+}
diff --git a/frontend/src/component/app/index.js b/frontend/src/component/app/index.js
new file mode 100644
index 0000000..9c057d6
--- /dev/null
+++ b/frontend/src/component/app/index.js
@@ -0,0 +1,34 @@
+import React from 'react';
+import {Provider} from 'react-redux';
+import {BrowserRouter, Route, Link} from 'react-router-dom';
+import appStoreCreate from '../../lib/app-create-store.js';
+import LandingContainer from '../landing-container';
+
+let store = appStoreCreate();
+
+class App extends React.Component {
+ render() {
+ return (
+
+ )
+ }
+}
+
+export default App;
diff --git a/frontend/src/component/auth-form/index.js b/frontend/src/component/auth-form/index.js
new file mode 100644
index 0000000..8e7433a
--- /dev/null
+++ b/frontend/src/component/auth-form/index.js
@@ -0,0 +1,91 @@
+import React from 'react';
+import * as util from '../../lib/util.js';
+
+class AuthForm extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ username: '',
+ email: '',
+ password: '',
+ usernameError: null,
+ passwordError: null,
+ emailError: null,
+ error: null
+ }
+
+ this.handleChange = this.handleChange.bind(this);
+ this.handleSubmit = this.handleSubmit.bind(this);
+ }
+
+ handleChange(e) {
+ let {name, value} = e.target;
+
+ this.setState({
+ [name]: value,
+ usernameError: name === 'username' && !value ? 'username required' : null,
+ emailError: name === 'email' && !value ? 'email required' : null,
+ passwordError: name === 'password' && !value ? 'password required' : null
+ })
+ }
+
+ handleSubmit(e) {
+ e.preventDefault();
+ this.props.onComplete(this.state)
+ .then(() => {
+ this.setState({ username: '', email: '', password: ''})
+ })
+ .catch(error => {
+ console.error(error);
+ this.setState({error});
+ })
+ }
+
+ render() {
+ return (
+
+ )
+ }
+}
+
+export default AuthForm;
diff --git a/frontend/src/component/landing-container/index.js b/frontend/src/component/landing-container/index.js
new file mode 100644
index 0000000..50c73e1
--- /dev/null
+++ b/frontend/src/component/landing-container/index.js
@@ -0,0 +1,30 @@
+import React from 'react';
+import {connect} from 'react-redux';
+import AuthForm from '../auth-form';
+import {signupRequest, loginRequest} from '../../action/auth-actions.js';
+import * as util from '../../lib/util.js';
+
+class LandingContainer extends React.Component {
+ render() {
+ let {params} = this.props.match;
+
+ let handleComplete = params === 'auth' ? this.props.login :this.props.signup
+
+ return (
+
+ )
+ }
+}
+
+let mapDispatchToProps = (dispatch) => {
+ return {
+ signup: (user) => dispatch(signupRequest(user)),
+ login: (user) => dispatch(loginRequest(user))
+ }
+}
+
+export default connect(undefined, mapDispatchToProps)(LandingContainer);
diff --git a/frontend/src/index.html b/frontend/src/index.html
new file mode 100644
index 0000000..165d751
--- /dev/null
+++ b/frontend/src/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+ cfgram
+
+
+
+
+
diff --git a/frontend/src/lib/app-create-store.js b/frontend/src/lib/app-create-store.js
new file mode 100644
index 0000000..432c33d
--- /dev/null
+++ b/frontend/src/lib/app-create-store.js
@@ -0,0 +1,9 @@
+import reducer from '../reducer';
+import thunk from './redux-thunk.js';
+import reporter from './redux-reporter.js';
+import {createStore, applyMiddleware} from 'redux';
+
+let appStoreCreate = () =>
+ createStore(reducer, applyMiddleware(thunk, reporter))
+
+export default appStoreCreate;
diff --git a/frontend/src/lib/redux-reporter.js b/frontend/src/lib/redux-reporter.js
new file mode 100644
index 0000000..00adddd
--- /dev/null
+++ b/frontend/src/lib/redux-reporter.js
@@ -0,0 +1,15 @@
+let reporter = store => next => action => {
+ console.log('__ACTION__', action);
+
+ try {
+ let result = next(action);
+ console.log('__STATE__', store.getState());
+ return result;
+ } catch (error) {
+ error.action = action;
+ console.error('__ERROR__', error);
+ return error;
+ }
+}
+
+export default reporter;
diff --git a/frontend/src/lib/redux-thunk.js b/frontend/src/lib/redux-thunk.js
new file mode 100644
index 0000000..89aa9c3
--- /dev/null
+++ b/frontend/src/lib/redux-thunk.js
@@ -0,0 +1,5 @@
+//gives us the ability to create an action creater that deals with async ajax requests
+export default store => next => action =>
+ typeof action === 'function' //functions are async actions
+ ? action(store.dispatch, store.getState)
+ : next(action)
diff --git a/frontend/src/lib/util.js b/frontend/src/lib/util.js
new file mode 100644
index 0000000..b6b9e60
--- /dev/null
+++ b/frontend/src/lib/util.js
@@ -0,0 +1,22 @@
+export const log = (...arg) =>
+ __DEBUG__ ? console.log(...args) : undefined;
+
+export const logError = (...args) =>
+ __DEBUG__ ? console.error(...args) : undefined;
+
+export const renderIf = (test, component) => test ? component : undefined;
+
+export const classToggler = (options) =>
+ Object.keys(options).filter(key => !!options[key]).join(' ');
+
+export const map = (list, ...args) =>
+ Array.prototype.map.apply(list, args);
+
+export const filter = (list, ...args) =>
+ Array.prototype.filter.apply(list, args);
+
+export const reduce = (list, ...args) =>
+ Array.prototype.reduce.apply(list, args);
+
+
+//these are just helpful methods, shortcuts kinda
diff --git a/frontend/src/main.js b/frontend/src/main.js
new file mode 100644
index 0000000..faafd74
--- /dev/null
+++ b/frontend/src/main.js
@@ -0,0 +1,5 @@
+import React from 'react';
+import ReactDom from 'react-dom';
+import App from './component/app';
+
+ReactDom.render(, document.getElementById('root'));
diff --git a/frontend/src/reducer/auth.js b/frontend/src/reducer/auth.js
new file mode 100644
index 0000000..a714ed3
--- /dev/null
+++ b/frontend/src/reducer/auth.js
@@ -0,0 +1,11 @@
+export default(state=null, action) => {
+ let {type, payload} = action;
+ switch(type) {
+ case 'TOKEN_SET':
+ return payload
+ case 'TOKEN_DELETE':
+ return null
+ default:
+ return state
+ }
+}
diff --git a/frontend/src/reducer/index.js b/frontend/src/reducer/index.js
new file mode 100644
index 0000000..a096f45
--- /dev/null
+++ b/frontend/src/reducer/index.js
@@ -0,0 +1,6 @@
+import {combineReducers} from 'redux';
+import auth from './auth.js';
+
+export default combineReducers({
+ auth,
+})
diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js
new file mode 100644
index 0000000..e06dfe6
--- /dev/null
+++ b/frontend/webpack.config.js
@@ -0,0 +1,86 @@
+'use strict';
+
+require('dotenv').config();
+const production = process.env.NODE_ENV === 'production';
+
+const {DefinePlugin, EnvironmentPlugin} = require('webpack');
+const HtmlPlugin = require('html-webpack-plugin');
+const CleanPlugin = require('clean-webpack-plugin');
+const UglifyPlugin = require('uglifyjs-webpack-plugin');
+const ExtractPlugin = require('extract-text-webpack-plugin');
+
+let plugins = [
+ new EnvironmentPlugin(['NODE_ENV']),
+ new ExtractPlugin('bundle-[hash].css'),
+ new HtmlPlugin({ template: `${__dirname}/src/index.html` }),
+ new DefinePlugin({
+ __DEBUG__: JSON.stringify(!production),
+ __API_URL__: JSON.stringify(process.env.API_URL)
+ })
+]
+
+if (production) {
+ plugins = plugins.concat([ new CleanPlugin(), new UglifyPlugin() ]);
+}
+
+module.exports = {
+ plugins,
+ entry: `${__dirname}/src/main.js`,
+ devServer: {
+ historyApiFallback: true
+ },
+ devtool: production ? undefined : 'eval',
+ output: {
+ path: `${__dirname}/build`,
+ filename: 'bundle-[hash].js',
+ publicPath: process.env.CDN_URL
+ },
+ module: {
+ rules: [
+ {
+ test: /\.js$/,
+ exclude: /node_modules/,
+ loader: 'babel-loader'
+ },
+ {
+ test: /\.scss$/,
+ loader: ExtractPlugin.extract(['css-loader', 'sass-loader'])
+ },
+ {
+ test: /\.(woff|woff2|ttf|eot|glyph|\.svg)$/,
+ use: [
+ {
+ loader: 'url-loader',
+ options: {
+ limit: 10000,
+ name: 'font/[name].[ext]'
+ }
+ }
+ ]
+ },
+ {
+ test: /\.(jpg|jpeg|gif|png|tiff|svg)$/,
+ exclude: /\.glyph.svg/,
+ use: [
+ {
+ loader: 'url-loader',
+ options: {
+ limit: 6000,
+ name: 'image/[name].[ext]'
+ }
+ }
+ ]
+ },
+ {
+ test: /\.(mp3|aac|aiff|wav|flac|m4a|mp4|ogg)$/,
+ exclude: /\.glyph.svg/,
+ use: [
+ {
+ loader: 'file-loader',
+ options: { name: 'audio/[name].[ext]' }
+ }
+ ]
+ }
+ ]
+ }
+}
diff --git a/npm-debug.log b/npm-debug.log
new file mode 100644
index 0000000..75c32d2
--- /dev/null
+++ b/npm-debug.log
@@ -0,0 +1,23 @@
+0 info it worked if it ends with ok
+1 verbose cli [ '/Users/Andymartin/.nvm/versions/node/v6.11.1/bin/node',
+1 verbose cli '/Users/Andymartin/.nvm/versions/node/v6.11.1/bin/npm',
+1 verbose cli 'run',
+1 verbose cli 'watch' ]
+2 info using npm@3.10.10
+3 info using node@v6.11.1
+4 verbose stack Error: ENOENT: no such file or directory, open '/Users/Andymartin/codefellows/401/labs/week-8/32-auth/package.json'
+4 verbose stack at Error (native)
+5 verbose cwd /Users/Andymartin/codefellows/401/labs/week-8/32-auth
+6 error Darwin 15.6.0
+7 error argv "/Users/Andymartin/.nvm/versions/node/v6.11.1/bin/node" "/Users/Andymartin/.nvm/versions/node/v6.11.1/bin/npm" "run" "watch"
+8 error node v6.11.1
+9 error npm v3.10.10
+10 error path /Users/Andymartin/codefellows/401/labs/week-8/32-auth/package.json
+11 error code ENOENT
+12 error errno -2
+13 error syscall open
+14 error enoent ENOENT: no such file or directory, open '/Users/Andymartin/codefellows/401/labs/week-8/32-auth/package.json'
+15 error enoent ENOENT: no such file or directory, open '/Users/Andymartin/codefellows/401/labs/week-8/32-auth/package.json'
+15 error enoent This is most likely not a problem with npm itself
+15 error enoent and is related to npm not being able to find a file.
+16 verbose exit [ -2, true ]
diff --git a/sluggram b/sluggram
new file mode 160000
index 0000000..1fc6e99
--- /dev/null
+++ b/sluggram
@@ -0,0 +1 @@
+Subproject commit 1fc6e992ae12d84d6e3f8dfc67a18c9f2eca29ad