File and folder naming convention for React.js components
/actions/...
/components/common/Link.js
/components/common/...
/components/forms/TextBox.js
/components/forms/TextBox.res/style.css
| // ==UserScript== | |
| // @name SO Chat room gif autobinner | |
| // @author Robert Lemon | |
| // @version 0.0.32 | |
| // @namespace | |
| // @description make rooms not suffer gifs | |
| // @include http://chat.stackoverflow.com/rooms/* | |
| // ==/UserScript== | |
| (function(global) { | |
| "use strict"; |
| var Reflux = require('reflux'); | |
| module.exports = Reflux.createAction([ | |
| // other things | |
| onCreateSuccess, | |
| onCreateError | |
| ]); |
The basic structure of a React+Flux application (see other examples)
- /src/actions/AppActions.js - Action creators (Flux)
- /src/components/Application.js - The top-level React component
- /src/constants/ActionTypes.js - Action types (Flux)
- /src/core/Dispatcher.js - Dispatcher (Flux)
- /src/stores/AppStore.js - The main store (Flux)
| 'use strict'; | |
| var createAsyncActions = require('./createAsyncActions') | |
| var CategoryAPI = require('../api/CategoryAPI') | |
| var CategoryActions = createAsyncActions({ | |
| create: function(category) { | |
| CategoryAPI | |
| .create(category) |
All lower case JSX tags will now be treated as HTML/SVG elements. They will no longer be treated as custom components in scope.
The React element produced by JSX can be either a React class that exists in the local scope or a global scope HTML/SVG element depending on a convention.
Previous Behavior
Currently, when you use React JSX to define a HTML element you can use any known HTML tag. E.g:
| function EXT_COLOR () { echo -ne "\e[38;5;$1m"; } | |
| function CLOSE_COLOR () { echo -ne '\e[m'; } | |
| export CLICOLOR=1 | |
| export PS1="\[`EXT_COLOR 187`\]\u@\h\[`CLOSE_COLOR`\]\[`EXT_COLOR 174`\] \w \$ \[`CLOSE_COLOR`\] > " | |
| export LS_COLORS='di=38;5;108:fi=00:*svn-commit.tmp=31:ln=38;5;116:ex=38;5;186:*java=38;5;94:*groovy=38;5;95' | |
| function cds() { | |
| C=0; |
| var ko = require('knockout'); | |
| ko.components.register('simple-name', require('./components/simple-name/simple-name.js')); | |
| ko.applyBindings({ userName: ko.observable() }); |
| // assuming you're using express | |
| 'use strict'; | |
| //express stuffs | |
| var passport = require('passport'); | |
| var user = require('./user'); | |
| // Configs the passports | |
| require('./passportConfig'); |