Day13 #100DaysOfCode

OBON1日目。昨日の疲れからか爆睡してしまった、疲れは取れた気がする。

Day13

手を止めてしまうのもよくないので、typescript-fsaというライブラリを使って、TypeScript + Reduxをやってみようと思った。

typescript-fsaは多分Reduxのラッパーのような気がするので、その気になればコード読めばどのように型をつけたらいいかきっとわかるだろうというのが狙い。

いたって普通の同期的な処理ならこんな感じでかける。

import { Action } from 'redux';
import actionCreatorFactory, { isType } from 'typescript-fsa';

const actionCreator = actionCreatorFactory();

enum ActionTypes {
  INC = 'Counter/Increment',
  DEC = 'Counter/Decrement'
}

export const increment = actionCreator<{amount: number}>(ActionTypes.INC);
export const decrement = actionCreator<{amount: number}>(ActionTypes.DEC);

interface IState {
  count: number
}

const defaultState: IState = {
  count: 0
};

export default (state: IState = defaultState, action: Action): IState => {
  if (isType(action, increment)) {
    return {
      ...state,
      count: state.count + action.payload.amount
    };
  }

  if (isType(action, decrement)) {
    return {
      ...state,
      count: state.count - action.payload.amount
    }
  }

  return state;
}

Reducerのところ、ifで引っ掛けるのが気持ち悪い感じもするが、TypeScriptならreturnし忘れは起きないだろうからいいのか?

(と思っていたら、typescript-fsa-reducersとかいうのを見つけた。ここまでやるとライブラリにべったりでだいぶ気持ち悪い感じがしてしまうのは僕だけだろうか…。)

GitHub - dphilipson/typescript-fsa-reducers: Fluent syntax for defining typesafe reducers on top of typescript-fsa.

で、問題は非同期処理。

こっちも鋭意やってるけど、まだよくわかってないので明日にでもブログまとめて書きたい

雑談

亀さんペースでしか進捗を出せてないの完全によくない