Что-то вроде hello world для фронта

This commit is contained in:
SleepWalker 2016-01-02 22:24:07 +02:00
commit eafa64d5a3
14 changed files with 610 additions and 0 deletions

202
.eslintrc.json Normal file
View File

@ -0,0 +1,202 @@
{
"parser": "babel-eslint",
"plugins": [
"react"
],
"ecmaFeatures": {
"jsx": true,
"modules": true,
"classes": true,
"defaultParams": true,
"destructuring": true,
"spread": true,
"arrowFunctions": true,
"blockBindings": true,
"objectLiteralComputedProperties": true,
"objectLiteralDuplicateProperties": true,
"objectLiteralShorthandMethods": true,
"objectLiteralShorthandProperties": true,
"restParams": true,
"superInFunctions": true,
"templateStrings": true,
"experimentalObjectRestSpread": true
},
"env": {
"browser": true,
"es6": true
},
"extends": "eslint:recommended",
// @see: http://eslint.org/docs/rules/
"rules": {
// possible errors (including eslint:recommended)
"valid-jsdoc": [1, {"requireParamDescription": false, "requireReturnDescription": false}],
// best practice
"block-scoped-var": 2,
"curly": 2,
"default-case": 2,
"dot-location": [2, "property"],
"dot-notation": 2,
"eqeqeq": [2, "smart"],
"no-alert": 2,
"no-caller": 2,
"no-case-declarations": 2,
"no-div-regex": 2,
"no-else-return": 2,
"no-empty-pattern": 2,
"no-eq-null": 2,
"no-eval": 2,
"no-extend-native": 2,
"no-extra-bind": 1,
"no-fallthrough": 2,
"no-floating-decimal": 1,
"no-implied-eval": 2,
"no-invalid-this": 0,
"no-labels": 2,
"no-lone-blocks": 1,
"no-loop-func": 2,
"no-magic-numbers": 1,
"no-multi-spaces": 2,
"no-multi-str": 2,
"no-native-reassign": 2,
"no-new-wrappers": 1,
"no-new": 1,
"no-octal-escape": 1,
"no-octal": 2,
"no-proto": 2,
"no-redeclare": 1,
"no-script-url": 2,
"no-self-compare": 2,
"no-sequences": 2,
"no-throw-literal": 2,
"no-unused-expressions": [1, {"allowShortCircuit": true, "allowTernary": true}],
"no-useless-call": 1,
"no-useless-concat": 1,
"no-void": 2,
"no-with": 2,
"radix": 2,
"wrap-iife": 2,
"yoda": 1,
// strict mode
"strict": [1, "never"], // babel все сделает за нас
// variables
"no-catch-shadow": 2,
"no-delete-var": 2,
"no-label-var": 2,
"no-shadow-restricted-names": 2,
"no-shadow": 0,
"no-undef-init": 1,
"no-undef": 2,
"no-undefined": 2,
"no-use-before-define": [1, "nofunc"],
// CommonJS
"no-mixed-requires": 1,
"no-path-concat": 1,
// stylistic
"array-bracket-spacing": 2,
"block-spacing": [2, "never"],
"brace-style": [2, "1tbs", {"allowSingleLine": true}],
"comma-spacing": 2,
"comma-style": 2,
"computed-property-spacing": 2,
"consistent-this": [2, "that"],
"camelcase": 1,
"eol-last": 1,
"id-length": [2, {"min": 2, "exceptions": ["x", "y", "i", "$"]}],
"indent": [2, 4, {"SwitchCase": 1}],
"jsx-quotes": 2,
"key-spacing": [2, {"mode": "minimum"}],
"linebreak-style": 2,
"max-depth": 2,
"new-cap": 2,
"new-parens": 2,
"no-array-constructor": 1,
"no-bitwise": 1,
"no-lonely-if": 2,
"no-negated-condition": 1,
"no-nested-ternary": 2,
"no-new-object": 2,
"no-spaced-func": 2,
"no-trailing-spaces": 1,
"no-unneeded-ternary": 1,
"one-var": [2, "never"],
"operator-assignment": [1, "always"],
"operator-linebreak": [2, "before"],
"padded-blocks": [1, "never"],
"quote-props": [1, "as-needed"],
"quotes": [1, "single"],
"semi": 2,
"semi-spacing": 2,
"space-after-keywords": 2,
"space-before-keywords": 2,
"space-before-blocks": 2,
"space-before-function-paren": [2, "never"],
"space-in-parens": 1,
"space-infix-ops": 2,
"space-return-throw-case": 2,
"space-unary-ops": 2,
"spaced-comment": 1,
// es6
"arrow-body-style": 1,
"arrow-parens": 2,
"arrow-spacing": 2,
"constructor-super": 2,
"generator-star-spacing": 1,
"no-arrow-condition": 1,
"no-class-assign": 2,
"no-const-assign": 2,
"no-dupe-class-members": 2,
"no-this-before-super": 2,
"no-var": 1,
"object-shorthand": 1,
"prefer-arrow-callback": 1,
"prefer-const": 1,
"prefer-reflect": 1,
"prefer-spread": 1,
"prefer-template": 1,
"require-yield": 2,
// react
"react/display-name": 1,
"react/forbid-prop-types": 1,
"react/jsx-boolean-value": 1,
"react/jsx-closing-bracket-location": 1,
"react/jsx-curly-spacing": 1,
"react/jsx-handler-names": [1, {"eventHandlerPrefix": "on", "eventHandlerPropPrefix": "on"}],
"react/jsx-indent-props": 1,
"react/jsx-key": 1,
"react/jsx-max-props-per-line": [1, {"maximum": 3}],
"react/jsx-no-bind": 1,
"react/jsx-no-duplicate-props": 1,
"react/jsx-no-literals": 1,
"react/jsx-no-undef": 1,
"react/jsx-pascal-case": 1,
"react/jsx-uses-react": 1,
"react/jsx-uses-vars": 1,
"react/no-danger": 1,
"react/no-deprecated": 1,
"react/no-did-mount-set-state": 1,
"react/no-did-update-set-state": 1,
"react/no-direct-mutation-state": 1,
"react/no-is-mounted": 1,
"react/no-multi-comp": 1,
"react/no-string-refs": 1,
"react/no-unknown-property": 1,
"react/prefer-es6-class": 1,
"react/prop-types": 1,
"react/react-in-jsx-scope": 1,
"react/require-extension": 1,
"react/self-closing-comp": 1,
"react/sort-comp": [1, {"order": ["lifecycle", "render", "everything-else"]}],
"react/wrap-multilines": 1
}
}

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
node_modules

