Stylus

PostCSS

PostCSS

React

React

2013

В чем проблема?

Компоненты

"use strict";

var HelloComponent = React.createClass({
    render: function render() {
        return React.createElement(
            "div", null,
            "Hello ",
            this.props.name
        );
    }
});

React.render(
    React.createElement(
        HelloComponent, 
        { name: "Igor" }
      ), 
    document.body
);

React Components

var HelloComponent = React.createClass({  
    render: function() {
        return <div>
            Hello {this.props.name}
        </div>;
    }
});

React.render(
  <HelloComponent name="Igor" />, 
  document.body
);

JSX

Virtual DOM

Immutable JS

https://habrahabr.ru/post/260319/

FLUX

Redux

В чем успех?

• Очень просто
• VirtualDOM
• Реальные КОМПОНЕНТЫ
• AngularJS тормозит

Webpack

var ReactBootstrap = require("react-bootstrap");

require("./style.styl");
var view = require("./buttons.jade");

var HelloComponent = React.createClass({...});

Как это выглядит?

Docker

Для чего?

Чем лучше виртуальной машины?

docker-compose.yml

Text

web:
  image: node:5.4.0
  restart: always
  command: /bin/bash -c "npm install && npm start"
  mem_limit: 100000000
  volumes:
      - ../../node_modules/:/app/node_modules/
      - ../../gizobi_frontend/:/app/src/
      - ../../gizobi_frontend/node_modules:/app/src/node_modules
  ports:
      - "8022:8080"
  environment:
    PORT: 8080
    ENV: production
    NODE_ENV: production
    SITE_URL: http://gizobi.immuzov.ru
  working_dir: /app/src

api:
  image: node:5.4.0
  restart: always
  command: /bin/bash -c "npm install && npm start"
  mem_limit: 100000000
  volumes:
      - ../../node_modules/:/app/node_modules/
      - ../../gizobi_backend/:/app/src/
      - ../../gizobi_backend/node_modules:/app/src/node_modules
  ports:
      - "8023:8080"
  environment:
    PORT: 8080
    ENV: production
    NODE_ENV: production
  working_dir: /app/src

Docker

docker-compose.yml

Text

web:
  image: node:5.4.0
  restart: always
  command: /bin/bash -c "npm install && npm start"
  mem_limit: 100000000
  volumes:
      - ../../node_modules/:/app/node_modules/
      - ../../gizobi_frontend/:/app/src/
      - ../../gizobi_frontend/node_modules:/app/src/node_modules
  ports:
      - "8022:8080"
  environment:
    PORT: 8080
    ENV: production
    NODE_ENV: production
    SITE_URL: http://gizobi.immuzov.ru
  working_dir: /app/src