Alex Shilman Alex-Shilman

Integrating React with Marionette

See ReactComponentView and BackboneModelWatchMixin, below.

Notes

The BackboneModelWatchView could use some additional methods to allow adding/removing watched models after the component is created.

Docker Commands, Help & Tips

Show commands & management commands

$ docker

Docker version info

Theming Ant Design with Sass and Webpack

This is a solution on how to theme/customize Ant Design (which is written in Less) with Sass and webpack. Ant itself offers two solutions and a related article on theming, but these are only applicable if you use Less, the antd-init boilerplate or dva-cli.

What this solution offers:

use a single sass-file to customize (no duplicate variables for your project and Ant)
hot reload compatibility
no dependencies on outdated npm modules
easy integration with your existing webpack setup (webpack 3+ tested)

Introduction

The computer driven markets for instruments like stocks and exchange traded stock options, have transformed finance and the flow of capital. These markets are enabled by order matching engines (and the infrastructure that supports this software). Before computer trading networks and matching engines, stocks where traded on cavernous exchange floors and transaction costs where high. When electronic trading fully matured, floor traders were a fading anachronism and transaction costs had been reduced to pennies a share in many cases. Electronic trading could not exist without advanced network infrastructure, but without the software matching engines no shares would change hands. The computer trading networks, the matching engine software has also created a concentrated nexus of potential failure. Failures in these systems have increased as the frequency and volume on the electronic networks has increased. The position of order matching engines in the trading infrastructure makes these systems o

	<script id="modal-view-template" type="text/html">
	<div class="modal-dialog">
	<div class="modal-content">
	<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
	<h4 class="modal-title" id="myModalLabel">Modal title</h4>
	</div>
	<div class="modal-body">
	...
	</div>

	//
	//Regions
	//

	var NoWrapRegion = Backbone.Marionette.Region.extend({
	attachHtml: function (view) {
	this.el.innerHTML="";
	var children = view.el.childNodes;
	while (children.length > 0) {
	this.el.appendChild(children[0]);

	'use strict';

	import Backbone from 'backbone';
	import Radio from 'backbone.radio';
	import Marionette from 'marionette';

	import MyselfModel from 'lib/common/models/myselfModel';
	import UserAccountCollection from 'lib/common/models/userAccountCollection';
	import AccountCollection from 'lib/common/models/accountCollection';

	var Col = require('react-bootstrap/lib/Col')
	var PageHeader = require('react-bootstrap/lib/PageHeader')
	var React = require('react')
	var Row = require('react-bootstrap/lib/Row')
	var {connect} = require('react-redux')
	var {reduxForm} = require('redux-form')

	var DateInput = require('./DateInput')
	var FormField = require('./FormField')
	var LoadingButton = require('./LoadingButton')

	import React from 'react';
	import Route from 'react-router-dom/Route';
	import Link from 'react-router-dom/Link';
	import Switch from 'react-router-dom/Switch';

	const App = ({ routes, initialData }) => {
	return routes
	? <div>
	<Switch>
	{routes.map((route, index) => {


	drupal chain --file=~/.console/chain/quick-start-mysql.yml