Posts

気付いたら五月の半ばが過ぎてました。最初の一週間はGWだったんで、そこまで過ぎている感じはありませんでしたが。 さて、最近仕事で手を動かしていると、趣味で手を動かすのが億劫になってしまっていてネタが無いので、久し振りにゲームの話をちょこっと書いてみます。 ...

気付いたら五月の半ばが過ぎてました。最初の一週間はGWだったんで、そこまで過ぎている感じはありませんでしたが。 さて、最近仕事で手を動かしていると、趣味で手を動かすのが億劫になってしまっていてネタが無いので、久し振りにゲームの話をちょこっと書いてみます。 ...

最近は(も)OCamlばっかり書いていましたが、最近また趣味側でもTypeScriptを書き始めました。 がーっと作ったので、ちょっと設計がいまいちというかそのまますぎた部分があったので、それのリファクタをやってるんですが、その過程で超シンプルなDI Containerを作ったので紹介します。 ...

最近は(も)OCamlばっかり書いていましたが、最近また趣味側でもTypeScriptを書き始めました。 がーっと作ったので、ちょっと設計がいまいちというかそのまますぎた部分があったので、それのリファクタをやってるんですが、その過程で超シンプルなDI Containerを作ったので紹介します。 ...

つい先日見つけたフォントを試してみたら大変キレイで気に入ったので紹介です。 ...

つい先日見つけたフォントを試してみたら大変キレイで気に入ったので紹介です。 ...

あれ？もう三月？という程度には時間の流れが早くて色々ビビってます。 最近仕事の方に時間が割かれがちなので、ちょっと埋め草的にEmacsの設定を紹介してみます。 ...

あれ？もう三月？という程度には時間の流れが早くて色々ビビってます。 最近仕事の方に時間が割かれがちなので、ちょっと埋め草的にEmacsの設定を紹介してみます。 ...

あけましておめでとうございます。鏡開きギリギリなのでまだそう言っていいはず・・・。気付いたら転職して大体2年経過していたり、引越してから一年過ぎていたりして、時間の流れははえーなぁ、と思う日々です。 大体一ヶ月くらいセコセコとやって、年末年始も(珍しく)実家で作業していたりしたやつが、基本部分は動くようになったので、それについて書いてみます。 ...

あけましておめでとうございます。鏡開きギリギリなのでまだそう言っていいはず・・・。気付いたら転職して大体2年経過していたり、引越してから一年過ぎていたりして、時間の流れははえーなぁ、と思う日々です。 大体一ヶ月くらいセコセコとやって、年末年始も(珍しく)実家で作業していたりしたやつが、基本部分は動くようになったので、それについて書いてみます。 <!–more–> きっかけ きっかけは単純で、色々見ていたときに、 yew というフレームワークを見つけたから、です。 https://yew.rs/ どういうものかというと、 Rust製 React.jsを強く指向したコンポーネントライブラリ 周辺にstate管理(だけじゃないけど後述)、ルーターなども整備していて、必要最小限は揃っている というものです。超荒く言うと、 Rustで全部やっちゃおうぜ というやつですね。js_of_ocamlとかBucklescriptとかで実際似たようなことをやっていた身としては馴染があります。あっていいのか。結論的には、いつもの やってみたかった駆動開発 です。 リポジトリ https://github.com/derui/simple-planning-poker/tree/yew すでにこのリポジトリが盛大な実験場となっているのは気にしないでください この記事の時点だと、必要最小限成立する程度の機能までしかできてません。一応道筋は見えているので、実装自体は簡単ではありますが。 構成 利用しているライブラリはCargo.tomlを見たらだいたいわかるようになっていますが、それ以外の構成も含めて、利用しているツールなど。 Rustは最新安定版 yarn v3 ずーっとv1使ってきましたが、アップグレードしてみました Webpack 5 wasm-pack + wasm-pack-plugin メインのprojectとサブprojectとして分離 ルートのCargo.tomlには、projectsの定義のみ入れています ライトなCleanArchitecture的思想 ただし、これはプロジェクト構成を失敗した感も・・・ yew-agent/yew-routerを利用してルーティングとか wasm-bindgen + gloo + wasm-bindgen-future Firebase(realtime database/auth)を利用 当然Rustから呼んでます TSな部分は、依存をglobalに展開 + Firebaseの初期化のみ という形になっています。ぶっちゃけ途中はテストも書かずにひたすら移植作業していたので、実際に動くのかどうか？は実際に動かしながら試してみた・・・というあんまりよくない形になっています。が、テスト書きながらだと多分この2倍かかった気がするので、とりあえずどういうものなのか？を確かめるという目的を達成するためにはこれでよかったかな、と。 yewでどうやって書くのか？ Rustがどういうものか、とかは全部すっとばします。Rust公式に良質なドキュメントがあるのでそちらをどうぞ。また、初期セットアップも全部すっとばします。公式ドキュメントを見たほうが早いです。 超簡単なサンプルとしてはこんな感じになります。 #[derive(Properties, PartialEq)] pub struct Property { counter: u32, } #[function_component(Component)] pub fn component(props: &Property) -> Html { html! { <div><span> {"Counter: "} </span><span> {props.counter}</span></div> } } #[function_component(Main)] pub fn main() -> Html { let state = use_state(|| 0); let onclick = { let state = state.clone(); Callback::from(|_| state.set(*state + 1)) }; html! { <Component counter={*state} /> <button onclick={onclick}>{"Click"}</button> } } yewは、 struct component と functional component という二通りの実装が可能です。この辺もReactのClass ComponentとFunctional Componentとよく相似していますね。 ...