Reactでロジックをhooksにまとめないという選択肢 - Hello Tech

2022/05/24 134 users AutoReserve hooks React ローンチ前

javascripterです。ハローでは、プロダクトのローンチ前からAutoReserve の開発に関わっています。 突然ですが、Reactを使用する際、コンポネントのロジックや状態が増えてきたとき、みなさんはどうされてるでしょうか。 関数コンポネントでは、一般にcustom hooksとしてまとめて切り出すことが多く行われていると思いま... 続きを読む

React.Context で作る GlobalUI Custom Hooks

2021/02/16 12 users component Notification Tips 通知

GlobalUI を、React.Context を利用して作る TIPS です。どの Component からも利用しやすい様に Custom Hooks を経由します。よくある、何かを更新した際、画面上部に通知（Notification）を表示するサンプルを元に解説します。（↓ の画像の様なもの） 利用例 Notification を呼び出す Component は次の様なコードにな... 続きを読む

hygen で生成 - 対話形式の Component 雛形 -

2020/10/18 13 users component module StorYBook 雛形

Component 作成にあたり、storybook や test も一度にコミットする場面が増えてきました。そして CSS Modules や、特定 Component 専用の custom hooks など、一つの Component を構成するファイル群はそれなりの量になってきます。例えば、以下の様な module 構成の Component です。これを手作業で作成するとなると、... 続きを読む

Reduxよりも多分使いやすいReact Custom Hooksを作りました ! - Qiita

2019/07/26 17 users Qiita redux

import React from "react"; import { useClutch } from "use-clutch"; const store = { value : "not update" }; const reducer = async (state, action) => { switch(action.type) { case "action": return { value : "updated!" }; default: return state; } }; const App = () => { const { state, dispatch } = use... 続きを読む