Kotaro Sugawara kotarella1110

🏠

Working from home

🍺-driven development

kotarella1110 / counter.test.ts

Last active November 21, 2018 04:30

Counter app store example - TypeScript + React + Redux + redux-saga + typescript-fsa + typescript-fsa-redux-saga: https://gist.github.com/kotarella1110/e31fda608ab7182fec33c5e5737105be

	import { actions, asyncActions, reducer } from './counter';

	describe('counter actions', () => {
	it('increment should create counter/INCREMENT action', () => {
	expect(actions.increment()).toEqual({
	type: 'counter/INCREMENT',
	});
	});

	it('decrement should create counter/DECREMENT action', () => {

kotarella1110 / counter.test.ts

Last active November 21, 2018 04:22

Counter app store example - TypeScript + React + Redux + redux-saga + typescript-fsa: https://gist.github.com/kotarella1110/e31fda608ab7182fec33c5e5737105be

	import { actions, asyncActions, reducer } from './counter';

	describe('counter actions', () => {
	it('increment should create counter/INCREMENT action', () => {
	expect(actions.increment()).toEqual({
	type: 'counter/INCREMENT',
	});
	});

	it('decrement should create counter/DECREMENT action', () => {

kotarella1110 / App.tsx

Last active December 20, 2022 02:02

Counter app example - TypeScript + React + Redux + redux-saga

	import * as React from 'react';
	import { Store, createStore, combineReducers, applyMiddleware } from 'redux';
	import createSagaMiddleware from 'redux-saga';
	import * as ReactDOM from 'react-dom';
	import { Provider } from 'react-redux';
	import { reducer as counter, rootSaga } from './counter';
	import Counter from './Counter';

	const sagaMiddleware = createSagaMiddleware();

kotarella1110 / counter.test.ts

Last active November 21, 2018 04:26

Counter app store example - TypeScript + React + Redux + typescript-fsa: : https://gist.github.com/kotarella1110/3c42138ba0d53d1eba0cecd6fee23dbc

	import { actions, reducer } from './counter';

	describe('counter actions', () => {
	it('increment should create counter/INCREMENT action', () => {
	expect(actions.increment()).toEqual({
	type: 'counter/INCREMENT',
	});
	});

	it('decrement should create counter/DECREMENT action', () => {

kotarella1110 / App.tsx

Last active November 21, 2018 05:45

Counter app example - TypeScript + React + Redux

	import * as React from 'react';
	import { Store, createStore, combineReducers } from 'redux';
	import * as ReactDOM from 'react-dom';
	import { Provider } from 'react-redux';
	import { reducer as counter } from './counter';
	import Counter from './Counter';

	const store: Store = createStore(
	combineReducers({
	counter,

kotarella1110 / Bad.jsx

Last active April 27, 2021 16:49

Best way to define styled-components

	import React from 'react';
	import styled from 'styled-components';

	const Title = styled.h1`
	font-size: 1.5em;
	text-align: center;
	color: palevioletred;
	`;

	const Wrapper = styled.section`

kotarella1110 / App.tsx

Last active November 14, 2018 06:47

Title component example - TypeScript + React + styled-components

	import * as React from 'react';
	import * as ReactDOM from 'react-dom';
	import Title from './Title';

	interface Props {
	compiler: string;
	framework: string;
	}

	const App: React.SFC<Props> = () => <Title isActive />;

kotarella1110 / Counter.jsx

Last active November 12, 2018 08:10

React counter component comparing JavaScript and TypeScript.

	import React from 'react';

	class Counter extends React.Component {
	state = {
	counter: 0,
	};

	handleIncrement = () => {
	this.setState(state => ({
	counter: state.counter + 1,