javascript から typescript へ移行した

昨年の話だけど、業務でJSのプロジェクトをTypeScriptへ移行した。

メンバーは一通りのTypeScriptの知識はあったけど、移行へ手が回っていない状況だった。

そんな中でJSからTSへ変換するツールを airbnb が出していることを知った。

github.com

試さない手は無いだろうと早速使用したところ動作へ支障がなかったので本格適用した。

ちなみにほぼすべての型が any になるので、プロダクトの核になるようなモデルの型は早めに定義を行った。 その他は随時行っている。

ツールに不満はないが、ボーイスカウトルール的に型定義を書いていくとどうも1つのprの変更内容が大きくなり、作業が億劫になってしまう人がいた。

既存の改修の際は型定義を書く工程とロジックの改修を分けたほうが良かったかもしれない。

お買い物

技術書を買ってきた

モノリスからマイクロサービスへ

www.oreilly.co.jp

12月ころから分散型モノリスのプロダクトをモジューラモノリスへの移行を始めている。 当然、マイクロサービスも検討したが開発者の人数がまだそこまでスケールすることが見えておらず、オーバーキル感が歪めなかったため。

今はmonorepoへの移行までほぼ完了している。 まだ見ぬ地雷を察知することができれば儲けものだ。

イラストでわかる DockerとKubernetes

gihyo.jp

恥ずかしながら、Dockerを仕事で平然と使用しているが、立ち読みしてページをめくるたびに理解が曖昧だったことや知らないことが書いてあり、 自分の知識を浅はかさを感じて購入した。

Kubernatesは当分使わないだろうが、良い学びになりそうだ。

Kubernetesで実践するクラウドネイティブDevOps

www.oreilly.co.jp

Kubernates 業務では当分使わないだろうが、知らない言い訳もできないレベルと思ったので買った。 Kubernatesは読み飛ばしたとしてもエッセンスはECSにも応用できるだろう。

年末はこれで暇しないぞ

今年扱った技術

今年の一枚

f:id:ozw-sei:20201222230643j:image

 

## 言語

- JavaScript

- TypeScript

- Python

- Go

- Elixir

- C#

 

## フレームワークやライブラリ

- Three.js

- PIXI.js


- React/Redux, お勉強でRecoil

 

- Serverless Framework 
- Express.js

- flask

- gin

- bolt(slack)

- opencv

 

その他

- lerna 

- prisma

- Inverse.js

- mypy 

- IBM-Watson 

- terraform

- Unity

- github-actions 

- aws

    - dynamo

    - ecs

    - cognito 

 

お前、なんで同じことをやるために3つも言語使ってんだよって突っ込まれると思うが、しょうもない事情がカクカクしかじか。

 

主な仕事はweb-apiの開発とかフロントエンド(ゲームクライアント、webページ)など全般。

 

緩急はあるけど、家で書くのはゲームクライアントで仕事ではサーバーが多かった。

 

人が少ないので仕事を選ぶ権利は存在しない

 

去年はLinuxメインで開発してたけど、wsl2が正式リリースして、枯れてメインマシンがwinになる一大イベントがある年でした。

 

反省としては社会人一年目から守ってきた、毎年一つの言語を習得するルーチンを始めて破ってしまった。

なんか、新しい言語に飢えがなかったんですよね。

ElixirとGo,Pythonで満足してる。

 

実用性考えなければ来年はAlgol とかAdaやってみようかな。

あとはC++再入門するか。

 

こんなかんじで面白がっていろんなことやってるので職歴見るとなんなのかわからんやつになってる。

 

まぁ、ゲームクライアントとサーバーはなるべくトレンド追うようにしてるけど、他は深追いしていない。

 

粛々とやるだけ。

WSL2

メインPCはwindowsである。

 

といっても、windowsで開発してるのはもっぱらC#/Unity やwebftont周りが多い。

 

メイン環境はwsl2でWLinuxを入れ使ってる。

 

少々はまりどころあるし有料だけど、X410と連動してすぐにemacsGUIモードをx経由で使えるから気に入ってる。

WSLでたまに困るのは windows updateLinuxカーネルがアップデートされたときにディストロの設定周りが変わってないようで、Kernel バージョンがミスマッチしてると警告が出る。

 

消したいけど、対処法よくわかんない。

 

また、Xから起動しているのでimeをホストとゲスト両方に入れないといけないとかで少し困ってる。

ホストのgoogle ime をMozc helper から参照できるようだけど、試してない。

 

ヤクの毛刈りは続く。

オカメインコが謎の踊りを始めた

f:id:ozw-sei:20201222223151j:image

 

ブランコを揺らして遊んでるのだが、友人に見せたらおもちゃに発情してるんじゃないかと言われたけど、まだ吐き戻しとか卵見てないしなぁ。なんとも言えん。

 

まぁ、楽しそうでいいけど、ブランコで遊ぶのはセキセイのイメージ強かった

 

性別不明

TypeScriptでrender props を書いてみた

JavaScriptで書いたことがあったけど、TypeScriptでは初めてだったので。

React Render Props in TypeScript - James Ravenscroft - Medium

Render Props - React

import { storiesOf } from '@storybook/react';
import * as React from 'react';

interface NumberHolderInjectionProps {
  num?: number;
  onChange(num: number): void;
}

interface NumberHolderProps {
  children(injection: NumberHolderInjectionProps): JSX.Element;
}

interface NumberHolderState {
  num?: Number;
}

class NumberHolder extends React.Component<NumberHolderProps, NumberHolderState> {
  state = {
    num: undefined
  };

  onChange = (num: number) => {
    this.setState({
      num
    });
  }

  render(): JSX.Element {
    return this.props.children({
      num: this.state.num,
      onChange: this.onChange
    });
  }
}

interface NumberRendererProps extends NumberHolderInjectionProps {}

let isFirst = true;

const NumberRenderer: React.SFC<NumberRendererProps> = (props) => {
    // コレがないと無限ループする
  if (isFirst) {
    props.onChange(777);
    isFirst = false;
  }

  return (
    <div>
      <p>{ (props.num || 10000) } </p>
    </div>
  );
};

const WrappedNumberRenderer: React.SFC<{}> = (_) => (
  <NumberHolder>
    {(injection: NumberHolderInjectionProps) => <NumberRenderer {...injection} />}
  </NumberHolder>
);

storiesOf('TypeScript&RenderPropsの実験', module)
  .add('Simple実装', () => (
    <WrappedNumberRenderer />
  ));