Skip to content

Commit 2506651

Browse files
committed
[fix] update webpack and build
1 parent 2f9533d commit 2506651

File tree

9 files changed

+219
-84
lines changed

9 files changed

+219
-84
lines changed

.gitignore

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
/node_modules
2-
bundle.js
3-
bundle.js.map
2+
/dist
3+
44
.DS_Store
5+
56
/server/config/db-config.js
67

8+
79
/.idea

package.json

+15-15
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,11 @@
33
"version": "1.0.0",
44
"description": "Find an open seat in the coffee shop near you",
55
"main": "index.js",
6-
"directories": {
7-
"test": "tests"
8-
},
96
"scripts": {
10-
"start": "node ./src/server/server.js",
7+
"start": "npm run build && node ./src/server/server.js",
118
"dev": "nodemon ./src/server/server.js",
12-
"build": "webpack --watch",
9+
"devBuild": "webpack -d --watch",
10+
"build": "webpack -d",
1311
"test": "mocha"
1412
},
1513
"repository": {
@@ -23,29 +21,29 @@
2321
},
2422
"homepage": "https://github.com/crowdedProject/Crowded#readme",
2523
"devDependencies": {
26-
"babel-core": "^6.9.1",
27-
"babel-loader": "^6.2.4",
28-
"babel-preset-es2015": "^6.9.0",
29-
"babel-preset-react": "^6.5.0",
3024
"chai": "^3.5.0",
3125
"chai-jquery": "^2.0.0",
32-
"extract-text-webpack-plugin": "^1.0.1",
33-
"html-webpack-plugin": "^2.21.0",
34-
"jquery": "^2.2.4",
3526
"jsdom": "^9.2.1",
3627
"mocha": "^2.5.3",
3728
"react-addons-test-utils": "^15.1.0",
3829
"supertest": "^1.2.0",
39-
"supertest-as-promised": "^3.1.0",
40-
"webpack": "^1.13.1"
30+
"supertest-as-promised": "^3.1.0"
4131
},
4232
"dependencies": {
4333
"axios": "^0.12.0",
34+
"babel-core": "^6.10.4",
35+
"babel-loader": "^6.2.4",
36+
"babel-preset-es2015": "^6.9.0",
37+
"babel-preset-react": "^6.5.0",
4438
"babel-preset-stage-1": "^6.5.0",
4539
"body-parser": "^1.15.1",
40+
"css-loader": "^0.23.1",
4641
"express": "^4.13.4",
42+
"extract-text-webpack-plugin": "^1.0.1",
43+
"html-webpack-plugin": "^2.21.0",
4744
"lodash": "^4.13.1",
4845
"material-design-lite": "^1.1.3",
46+
"path": "^0.12.7",
4947
"pg": "^5.1.0",
5048
"pg-hstore": "^2.3.2",
5149
"react": "^15.1.0",
@@ -59,6 +57,8 @@
5957
"redux-logger": "^2.6.1",
6058
"redux-promise": "^0.5.3",
6159
"sequelize": "^3.23.3",
62-
"supertest": "^1.2.0"
60+
"style-loader": "^0.13.1",
61+
"supertest": "^1.2.0",
62+
"webpack": "^1.13.1"
6363
}
6464
}

src/client/components/cafe-field.js

+3-13
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,11 @@
11
import _ from 'lodash';
22
import React from 'react';
3-
import {Sparklines, SparklinesLine, SparklinesReferenceLine} from 'react-sparklines';
4-
5-
//example for seating data you'd pass in to generate seats available over time
6-
//can re-do this structure or not use at all, just a placeholder. Right now doesn't render b/c we don't have state
7-
function average(data) {
8-
return _.round(_.sum(data)/data.length);
9-
}
103

114
export default (props) => {
125
return (
13-
<div>
14-
<Sparklines height={120} width={180} data={props.data}>
15-
<SparklinesLine color={props.color}/>
16-
<SparklinesReferenceLine type="avg" />
17-
</Sparklines>
18-
<div>{average(props.data)}</div>
6+
<div className='pref-square-view'>
7+
this.props.pref;
8+
this.props.cafeData[0][this.props.pref];
199
</div>
2010
);
2111
}

