jednano

import transpile, { Writer } from './transpile';

describe('transpile', () => {

    describe('given a reader that always reads "foobarbaz"', () => {

        const reader = { read: () => 'foobarbaz' };

        describe('given a default writer', () => {

jednano

import { noop } from 'lodash';

import EventEmitter from './EventEmitter';

describe('EventEmitter class', () => {

    describe('on()', () => {
        it('subscribes to foo event with listener', () => {
            const e = new EventEmitter();
            e.on('foo', noop);

jednano

Process

Prerequisites

1. Requirements.
   • Break it down into bite-sized pieces (bulletted lists are ideal).
   • Single source of truth (e.g., JIRA).
   • If not JIRA, add a link to the requirements in JIRA.
   • What device targets? (desktop, mobile/web, mobile app, etc.)
2. Assets (i.e., images, fonts).

jednano

if has('gui_running')
 set guifont=Fira\ Code:h14:cANSI:qDRAFT
endif

colors slate
set number

jednano

Writing CSS

This project uses cssnext, which allows us to use emerging CSS features at design time and transpile into currently-supported, browser-compatible CSS at runtime.

Styles can be found in app/styles. Inside this folder, you should familiarize yourself with the following structure:

styles
├── config
│ ├── fonts.json

jednano

import * as React from 'react';

interface Props {
	bar: string | number;
}

const Foo: React.FC<Props> = (props) => (
	<div>{props.bar}</div>
)

jednano

import { noop } from 'lodash';
import { join } from 'path';
import postcssNested from 'postcss-nested';
import postcssNestedProps from 'postcss-nested-props';
import postcssPropertyLookup from 'postcss-property-lookup';

import variables from './vars.json';
import fonts from './fonts.json';

const browsers = [

jednano

import { noop } from 'lodash';
import webpack from 'webpack';
import Dashboard from 'webpack-dashboard';
import DashboardPlugin from 'webpack-dashboard/plugin';
import webpackDevMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';

import config from '../webpack.config.dev';

export default function loadDevMiddlewares({ app }) {

jednano

$font-adjustments: (
    arial-bold: (
         ascender:  0.056,
              cap: -0.130,
         baseline: -0.154,
        descender:  0.056
    ),
    georgia-regular: (
         ascender:  0.064,
              cap: -0.157,

jednano

import {
    Component,
    EventHandler,
    FormEvent
} from 'react';

import { ElementProps, resolveClassNames } from '../../../helpers/bem';
import { Label } from '../../Form';

export default class InputPassword extends Component<