2
README.md Normal file
View File

@ -0,0 +1,2 @@
Ely account frontend application
================================

3
dist/app.js vendored Normal file

File diff suppressed because one or more lines are too long

1
dist/index.html vendored Normal file
View File

@ -0,0 +1 @@
<!DOCTYPE html><html><head><meta charset="utf-8"><title>Ely.by - Account</title><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="msapplication-tap-highlight" content="no"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"></head><body><div id="app"></div><script src="vendor.js?bd50ff2c2360c9cf7d99"></script><script src="app.js?bd50ff2c2360c9cf7d99"></script></body></html>

7
dist/messages/src/routes.json vendored Normal file
View File

@ -0,0 +1,7 @@
[
{
"id": "greeting",
"description": "Welcome greeting to the user",
"defaultMessage": "Hello, {name}! How are you today?"
}
]

23
dist/vendor.js vendored Normal file

File diff suppressed because one or more lines are too long

74
karma.conf.js Normal file
View File

@ -0,0 +1,74 @@
// Karma configuration
// Generated on Sat Jun 13 2015 12:22:02 GMT+0300 (EEST)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
//
// NOTE: es5-shim был добавлен, так как phantomJS не может es5...
frameworks: ['mocha', 'sinon', 'chai', 'es5-shim'],
// list of files / patterns to load in the browser
files: [
'tests/index.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'tests/index.js': ['webpack', 'sourcemap']
},
webpack: require('./webpack.config.js'),
webpackServer: {
noInfo: true //please don't spam the console when running in karma!
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['nyan'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['PhantomJS'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};

70
package.json Normal file
View File

@ -0,0 +1,70 @@
{
"name": "ely-by-account",
"version": "1.0.0",
"description": "",
"main": "index.js",
"author": "ErickSkrauch <erickskrauch@ely.by>",
"public": false,
"scripts": {
"start": "webpack-dev-server --progress --colors",
"up": "npm install",
"test": "karma start ./karma.conf.js",
"lint": "eslint ./src",
"build": "webpack --progress --colors -p"
},
"dependencies": {
"babel-polyfill": "^6.3.14",
"classnames": "^2.1.3",
"history": "^1.17.0",
"intl-format-cache": "^2.0.4",
"intl-messageformat": "^1.1.0",
"react": "^0.14.0",
"react-dom": "^0.14.3",
"react-intl": "^2.0.0-beta-2",
"react-redux": "^4.0.0",
"react-router": "^2.0.0-rc4",
"redux": "^3.0.4",
"redux-simple-router": "^1.0.2",
"redux-thunk": "^1.0.0"
},
"devDependencies": {
"autoprefixer-loader": "^2.0.0",
"babel-core": "^6.0.0",
"babel-eslint": "^5.0.0-beta6",
"babel-loader": "^6.0.0",
"babel-plugin-react-intl": "^2.0.0",
"babel-plugin-transform-runtime": "^6.3.13",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babel-runtime": "^5.6.15",
"chai": "^3.0.0",
"chokidar": "^1.2.0",
"css-loader": "^0.9.1",
"eslint": "^1.10.3",
"eslint-plugin-react": "^3.13.1",
"extract-text-webpack-plugin": "^0.9.1",
"html-webpack-plugin": "^1.7.0",
"imports-loader": "^0.6.4",
"karma": "^0.13.0",
"karma-chai": "^0.1.0",
"karma-es5-shim": "^0.0.4",
"karma-mocha": "^0.1.10",
"karma-nyan-reporter": "^0.0.60",
"karma-phantomjs-launcher": "^0.2.1",
"karma-sinon": "^1.0.4",
"karma-sourcemap-loader": "^0.3.6",
"karma-webpack": "^1.5.1",
"less": "^2.4.0",
"less-loader": "^2.0.0",
"mocha": "^2.2.5",
"node-sass": "^3.4.2",
"phantomjs": "^1.9.18",
"react-addons-test-utils": "^0.14.3",
"sass-loader": "^3.1.2",
"sinon": "^1.15.3",
"style-loader": "^0.8.3",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
}
}

15
src/index.html Normal file
View File

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ely.by - Account</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
</head>
<body>
<div id="app"></div>
</body>
</html>

34
src/index.js Normal file
View File

@ -0,0 +1,34 @@
import 'babel-polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import { createStore, combineReducers } from 'redux';
import { Provider as ReduxProvider } from 'react-redux';
import { Router, browserHistory } from 'react-router';
import { syncReduxAndRouter, routeReducer } from 'redux-simple-router';
import { IntlProvider } from 'react-intl';
import reducers from 'reducers';
import routes from 'routes';
const reducer = combineReducers({
...reducers,
routing: routeReducer
});
const store = createStore(reducer);
syncReduxAndRouter(browserHistory, store);
ReactDOM.render(
<IntlProvider locale="en" messages={{}}>
<ReduxProvider store={store}>
<Router history={browserHistory}>
{routes}
</Router>
</ReduxProvider>
</IntlProvider>,
document.getElementById('app')
);

2
src/reducers.js Normal file
View File

@ -0,0 +1,2 @@
export default {
};

45
src/routes.js Normal file
View File

@ -0,0 +1,45 @@
import React from 'react';
import { Route, IndexRoute } from 'react-router';
import { Link } from 'react-router';
import { FormattedMessage } from 'react-intl';
function CoreLayout(props) {
return (
<div>
<FormattedMessage
id="greeting"
description="Welcome greeting to the user"
defaultMessage="Hello, {name}! How are you today?"
values={{name: 'World'}}
/>
{props.children}
</div>
);
}
function HomeView() {
return (
<div>
Home!
<Link to="/auth">Auth</Link>
</div>
);
}
function AuthView() {
return (
<div>
Auth!
<Link to="/">Home</Link>
</div>
);
}
export default (
<Route path="/" component={CoreLayout}>
<IndexRoute component={HomeView} />
<Route path="/auth" component={AuthView} />
</Route>
);

131
webpack.config.js Normal file
View File

@ -0,0 +1,131 @@
/* eslint-env node */
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
const API_HOST = 'http://account.l';
// TODO: https://babeljs.io/docs/plugins/
// TODO: отдельные конфиги для env (аля https://github.com/davezuko/react-redux-starter-kit)
var isProduction = process.argv.some(function(arg) {
return arg === '-p';
});
var isTest = process.argv.some(function(arg) {
return arg.indexOf('karma') !== -1;
});
var webpackConfig = {
entry: {
app: path.join(__dirname, 'src'),
vendor: [
'history',
'react',
'react-redux',
'react-router',
'redux-simple-router',
'redux',
// I18n
'intl-format-cache',
'intl-messageformat'
]
},
output: {
path: path.join(__dirname, 'dist'),
filename: '[name].js'
},
resolve: {
root: path.resolve('./src'),
extensions: ['', '.js', '.jsx']
},
devServer: {
host: 'localhost',
port: 8080,
proxy: {
'/api*': {
target: API_HOST
}
},
hot: true,
inline: true,
historyApiFallback: true
},
devtool: isTest ? 'inline-source-map' : 'eval',
plugins: [
new webpack.DefinePlugin({
__DEV__: !isProduction,
__TEST__: isTest,
__PROD__: isProduction
}),
new HtmlWebpackPlugin({
template: 'src/index.html',
hash: isProduction,
filename: 'index.html',
inject: 'body',
minify: {
collapseWhitespace: isProduction
}
})
].concat(isTest ? [] : [
new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')
]).concat(isProduction ? [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin()
] : []),
module: {
loaders: [
{
test: /\.scss$/,
extractInProduction: true,
loader: 'style!css!autoprefixer?browsers=last 3 versions!sass'
},
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['react', 'es2015', 'stage-0'],
plugins: ['transform-runtime', ['react-intl', {messagesDir: './dist/messages/'}]]
}
},
{ // DEPRECATED
test: /i18n\/.*\.less$/,
loader: 'style!css!autoprefixer?browsers=last 3 versions!less'
},
{ // DEPRECATED
test: /\.less$/,
extractInProduction: true,
exclude: /i18n\/.*\.less$/,
loader: 'style!css!autoprefixer?browsers=last 3 versions!less'
}
]
}
};
if (isProduction) {
webpackConfig.module.loaders.forEach(function(loader) {
if (loader.extractInProduction) {
var parts = loader.loader.split('!');
loader.loader = ExtractTextPlugin.extract(parts[0], parts.slice(1).join('!'));
}
});
webpackConfig.plugins.push(new ExtractTextPlugin('dist/styles.css', {
allChunks: true
}));
webpackConfig.devtool = false;
}
module.exports = webpackConfig;