diff --git a/.eslintrc b/.eslintrc index 4259dfd..49aa49e 100644 --- a/.eslintrc +++ b/.eslintrc @@ -2,7 +2,8 @@ "extends": [ "eslint:recommended", "plugin:import/errors", - "plugin:import/warnings" + "plugin:import/warnings", + "airbnb" ], "plugins": [ "react" @@ -15,33 +16,57 @@ } }, "env": { - "es6": true, "browser": true, - "node": true, + "es6": true, "jquery": true, - "mocha": true + "mocha": true, + "node": true }, "rules": { - "quotes": 0, - "no-console": 1, - "no-debugger": 1, - "no-var": 1, - "semi": [1, "always"], - "no-trailing-spaces": 0, + "arrow-body-style": [1, "as-needed"], + "arrow-parens": [1, "as-needed"], + "comma-dangle": [1, "never"], + "consistent-return": 0, "eol-last": 0, - "no-unused-vars": 0, - "no-underscore-dangle": 0, + "func-names": 0, + "import/extensions": 0, + "react/require-extension": 0, + "import/imports-first": 0, + "import/no-extraneous-dependencies": 0, + "import/no-unresolved": 0, + "indent": [1, "tab", { "SwitchCase": 1, "VariableDeclarator": 1 }], + "jsx-a11y/href-no-hash": 0, + "jsx-quotes": 1, + "linebreak-style": 0, + "max-len": 0, "no-alert": 0, + "no-console": 1, + "no-debugger": 1, + "no-global-assign": 0, "no-lone-blocks": 0, - "jsx-quotes": 1, - "react/display-name": [ 1, {"ignoreTranspilerName": false }], - "react/forbid-prop-types": [1, {"forbid": ["any"]}], + "no-multi-spaces": 1, + "no-shadow": 0, + "no-trailing-spaces": 1, + "no-underscore-dangle": 0, + "no-unsafe-negation": 0, + "no-unused-vars": [1, { "varsIgnorePattern": "(bindActionCreators|colors|chalk|dotenv|PropTypes)", "args": "none" }], + "no-use-before-define": 0, + "no-useless-constructor": 0, + "no-var": 1, + "no-tabs": 0, + "object-curly-spacing": 1, + "one-var": 0, + "quotes": 0, + "react/display-name": [ 1, { "ignoreTranspilerName": false }], + "react/forbid-prop-types": [1, { "forbid": ["any"] }], "react/jsx-boolean-value": 1, - "react/jsx-closing-bracket-location": 0, + "react/jsx-closing-bracket-location": [1, { "selfClosing": "tag-aligned", "nonEmpty": "after-props" }], "react/jsx-curly-spacing": 1, + "react/jsx-filename-extension": 0, + "react/jsx-indent": [1, "tab"], "react/jsx-indent-props": 0, "react/jsx-key": 1, - "react/jsx-max-props-per-line": 0, + "react/jsx-max-props-per-line": [1, { "maximum": 5 }], "react/jsx-no-bind": 0, "react/jsx-no-duplicate-props": 1, "react/jsx-no-literals": 0, @@ -49,8 +74,10 @@ "react/jsx-pascal-case": 1, "react/jsx-sort-prop-types": 0, "react/jsx-sort-props": 0, + "react/jsx-space-before-closing": [1, "always"], "react/jsx-uses-react": 1, "react/jsx-uses-vars": 1, + "react/jsx-wrap-multilines": 1, "react/no-danger": 1, "react/no-did-mount-set-state": 1, "react/no-did-update-set-state": 1, @@ -59,11 +86,17 @@ "react/no-set-state": 0, "react/no-unknown-property": 1, "react/prefer-es6-class": 1, + "react/prefer-stateless-function": 0, "react/prop-types": 1, "react/react-in-jsx-scope": 1, - "react/require-extension": 1, "react/self-closing-comp": 1, "react/sort-comp": 1, - "react/wrap-multilines": 1 + "semi": [1, "always"] + }, + "settings": { + "react": { + "pragma": "React", + "version": "15.0" + } } } diff --git a/package.json b/package.json index 537d3ae..e3bc50c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-starter-kit", - "version": "1.0.0", + "version": "1.0.1", "description": "Build project using ReactJS, Redux, Webpack and Babel", "scripts": { "postinstall": "bower install", @@ -16,7 +16,6 @@ "switch-dist": "npm run remove-dist && mv dist2 dist", "check-dist": "babel-node utils/checkDist.js", "create-dist2": "mkdir ./dist2", - "remove-dist": "rimraf ./dist", "prebuild": "npm-run-all lint check-dist create-dist2 build:html check-dotenv", "build": "babel-node utils/build.js", "postbuild": "npm-run-all switch-dist post:message", @@ -26,59 +25,63 @@ "author": "June Domingo ", "license": "MIT", "dependencies": { - "autoprefixer": "^6.3.7", + "autoprefixer": "^6.5.2", "axios": "^0.12.0", - "babel-cli": "6.8.0", - "babel-core": "6.8.0", - "babel-loader": "6.2.4", - "babel-plugin-react-display-name": "2.0.0", - "babel-polyfill": "^6.8.0", - "babel-preset-es2015": "6.6.0", - "babel-preset-react": "6.5.0", - "babel-preset-react-hmre": "1.1.1", - "babel-register": "6.8.0", - "colors": "1.1.2", - "compression": "^1.6.1", - "css-loader": "0.23.1", - "enzyme": "2.2.0", - "eslint": "2.9.0", - "eslint-plugin-import": "1.6.1", - "eslint-plugin-react": "5.0.1", - "eslint-watch": "2.1.11", - "expect": "1.19.0", - "express": "4.13.4", - "extract-text-webpack-plugin": "1.0.1", - "file-loader": "0.8.5", - "jquery": "^3.0.0", - "mocha": "2.4.5", - "npm-run-all": "1.8.0", + "babel-cli": "^6.8.0", + "babel-core": "^6.8.0", + "babel-loader": "^6.2.4", + "babel-plugin-react-display-name": "^2.0.0", + "babel-polyfill": "^6.16.0", + "babel-preset-es2015": "^6.6.0", + "babel-preset-react": "^6.5.0", + "babel-preset-react-hmre": "^1.1.1", + "babel-register": "^6.8.0", + "colors": "^1.1.2", + "compression": "^1.6.2", + "css-loader": "^0.23.1", + "enzyme": "^2.2.0", + "eslint": "^3.9.1", + "eslint-config-airbnb": "^13.0.0", + "eslint-plugin-import": "^2.1.0", + "eslint-plugin-jsx-a11y": "^2.2.3", + "eslint-plugin-react": "^6.6.0", + "eslint-watch": "^2.1.14", + "expect": "^1.19.0", + "express": "^4.13.4", + "extract-text-webpack-plugin": "^1.0.1", + "file-loader": "^0.8.5", + "jquery": "^3.1.1", + "lodash": "^4.16.6", + "mocha": "^2.4.5", + "npm-run-all": "^1.8.0", "open": "0.0.5", "poststylus": "^0.2.3", "progress-bar-webpack-plugin": "^1.9.0", - "react": "^15.0.2", - "react-addons-test-utils": "15.0.2", + "react": "^15.3.2", + "react-addons-test-utils": "^15.0.2", "react-document-title": "^2.0.2", - "react-dom": "^15.0.2", + "react-dom": "^15.3.2", "react-redux": "^4.4.5", - "react-router": "^2.4.0", - "react-router-redux": "4.0.4", - "redux": "^3.5.2", - "redux-logger": "^2.6.1", - "redux-thunk": "^2.0.1", - "rimraf": "2.5.2", - "style-loader": "0.13.1", + "react-router": "^2.8.1", + "react-router-redux": "^4.0.4", + "redux": "^3.6.0", + "redux-logger": "^2.7.4", + "redux-thunk": "^2.1.0", + "rimraf": "^2.5.2", + "style-loader": "^0.13.1", "stylus": "^0.54.5", - "stylus-loader": "^2.1.1", + "stylus-loader": "^2.3.1", + "toaster": "^0.1.2", "toastr": "^2.1.2", - "url-loader": "0.5.7", - "webpack": "1.13.0", - "webpack-dotenv-plugin": "^1.3.2" + "url-loader": "^0.5.7", + "webpack": "^1.13.0", + "webpack-dotenv-plugin": "^1.4.0" }, "devDependencies": { - "eventsource-polyfill": "0.9.6", - "redux-immutable-state-invariant": "1.2.3", - "webpack-dev-middleware": "1.6.1", - "webpack-hot-middleware": "2.10.0" + "eventsource-polyfill": "^0.9.6", + "redux-immutable-state-invariant": "^1.2.3", + "webpack-dev-middleware": "^1.6.1", + "webpack-hot-middleware": "^2.10.0" }, "repository": { "type": "git", diff --git a/src/constants/actionTypes.js b/src/constants/actionTypes.js index 86a835c..65b3949 100644 --- a/src/constants/actionTypes.js +++ b/src/constants/actionTypes.js @@ -2,4 +2,4 @@ export const LOAD_POSTS_SUCCESS = 'LOAD_POSTS_SUCCESS'; export const LOAD_POST_SUCCESS = 'LOAD_POST_SUCCESS'; export const UPDATE_POST_SUCCESS = 'UPDATE_POST_SUCCESS'; export const CREATE_POST_SUCCESS = 'CREATE_POST_SUCCESS'; -export const DELETE_POST_SUCCESS = 'DELETE_POST_SUCCESS'; \ No newline at end of file +export const DELETE_POST_SUCCESS = 'DELETE_POST_SUCCESS'; diff --git a/src/constants/api.js b/src/constants/api.js index 3483207..a07f6aa 100644 --- a/src/constants/api.js +++ b/src/constants/api.js @@ -1 +1,2 @@ -export const URL = process.env.API_URL; \ No newline at end of file +/* eslint-disable import/prefer-default-export */ // remove this line if you have more than 2 variables +export const URL = process.env.API_URL; diff --git a/src/index.js b/src/index.js index e6ae0af..9a2b098 100644 --- a/src/index.js +++ b/src/index.js @@ -1,12 +1,13 @@ -/*eslint-disable import/default*/ - +/* eslint-disable import/default */ +/* eslint-disable import/first */ import 'babel-polyfill'; import React from 'react'; -import {render} from 'react-dom'; +import { Provider } from 'react-redux'; +import { render } from 'react-dom'; +import { Router, browserHistory } from 'react-router'; import configureStore from './store/configureStore'; -import {Provider} from 'react-redux'; -import {Router, browserHistory} from 'react-router'; import routes from './routes'; + import 'toastr/build/toastr.min.css'; import '../bower_components/bootstrap/dist/css/bootstrap.min.css'; import '../bower_components/Ionicons/css/ionicons.min.css'; @@ -18,4 +19,4 @@ render( , document.getElementById('app') -); \ No newline at end of file +); diff --git a/src/modules/Layout.js b/src/modules/Layout.js index a2fa4f7..a53802f 100644 --- a/src/modules/Layout.js +++ b/src/modules/Layout.js @@ -1,7 +1,8 @@ -import React, {PropTypes} from 'react'; -import Header from './_global/Header'; -import {browserHistory} from 'react-router'; +/* eslint-disable class-methods-use-this */ +import React, { PropTypes } from 'react'; +import { browserHistory } from 'react-router'; import DocumentTitle from 'react-document-title'; +import Header from './_global/Header'; class Layout extends React.Component { constructor(props, context) { @@ -18,9 +19,9 @@ class Layout extends React.Component { render() { return (
- +
-
+
{this.props.children}
@@ -31,4 +32,4 @@ Layout.propTypes = { children: PropTypes.object.isRequired }; -export default Layout; \ No newline at end of file +export default Layout; diff --git a/src/modules/_global/Header.js b/src/modules/_global/Header.js index 2b04372..ed434df 100644 --- a/src/modules/_global/Header.js +++ b/src/modules/_global/Header.js @@ -1,31 +1,29 @@ -import React, {PropTypes} from 'react'; -import {Link, IndexLink} from 'react-router'; +/* eslint-disable jsx-a11y/no-static-element-interactions */ +import React, { PropTypes } from 'react'; +import { Link, IndexLink } from 'react-router'; -const Header = ({redirectToIndex}) => { - return ( -
-
- -
- +const Header = ({ redirectToIndex }) => ( +
+
+
- ); -}; - +
    +
  • + Home +
    • +
  • + Example +
    • +
  • + Github +
    • +
+
+); Header.propTypes = { redirectToIndex: PropTypes.func.isRequired }; -export default Header; \ No newline at end of file +export default Header; diff --git a/src/modules/_global/PageNotFound.js b/src/modules/_global/PageNotFound.js index 713768e..3fd72f7 100644 --- a/src/modules/_global/PageNotFound.js +++ b/src/modules/_global/PageNotFound.js @@ -1,15 +1,14 @@ +/* eslint-disable global-require */ import React from 'react'; -const PageNotFound = () => { - return ( -
-
-

Error 404: Noodles not found

- -

Hinalungkat ko....wala talaga eh

-
+const PageNotFound = () => ( +
+
+

Error 404: Noodles not found

+ noodlesnotfound +

Hinalungkat ko....wala talaga eh

- ); -}; +
+); -export default PageNotFound; \ No newline at end of file +export default PageNotFound; diff --git a/src/modules/_global/forms/TextInput.js b/src/modules/_global/forms/TextInput.js index 1386926..78e6291 100644 --- a/src/modules/_global/forms/TextInput.js +++ b/src/modules/_global/forms/TextInput.js @@ -1,12 +1,12 @@ -import React, {PropTypes} from 'react'; +import React, { PropTypes } from 'react'; -const TextInput = ({name, label, onChange, placeholder, value, error}) => { +const TextInput = ({ name, label, onChange, placeholder, value, error }) => { let formGroup = 'form-group'; let formControl = 'form-control'; if (error && error.length > 0) { - formGroup += " " + 'has-danger'; - formControl += " " + 'form-control-danger'; + formGroup += ` has-danger`; + formControl += ` form-control-danger `; } return ( @@ -19,7 +19,8 @@ const TextInput = ({name, label, onChange, placeholder, value, error}) => { className={formControl} placeholder={placeholder} value={value} - onChange={onChange}/> + onChange={onChange} + /> {error &&
{error}
}
diff --git a/src/modules/home/Home.js b/src/modules/home/Home.js index 16959cc..58ca9d7 100644 --- a/src/modules/home/Home.js +++ b/src/modules/home/Home.js @@ -1,18 +1,17 @@ import React from 'react'; + import HomeShowcase from './components/HomeShowcase'; import HomeTechnologies from './components/HomeTechnologies'; import HomeInstallation from './components/HomeInstallation'; -const Home = () => { - return ( -
- -
- - -
+const Home = () => ( +
+ +
+ +
- ); -}; +
+); -export default Home; \ No newline at end of file +export default Home; diff --git a/src/modules/home/components/HomeInstallation.js b/src/modules/home/components/HomeInstallation.js index a513fc9..ffd0859 100644 --- a/src/modules/home/components/HomeInstallation.js +++ b/src/modules/home/components/HomeInstallation.js @@ -1,32 +1,30 @@ import React from 'react'; -const HomeInstallation = () => { - return ( -
-

Installation:

-
Clone starter-kit api repo
-
-
    -
  • $ git clone https://github.com/JuneDomingo/react-starterkit-api.git
    • -
  • $ cd react-starterkit-api
    • -
  • $ npm install
    • -
  • $ npm start
    • -
-
+const HomeInstallation = () => ( +
+

Installation:

+
Clone starter-kit api repo
+
+
    +
  • $ git clone https://github.com/JuneDomingo/react-starterkit-api.git
    • +
  • $ cd react-starterkit-api
    • +
  • $ npm install
    • +
  • $ npm start
    • +
+
-
Clone starter-kit repo
-
-
    -
  • $ git clone https://github.com/JuneDomingo/react-starterkit.git
    • -
  • $ cd react-starterkit
    • -
  • $ npm install
    • -
  • $ npm start -s
    • -
-
+
Clone starter-kit repo
+
+
    +
  • $ git clone https://github.com/JuneDomingo/react-starterkit.git
    • +
  • $ cd react-starterkit
    • +
  • $ npm install
    • +
  • $ npm start -s
    • +
+
-
... and you can now start coding :-)
-
- ); -}; +
... and you can now start coding :-)
+
+); -export default HomeInstallation; \ No newline at end of file +export default HomeInstallation; diff --git a/src/modules/home/components/HomeShowcase.js b/src/modules/home/components/HomeShowcase.js index 1295e3a..b2d6366 100644 --- a/src/modules/home/components/HomeShowcase.js +++ b/src/modules/home/components/HomeShowcase.js @@ -1,17 +1,15 @@ import React from 'react'; -const HomeShowcase = () => { - return ( -
-
-

React Starterkit

-
-
- Build project using ReactJS, Redux, Webpack and Babel -
-
-
- ); -}; +const HomeShowcase = () => ( +
+
+

React Starterkit

+
+
+ Build project using ReactJS, Redux, Webpack and Babel +
+
+
+); -export default HomeShowcase; \ No newline at end of file +export default HomeShowcase; diff --git a/src/modules/home/components/HomeTechnologies.js b/src/modules/home/components/HomeTechnologies.js index 348d95a..88749d1 100644 --- a/src/modules/home/components/HomeTechnologies.js +++ b/src/modules/home/components/HomeTechnologies.js @@ -1,36 +1,34 @@ import React from 'react'; -const HomeTechnologies = () => { - return ( -
-

Technologies:

-
    -
  • Redux -
    Predictable state container for JavaScript apps
    -
    • +const HomeTechnologies = () => ( +
    +

    Technologies:

    +
      +
    • Redux +
      Predictable state container for JavaScript apps
      +
      • -
    • Webpack -
      A bundler for javascript and friends
      -
      • +
    • Webpack +
      A bundler for javascript and friends
      +
      • -
    • React-Router -
      A complete routing library for React
      -
      • +
    • React-Router +
      A complete routing library for React
      +
      • -
    • Babel -
      Compiles ES6 to ES5. Enjoy the new version of JavaScript today
      -
      • +
    • Babel +
      Compiles ES6 to ES5. Enjoy the new version of JavaScript today
      +
      • -
    • ES Lint -
      Lint JS. Reports syntax and style issues
      -
      • +
    • ES Lint +
      Lint JS. Reports syntax and style issues
      +
      • -
    • Npm scripts -
      Run project with just one command
      -
      • -
    -
    - ); -}; +
  • Npm scripts +
    Run project with just one command
    +
    • +
+
+); -export default HomeTechnologies; \ No newline at end of file +export default HomeTechnologies; diff --git a/src/modules/home/home.styl b/src/modules/home/home.styl index 9503549..17f6a3b 100644 --- a/src/modules/home/home.styl +++ b/src/modules/home/home.styl @@ -65,4 +65,4 @@ padding-left 20px padding-bottom 6px color #656565 - font-size 15px \ No newline at end of file + font-size 15px diff --git a/src/modules/posts/ManagePost.js b/src/modules/posts/ManagePost.js index b6dec10..cfeae97 100644 --- a/src/modules/posts/ManagePost.js +++ b/src/modules/posts/ManagePost.js @@ -1,11 +1,12 @@ -import React, {PropTypes} from 'react'; -import {connect} from 'react-redux'; -import {bindActionCreators} from 'redux'; +import React, { PropTypes } from 'react'; +import DocumentTitle from 'react-document-title'; +import toastr from 'toastr'; +import { bindActionCreators } from 'redux'; +import { browserHistory } from 'react-router'; +import { connect } from 'react-redux'; + import * as postsActions from './posts.actions'; import ManagePostForm from './components/ManagePostForm'; -import toastr from 'toastr'; -import {browserHistory} from 'react-router'; -import DocumentTitle from 'react-document-title'; class ManagePost extends React.Component { constructor(props, context) { @@ -27,21 +28,21 @@ class ManagePost extends React.Component { } componentWillReceiveProps(nextProps) { - if (this.props.post.id != nextProps.post.id) { - this.setState({post: Object.assign({}, nextProps.post)}); + if (this.props.post.id !== nextProps.post.id) { + this.setState({ post: Object.assign({}, nextProps.post) }); } } handleInputState(event) { const field = event.target.name; - let post = this.state.post; + let post = this.state.post; // eslint-disable-line post[field] = event.target.value; - return this.setState({post: post}); + return this.setState({ post }); } postFormIsValid() { let formIsValid = true; - let errors = {}; + const errors = {}; if (this.state.post.title.length < 3) { errors.title = 'Title must be at least 3 characters.'; @@ -53,7 +54,7 @@ class ManagePost extends React.Component { formIsValid = false; } - this.setState({errors: errors}); + this.setState({ errors }); return formIsValid; } @@ -63,27 +64,27 @@ class ManagePost extends React.Component { return; } - this.setState({saving: true}); + this.setState({ saving: true }); if (this.state.post.id) { this.props.actions.updatePost(this.state.post) .then(() => this.redirectToPostsPage()) .catch(error => { toastr.error(error); - this.setState({saving: false}); + this.setState({ saving: false }); }); } else { this.props.actions.createPost(this.state.post) .then(() => this.redirectToPostsPage()) .catch(error => { toastr.error(error); - this.setState({saving: false}); + this.setState({ saving: false }); }); } } redirectToPostsPage() { - this.setState({saving: false}); + this.setState({ saving: false }); toastr.success('Post Saved'); browserHistory.push('/posts'); } @@ -91,13 +92,14 @@ class ManagePost extends React.Component { render() { return (
- + + saving={this.state.saving} + />
); } @@ -114,22 +116,20 @@ ManagePost.contextTypes = { }; function getPostById(posts, id) { - const post = posts.filter(post => post.id == id); + const post = posts.filter(post => post.id == id); // eslint-disable-line if (post) return post[0]; return null; } function mapStateToProps(state, ownProps) { const postId = ownProps.params.id; - let post = {id: '', title: '', body: ''}; + let post = { id: '', title: '', body: '' }; if (postId && state.posts.length > 0) { post = getPostById(state.posts, postId); } - return { - post: post - }; + return { post }; } function mapDispatchToProps(dispatch) { @@ -138,4 +138,4 @@ function mapDispatchToProps(dispatch) { }; } -export default connect(mapStateToProps, mapDispatchToProps)(ManagePost); \ No newline at end of file +export default connect(mapStateToProps, mapDispatchToProps)(ManagePost); diff --git a/src/modules/posts/Posts.js b/src/modules/posts/Posts.js index dd790c2..d10831f 100644 --- a/src/modules/posts/Posts.js +++ b/src/modules/posts/Posts.js @@ -1,13 +1,12 @@ -/*eslint-disable no-console*/ +/* eslint-disable no-console */ +import React, { PropTypes } from 'react'; +import DocumentTitle from 'react-document-title'; +import toastr from 'toastr'; +import { bindActionCreators } from 'redux'; +import { connect } from 'react-redux'; -import React, {PropTypes} from 'react'; -import {connect} from 'react-redux'; -import {bindActionCreators} from 'redux'; import * as postsActions from './posts.actions'; import PostsList from './components/PostsList'; -import {browserHistory} from 'react-router'; -import toastr from 'toastr'; -import DocumentTitle from 'react-document-title'; class Posts extends React.Component { constructor(props, context) { @@ -26,13 +25,14 @@ class Posts extends React.Component { } render() { - const {posts} = this.props; + const { posts } = this.props; return (
- + + onDelete={this.handleDelete} + />
); } @@ -55,4 +55,4 @@ function mapDispatchToProps(dispatch) { }; } -export default connect(mapStateToProps, mapDispatchToProps)(Posts); \ No newline at end of file +export default connect(mapStateToProps, mapDispatchToProps)(Posts); diff --git a/src/modules/posts/components/ManagePostForm.js b/src/modules/posts/components/ManagePostForm.js index 461e792..b4b672e 100644 --- a/src/modules/posts/components/ManagePostForm.js +++ b/src/modules/posts/components/ManagePostForm.js @@ -1,47 +1,48 @@ import React from 'react'; import TextInput from '../../_global/forms/TextInput'; -const ManagePostForm = ({post, onSave, onChange, saving, errors}) => { - return ( -
-

Form

-
-
-
- -
+const ManagePostForm = ({ post, onSave, onChange, saving, errors }) => ( +
+

Form

+ +
+
+
+
-
-
- -
+
+
+
+
-
-
- -
+
+
+
- -
- ); -}; +
+ +
+); ManagePostForm.propTypes = { post: React.PropTypes.object.isRequired, diff --git a/src/modules/posts/components/PostsList.js b/src/modules/posts/components/PostsList.js index dd8666e..dc48d8d 100644 --- a/src/modules/posts/components/PostsList.js +++ b/src/modules/posts/components/PostsList.js @@ -1,47 +1,45 @@ -import React, {PropTypes} from 'react'; -import {Link} from 'react-router'; +import React, { PropTypes } from 'react'; +import { Link } from 'react-router'; -const PostsList = ({posts, onDelete}) => { - return ( -
-
- Create new -
-

Posts - {!posts.length && Empty} -

-
- - - - - - - +const PostsList = ({ posts, onDelete }) => ( +
+
+ Create new +
+

Posts + {!posts.length && Empty} +

+
+
ID Title Body Actions
+ + + + + + + + + + {posts.map(post => + + + + + - - - {posts.map(post => - - - - - - - )} - -
ID Title Body Actions
{post.id}{post.title}{post.body} + Edit + +
{post.id}{post.title}{post.body} - Edit - -
-
+ )} + +
- ); -}; +
+); PostsList.propTypes = { posts: PropTypes.array.isRequired, onDelete: PropTypes.func }; -export default PostsList; \ No newline at end of file +export default PostsList; diff --git a/src/modules/posts/posts.actions.js b/src/modules/posts/posts.actions.js index e725437..ee1b8dc 100644 --- a/src/modules/posts/posts.actions.js +++ b/src/modules/posts/posts.actions.js @@ -1,30 +1,30 @@ +import axios from 'axios'; import * as types from '../../constants/actionTypes'; import * as api from '../../constants/api'; -import axios from 'axios'; export function loadPostsSuccess(res) { - return {type: types.LOAD_POSTS_SUCCESS, posts: res.data}; + return { type: types.LOAD_POSTS_SUCCESS, posts: res.data }; } export function createPostSuccess(post) { - return {type: types.CREATE_POST_SUCCESS, post}; + return { type: types.CREATE_POST_SUCCESS, post }; } export function updatePostSuccess(post) { - return {type: types.UPDATE_POST_SUCCESS, post}; + return { type: types.UPDATE_POST_SUCCESS, post }; } export function deletePostSuccess(postId) { - return {type: types.DELETE_POST_SUCCESS, postId}; + return { type: types.DELETE_POST_SUCCESS, postId }; } export function loadPosts() { - return function(dispatch) { + return function (dispatch) { return axios.get(`${api.URL}/posts`) .then(res => { dispatch(loadPostsSuccess(res)); }).catch(error => { - throw(error); + throw (error); }); }; } @@ -35,7 +35,7 @@ export function createPost(post) { .then(res => { dispatch(createPostSuccess(post)); }).catch(error => { - throw(error); + throw (error); }); }; } @@ -46,7 +46,7 @@ export function updatePost(post) { .then(res => { dispatch(updatePostSuccess(post)); }).catch(error => { - throw(error); + throw (error); }); }; } @@ -57,7 +57,7 @@ export function deletePost(postId) { .then(res => { dispatch(deletePostSuccess(postId)); }).catch(error => { - throw(error); + throw (error); }); }; -} \ No newline at end of file +} diff --git a/src/modules/posts/posts.reducer.js b/src/modules/posts/posts.reducer.js index 71a9755..76d400c 100644 --- a/src/modules/posts/posts.reducer.js +++ b/src/modules/posts/posts.reducer.js @@ -2,10 +2,9 @@ import * as types from '../../constants/actionTypes'; import initialState from '../../reducers/initialState'; export default function (state = initialState.posts, action) { - let index; - switch(action.type) { + switch (action.type) { case types.LOAD_POSTS_SUCCESS: return action.posts; @@ -23,7 +22,7 @@ export default function (state = initialState.posts, action) { ]; case types.DELETE_POST_SUCCESS: - index = state.findIndex(post => post.id == action.postId); + index = state.findIndex(post => post.id === action.postId); return [ ...state.slice(0, index), ...state.slice(index + 1) @@ -32,4 +31,4 @@ export default function (state = initialState.posts, action) { default: return state; } -} \ No newline at end of file +} diff --git a/src/modules/posts/posts.styl b/src/modules/posts/posts.styl index 2f9487c..84e2a62 100644 --- a/src/modules/posts/posts.styl +++ b/src/modules/posts/posts.styl @@ -1,3 +1,3 @@ .create-new-btn button margin-top -10px - margin-bottom 10px \ No newline at end of file + margin-bottom 10px diff --git a/src/reducers/initialState.js b/src/reducers/initialState.js index 591540c..35a0a7f 100644 --- a/src/reducers/initialState.js +++ b/src/reducers/initialState.js @@ -1,3 +1,3 @@ export default { posts: [] -}; \ No newline at end of file +}; diff --git a/src/reducers/rootReducer.js b/src/reducers/rootReducer.js index 1c12279..904050d 100644 --- a/src/reducers/rootReducer.js +++ b/src/reducers/rootReducer.js @@ -1,8 +1,8 @@ -import {combineReducers} from 'redux'; +import { combineReducers } from 'redux'; import posts from '../modules/posts/posts.reducer'; const rootReducer = combineReducers({ posts }); -export default rootReducer; \ No newline at end of file +export default rootReducer; diff --git a/src/routes.js b/src/routes.js index 8809ad0..26f087a 100644 --- a/src/routes.js +++ b/src/routes.js @@ -1,5 +1,5 @@ import React from 'react'; -import {Route, IndexRoute, Redirect} from 'react-router'; +import { Route, IndexRoute, Redirect } from 'react-router'; import Layout from './modules/Layout'; import Home from './modules/home/Home'; import Posts from './modules/posts/Posts'; @@ -16,4 +16,3 @@ export default ( ); - diff --git a/src/store/configureStore.js b/src/store/configureStore.js index ea89e6c..c3c394d 100644 --- a/src/store/configureStore.js +++ b/src/store/configureStore.js @@ -1,7 +1,7 @@ /* eslint-disable global-require */ import { createStore, applyMiddleware } from 'redux'; -import rootReducer from '../reducers/rootReducer'; import thunk from 'redux-thunk'; +import rootReducer from '../reducers/rootReducer'; let middleware = [thunk]; diff --git a/utils/build.js b/utils/build.js index b88b440..1d0c8b6 100644 --- a/utils/build.js +++ b/utils/build.js @@ -1,8 +1,7 @@ -/*eslint-disable no-console */ - +/* eslint-disable no-console */ import webpack from 'webpack'; -import webpackConfig from '../webpack.config.prod'; import colors from 'colors'; +import webpackConfig from '../webpack.config.prod'; process.env.NODE_ENV = 'production'; diff --git a/utils/buildHtml.js b/utils/buildHtml.js index 390e176..00fed1f 100644 --- a/utils/buildHtml.js +++ b/utils/buildHtml.js @@ -1,5 +1,4 @@ -/*eslint-disable no-console */ - +/* eslint-disable no-console */ import fs from 'fs'; import cheerio from 'cheerio'; import colors from 'colors'; @@ -20,7 +19,7 @@ fs.readFile('src/index.html', 'utf8', (err, markup) => { $('body').append(``); - fs.writeFile('dist2/index.html', $.html(), 'utf8', function (err) { + fs.writeFile('dist2/index.html', $.html(), 'utf8', err => { if (err) return console.log(err); console.log('index.html written to /dist'.green); }); diff --git a/utils/checkDist.js b/utils/checkDist.js index b8d2f69..ac302ae 100644 --- a/utils/checkDist.js +++ b/utils/checkDist.js @@ -8,4 +8,4 @@ if (fs.existsSync(dir)) { childProcess.exec(`rimraf ${dir}`, (error, stdout) => { if (error !== null) console.log(`exec error: ${error}`); }); -} \ No newline at end of file +} diff --git a/utils/checkDotEnv.js b/utils/checkDotEnv.js index 31b4c6f..04e8f96 100644 --- a/utils/checkDotEnv.js +++ b/utils/checkDotEnv.js @@ -1,12 +1,11 @@ -/*eslint-disable no-console*/ - +/* eslint-disable no-console*/ import fs from 'fs'; import colors from 'colors'; -fs.stat('.env', function(err, stat) { - if(err == null) { +fs.stat('.env', (err, stat) => { + if (err == null) { // .env is set - } else if (err.code == 'ENOENT') { + } else if (err.code === 'ENOENT') { fs.createReadStream('.env.sample').pipe(fs.createWriteStream('.env')); console.log('Generated .env file in root directory.'.yellow); } else { diff --git a/utils/distServer.js b/utils/distServer.js index ee46a23..db0571d 100644 --- a/utils/distServer.js +++ b/utils/distServer.js @@ -1,9 +1,8 @@ -/*eslint-disable no-console */ -/*eslint-disable no-var */ +/* eslint-disable no-console */ +/* eslint-disable no-var */ var express = require('express'); var path = require('path'); -var open = require('open'); var compression = require('compression'); var colors = require('colors'); var dotenv = require('dotenv').config(); @@ -14,11 +13,11 @@ var app = express(); app.use(compression()); app.use(express.static('dist')); -app.get('*', function(req, res) { +app.get('*', (req, res) => { res.sendFile(path.join(__dirname, '../dist/index.html')); }); -app.listen(port, function(err) { +app.listen(port, err => { if (err) { console.log(err); } else { diff --git a/utils/postMessage.js b/utils/postMessage.js index 8bfdcb1..28e3259 100644 --- a/utils/postMessage.js +++ b/utils/postMessage.js @@ -1,5 +1,5 @@ -/*eslint-disable no-console*/ +/* eslint-disable no-console*/ import colors from 'colors'; console.log('Your app has been compiled in production mode and written to /dist.'.green); -console.log('Type "npm run prod" to start production server.'.yellow); \ No newline at end of file +console.log('Type "npm run prod" to start production server.'.yellow); diff --git a/utils/srcServer.js b/utils/srcServer.js index 4acdb6c..9503a60 100644 --- a/utils/srcServer.js +++ b/utils/srcServer.js @@ -1,12 +1,13 @@ -/*eslint-disable no-console*/ +/* eslint-disable no-console*/ import express from 'express'; import webpack from 'webpack'; import path from 'path'; -import config from '../webpack.config.dev'; import open from 'open'; import colors from 'colors'; import dotenv from 'dotenv'; +import config from '../webpack.config.dev'; + dotenv.config(); const port = process.env.PORT; @@ -20,18 +21,16 @@ app.use(require('webpack-dev-middleware')(compiler, { app.use(require('webpack-hot-middleware')(compiler)); -app.get('*', function(req, res) { - res.sendFile(path.join( __dirname, '../src/index.html')); +app.get('*', (req, res) => { + res.sendFile(path.join(__dirname, '../src/index.html')); }); -app.listen(port, function(err) { +app.listen(port, err => { if (err) { console.log(err); + } else if (process.env.OPEN_BROWSER_ON_START === "TRUE") { + open(`http://localhost:${port}`); } else { - if (process.env.OPEN_BROWSER_ON_START === "TRUE") { - open(`http:/localhost:${port}`); - } else { - console.log('You can now reload your browser'.yellow); - } + console.log('You can now reload your browser'.yellow); } -}); \ No newline at end of file +}); diff --git a/utils/startMessage.js b/utils/startMessage.js index 2948fe9..72194e5 100644 --- a/utils/startMessage.js +++ b/utils/startMessage.js @@ -1,4 +1,4 @@ -/*eslint-disable no-console*/ +/* eslint-disable no-console*/ import colors from 'colors'; -console.log('Starting app in dev mode...'.green); \ No newline at end of file +console.log('Starting app in dev mode...'.green); diff --git a/webpack.config.dev.js b/webpack.config.dev.js index aa9046f..8206619 100644 --- a/webpack.config.dev.js +++ b/webpack.config.dev.js @@ -40,11 +40,11 @@ export default { }, module: { loaders: [ - {test: /\.js$/, exclude: /(node_modules|bower_components)/, loader: 'babel'}, - {test: /(\.css)$/, loader: 'style!css'}, - {test: /\.styl$/, loader: 'style-loader!css-loader!stylus-loader'}, - {test: /\.(png|jpe?g|ico)$/, loader: 'url-loader?limit=100000&name=[name]-[hash:6].[ext]'}, - {test: /\.(woff|woff2|svg|ttf|eot|otf)(\?[\s\S]+)?$/, loader: 'file-loader?limit=100000&name=[name].[ext]'} + { test: /\.js$/, exclude: /(node_modules|bower_components)/, loader: 'babel' }, + { test: /(\.css)$/, loader: 'style!css' }, + { test: /\.styl$/, loader: 'style-loader!css-loader!stylus-loader' }, + { test: /\.(png|jpe?g|ico)$/, loader: 'url-loader?limit=100000&name=[name]-[hash:6].[ext]' }, + { test: /\.(woff|woff2|svg|ttf|eot|otf)(\?[\s\S]+)?$/, loader: 'file-loader?limit=100000&name=[name].[ext]' } ] }, stylus: { @@ -54,4 +54,4 @@ export default { ]) ] } -}; \ No newline at end of file +}; diff --git a/webpack.config.prod.js b/webpack.config.prod.js index 7c7a401..15d6d36 100644 --- a/webpack.config.prod.js +++ b/webpack.config.prod.js @@ -18,7 +18,7 @@ export default { entry: './src/index', target: 'web', output: { - path: __dirname + '/dist2', + path: path.join(__dirname, '/dist2'), publicPath: '/', filename: 'assets/js/bundle.js' }, @@ -50,11 +50,11 @@ export default { }, module: { loaders: [ - {test: /\.js$/, exclude: /(node_modules|bower_components)/, loader: 'babel'}, - {test: /(\.css)$/, loader: ExtractTextPlugin.extract('css?sourceMap')}, - {test: /\.styl$/, loader: ExtractTextPlugin.extract('css-loader!stylus-loader')}, - {test: /\.(png|jpe?g|ico)$/, loader: 'url-loader?limit=100000&name=assets/img/[name]-[hash:6].[ext]'}, - {test: /\.(otf|woff|woff2|svg|ttf|eot)(\?[\s\S]+)?$/, loader: 'file-loader?name=assets/fonts/[name].[ext]'} + { test: /\.js$/, exclude: /(node_modules|bower_components)/, loader: 'babel' }, + { test: /(\.css)$/, loader: ExtractTextPlugin.extract('css?sourceMap') }, + { test: /\.styl$/, loader: ExtractTextPlugin.extract('css-loader!stylus-loader') }, + { test: /\.(png|jpe?g|ico)$/, loader: 'url-loader?limit=100000&name=assets/img/[name]-[hash:6].[ext]' }, + { test: /\.(otf|woff|woff2|svg|ttf|eot)(\?[\s\S]+)?$/, loader: 'file-loader?name=assets/fonts/[name].[ext]' } ] }, stylus: {