psamim

psamim

/* eslint-disable max-len */
/**
 * Build config for development process that uses Hot-Module-Replacement
 * https://webpack.github.io/docs/hot-module-replacement-with-webpack.html
 */

import webpack from 'webpack';
import validate, { Joi } from 'webpack-validator';
import merge from 'webpack-merge';
import ExtractTextPlugin from 'extract-text-webpack-plugin';

psamim

Directory Layout

.
├── /components/                # Shared or generic UI components
│   ├── /Button/                # Button component
│   ├── /Layout/                # Website layout component
│   ├── /Link  /                # Link component to be used insted of <a>
│   └── /...                    # etc.
├── /core/                      # Core framework

psamim

Verifying my Blockstack ID is secured with the address 1J1LfA6bicnnv593DhVag4FaUzd8r1uxiu https://explorer.blockstack.org/address/1J1LfA6bicnnv593DhVag4FaUzd8r1uxiu

 CREATE GIST

psamim

import * as React from 'react';

const Note = props => (
  <div
    style={{ color: props.selectedNoteIndex === props.index ? 'red' : 'blue' }}
  >
    {props.note}
  </div>
);

psamim

import * as React from 'react';

const Note = props => (
  <div style={{ color: props.selected ? 'red' : 'blue' }}>{props.note}</div>
);

const notes = [];
const selectedNoteIndex = 1;

notes.map((note, index) => (

psamim

const Note = props => <div>{props.note}</div>;

const SimpleNote = props => (
  <div
    style={{ color: props.selectedNoteIndex === props.index ? 'red' : 'blue' }}
  >
    <Note note={props.note} />
  </div>
);