Upgrade to Pro — share decks privately, control downloads, hide ads and more …

react-hooks-loggerつくった話

Avatar for nitaking nitaking
September 18, 2019
Technology
0
510

 react-hooks-loggerつくった話

2019-09-18 LT #ebisujs

Avatar for nitaking

nitaking

September 18, 2019
Tweet

More Decks by nitaking

See All by nitaking
人は30分でLT資料を作って発表できるのか
Avatar for nitaking nitaking
0
250
React Native ことはじめ
Avatar for nitaking nitaking
0
250
2021-06-24 最近のビルドツール調べてみた
Avatar for nitaking nitaking
0
140
Fishのススメ
Avatar for nitaking nitaking
0
73
Blitz.jsの紹介
Avatar for nitaking nitaking
1
1k
Expo WEB × Next.js は実用できるのか？
Avatar for nitaking nitaking
3
1k
あの震えるインタラクションを実装したい
Avatar for nitaking nitaking
1
1.4k
アプリリリースまでのつらみあれこれ
Avatar for nitaking nitaking
0
660
React非同期ライブラリを知る
Avatar for nitaking nitaking
0
170

Other Decks in Technology

See All in Technology
ゼロコード計装導入後のカスタム計装でさらに可観測性を高めよう
Avatar for SansanTech sansantech
PRO
1
500
CLIPでマルチモーダル画像検索 →とても良い
Avatar for Motoi Washida wm3
0
190
IBC 2025 動画技術関連レポート / IBC 2025 Report
Avatar for CyberAgent cyberagentdevelopers
PRO
2
210
頭部ふわふわ浄酔器
Avatar for uyupun uyupun
0
230
AIでデータ活用を加速させる取り組み / Leveraging AI to accelerate data utilization
Avatar for okiyuki okiyuki99
4
1.1k
20251029_Cursor Meetup Tokyo ＃02_MK_「あなたのAI、私のシェル」 - プロンプトインジェクションによるエージェントのハイジャック
Avatar for Masayuki Kawakita mk0721
PRO
4
1.3k
ざっくり学ぶ 『エンジニアリングリーダー 技術組織を育てるリーダーシップと セルフマネジメント』 / 50 minute Engineering Leader
Avatar for iwashi iwashi86
1
440
もう外には出ない。より快適なフルリモート環境を目指して
Avatar for もっち mottyzzz
13
11k
プレイドのユニークな技術とインターンのリアル
Avatar for PLAID Tech plaidtech
PRO
1
450
AI時代の開発を加速する組織づくり - ブログでは書けなかったリアル
Avatar for Hiro hiro8ma
2
330
Retrospectiveを振り返ろう
Avatar for なかしょ nakasho
0
130
abema-trace-sampling-observability-cost-optimization
Avatar for tetsuya28 tetsuya28
0
200

Featured

See All Featured
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
72
11k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
24
3.7k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
514
110k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.2k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.1k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
44
7.8k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
10k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k

Transcript

  1. react-hooks-loggerͭͬͨ͘ 2019-09-18 Satoshi Nitawaki twitter: @nitaking_ github: nitaking

  2. None

  3. react-hooks-logger

  4. None

  5. react-redux Ϣʔβʔ͓ͳ͡Έ

  6. redux-logger

  7. ϦεϖΫτ

  8. console.log ͢Δ͚ͩ

  9. ͳͥ࡞ͬͨ

  10. reactͷOSS ࡞ͬͯΈ͍ͨ

  11. hooksͳΒ ͍͚ΔͷͰ͸

  12. redux-loggerͷ hooks ϙδγϣϯ

  13. None
  14. None

  15. react-hooks-logger

  16. ઌۦऀ͸͍ͨ

  17. ͕ͩෛ͚ͳ͍

  18. ͳʹ͔ ʢܽ఺͸ʣ ͳ͍͔

  19. None
  20. None

  21. callͷͨͼʹ ؀ڥม਺ ౉ͯ͋͛͠Δͷ ඍົʁ

  22. ΋͏͢͜͠ ͍͍ײ͡ͷ࣮૷ ͳ͍ʁ

  23. hooksͰ middlewareత ࣮૷ͱ͔ʁ

  24. None

  25. ContextͰάϩʔόϧ؅ཧ applyMiddlewareͰ useReducerͷ dispatchΛ؂ࢹ

  26. ͍͚ͦ͏ʁ

  27. ͍͚ͦ͏ʁ

  28. None

  29. middlewareʹ ͯ͠͠·͑͹ɾɾɾ ͋ͱ͸ɾɾɾ Μʁ

  30. None

  31. ͜Ε redux-loggerͰ ͍͍Ͱ͢ΑͶ

  32. Fin.

  33. ͕ͩ΍Ίͳ͍

  34. None

  35. useReducerͷ ϥούʔతͳ ࣮૷͸Ͳ͏ͩΖ͏

  36. None
  37. None

  38. ͏ʔΜ ݁ہ use-reducer-loggerͱ ͋·ΓมΘΒͳ͍͔΋…

  39. ͦΜͳ react-hooks-logger

  40. None
  41. None
  42. None
  43. None

  44. ͨͩͷconsole.log ϥΠϒϥϦͰ΋

  45. Ͳ͏͋Δ΂͖ ΑΓྑ͘͢Δʹ͸ ߟ͑Δͱਂ͍

  46. Έͳ͞Μ΋ ΦϨΦϨhooks ϥΠϒϥϦ ࡞ͬͯΈͯ͸

  47. Happy hacking!