src/client/containers/cafe-list.js

+3
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {bindActionCreators} from 'redux';
55
import {fetchData, updateData} from '../actions/cafe-db';
66
import {Link, browserHistory} from 'react-router';
77
import {Accordion, AccordionItem} from 'react-sanfona';
8+
import {CafeField} from '../components/cafe-field';
89

910
class CafeList extends Component {
1011
constructor (props) {
@@ -49,6 +50,8 @@ class CafeList extends Component {
4950
//</div>
5051
//push to array?
5152
//take array and concat and insert below
53+
//< CafeField />
54+
5255
}
5356
}
5457
let cafeId = cafeData[0].place_id;

src/client/index.html

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html lang="en-US">
3+
<head>
4+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
5+
<link rel="stylesheet" href="./style.css">
6+
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
7+
<link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.indigo-pink.min.css">
8+
<script defer src="https://code.getmdl.io/1.1.3/material.min.js"></script>
9+
<script src="https://cdn.auth0.com/js/lock-9.1.min.js"></script>
10+
11+
</head>
12+
<body>
13+
<h1 align="center">
14+
CrowdedCafe
15+
</h1>
16+
<div class="container">Server setup Test<div>
17+
</body>
18+
</html>

src/client/index.js

+2
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ import ReduxPromise from 'redux-promise';
99

1010
const createStoreWithMiddleware = applyMiddleware(ReduxPromise)(createStore);
1111

12+
require(`${__dirname}/style/style.css`);
13+
1214
ReactDOM.render(
1315
<Provider store={createStoreWithMiddleware(reducers)}>
1416
<Router history={browserHistory} routes={routes}/>

src/client/style/style.css

+143
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
.mdl-grid {
2+
margin: auto;
3+
width: 650px;
4+
height: 650px;
5+
}
6+
.mdl-cell.mdl-cell--4-col.unclicked {
7+
width: 200px;
8+
height: 200px;
9+
text-align: center;
10+
padding: 85px 0;
11+
color: white;
12+
text-transform: uppercase;
13+
font-size: 20pt;
14+
background: #3E4EB8;
15+
}
16+
.mdl-cell.mdl-cell--4-col.clicked {
17+
width: 200px;
18+
height: 200px;
19+
text-align: center;
20+
padding: 85px 0;
21+
color: white;
22+
text-transform: uppercase;
23+
font-size: 20pt;
24+
background: #737fd0;
25+
}
26+
.small-print {
27+
text-align: right;
28+
font-style: italic;
29+
}
30+
.small-print-button {
31+
text-align: right;
32+
font-style: normal;
33+
}
34+
.search-button {
35+
margin: auto;
36+
text-align: center;
37+
width: 256px;
38+
height: 30px;
39+
40+
}
41+
.mdl-button--raised.main {
42+
text-transform: uppercase;
43+
font-size: 16pt;
44+
padding: auto;
45+
width: 200px;
46+
height: 32px;
47+
background: #AED073;
48+
}
49+
.div-holder {
50+
margin: auto;
51+
width: 650px;
52+
height: 90px;
53+
}
54+
.demo-card-event.mdl-card {
55+
width: 256px;
56+
height: 256px;
57+
background: #3E4EB8;
58+
}
59+
.demo-switch{
60+
padding:60px;
61+
}
62+
63+
/* /cafe route css below */
64+
.cafe-list-holder {
65+
margin: auto;
66+
width: 650px;
67+
}
68+
div-holder-two {
69+
margin: auto;
70+
text-align: center;
71+
width: 650px;
72+
height: 100px;
73+
}
74+
.mdl-data-table {
75+
margin: auto;
76+
}
77+
.cafe-header {
78+
margin: auto;
79+
text-transform: uppercase;
80+
color: #3E4EB8;
81+
text-align: center;
82+
font-size: 16pt;
83+
}
84+
85+
86+
.mdl-cell > .dl-cell--4-col__actions {
87+
background: #737fd0;
88+
}
89+
.mdl-cell-event > .dl-cell--4-col__title {
90+
align-items: flex-start;
91+
}
92+
.mdl-cell-event > .dl-cell--4-col__title > h4 {
93+
margin-top: 0;
94+
}
95+
.mdl-cell-event > .mdl-cell--4-col__actions {
96+
display: flex;
97+
box-sizing:border-box;
98+
align-items: center;
99+
}
100+
.mdl-cell-event > .dl-cell--4-col__actions > .material-icons {
101+
padding-right: 10px;
102+
}
103+
.mdl-cell-event > .dl-cell--4-col__title,
104+
.mdl-cell-event > .dl-cell--4-col__actions,
105+
.mdl-cell-event > .dl-cell--4-col__actions > .mdl-button {
106+
color: #fff;
107+
}
108+
109+
.react-sanfona {
110+
&-title {
111+
background-color: #fafafa;
112+
border-top: 1px solid $gray;
113+
color: #333;
114+
padding: 20px;
115+
text-transform: uppercase;
116+
transition: background-color .3s;
117+
}
118+
119+
&:first-child &-title {
120+
border-top: none;
121+
}
122+
123+
&-expanded &-title {
124+
background-color: $primary-color;
125+
color: #fff;
126+
}
127+
128+
&-body-wrapper {
129+
color: #666;
130+
padding: 20px;
131+
position: relative;
132+
133+
&:hover .tooltip {
134+
opacity: 1;
135+
}
136+
}
137+
138+
img {
139+
display: block;
140+
max-width: 100%;
141+
}
142+
143+
}

style/style.css

-27
This file was deleted.

webpack.config.js

+31-27
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,40 @@
1-
// const HtmlWebpackPlugin = require('html-webpack-plugin');
2-
// const ExtractTextPlugin = require('extract-text-webpack-plugin');
1+
const webpack = require('webpack');
2+
const path = require('path');
3+
const HtmlWebpackPlugin = require('html-webpack-plugin');
4+
const ExtractTextPlugin = require('extract-text-webpack-plugin');
35

4-
//look at docs and update to include html webpack! (this will allow you to delete the style folder from dist)
6+
const BUILD_DIR = path.resolve(__dirname, 'dist');
7+
const APP_DIR = path.resolve(__dirname, 'src/client');
58

6-
module.exports = {
7-
devtool: 'source-map',
8-
entry: [
9-
'./src/client/index.js'
10-
],
9+
const config = {
10+
entry: `${APP_DIR}/index.js`,
1111
output: {
12-
path: `${__dirname}/dist`,
12+
path: BUILD_DIR,
1313
publicPath: '/',
1414
filename: 'bundle.js'
1515
},
16-
// plugins: [
17-
// new HtmlWebpackPlugin({
18-
// title: 'crowdedCafe',
19-
// template: 'client/index.html',
20-
// filename: 'index.html'
21-
// }),
22-
// new ExtractTextPlugin('style.css')
23-
// ],
16+
plugins: [
17+
new HtmlWebpackPlugin({
18+
title: 'CrowdedCafe',
19+
template: 'src/client/index.html',
20+
filename: 'index.html'
21+
}),
22+
new ExtractTextPlugin('style.css')
23+
],
2424
module: {
25-
loaders: [{
26-
exclude: /node_modules/,
27-
loader: 'babel',
28-
query: {
29-
presets: ['react', 'es2015', 'stage-1']
25+
loaders: [
26+
{
27+
test : /\.js?/,
28+
include : APP_DIR,
29+
loader : 'babel'
30+
},
31+
{
32+
test: /\.css$/,
33+
include: APP_DIR,
34+
loader: ExtractTextPlugin.extract('style-loader', 'css-loader')
3035
}
31-
}]
32-
},
33-
resolve: {
34-
extensions: ['', '.js', '.jsx']
36+
]
3537
}
36-
}
38+
}
39+
40+
module.exports = config;

0 commit comments

Comments
 (0)