こんにちは。LINEフィナンシャル開発センター フロントエンドエンジニアの峯です。先日新卒としてLINE証券プロジェクトに配属となり、最初のタスクとしてRecoilによる状態管理の導入に取り組みました。その際、なぜRecoilにしたのか、また本番開発にRecoilを使うにあたって設計に気をつけたことなどを本記事でご紹介しようと思います。 技術選定 いままでの状態と課題 LINE証券フロントエンドではReact+Typescriptによる開発を採用しており、いままでのグローバルな状態管理にはUnstated を用いていました。 Unstatedでは Container classを状態の単位とし、その内部の stateを setState によって更新します。状態を使用したいコンポーネント側では、<Subscribe> コンポーネントによって情報を読み出すことができます。 一方ご存知の通り、React 16.8以降ではhooksという概念が導入され、コンポーネント内の状態管理は class compone
sunderls is a front-end engineer
Header Parallax Transition swipe gestureの改善 componentCanSwipe componentWillExit Page Stackは膨大化になるのでは？ BrowserのNative Swipe Gestureとコンフリクトしない？ ブラウザー環境ではPage Stackを使う意味あるのか？ Functional Componentでは動けるか？ 結論 この記事は、LINE証券の開発メンバーが、LINE証券のフロントエンドにまつわる様々なトピックや、開発中に得た知見を共有する【LINE証券 FrontEnd】 シリーズの2記事目です。 はじめに こんにちは、sunderlsです。2年前Page Stackについての記事「LINEマンガ：Page Stackを使ってサクサクなページ遷移を実現できました」を出しました。LINE証券でもこのアプローチをとっています。 この記事ではPage Stackはどう進化したのか、どんな課題を抱えているのかを説明します。 Header Parallax Transition P
