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

ReactコンポーネントとCSSコンポーネントは1対1なのか問題について

B22ff27b7826e3299c8dba2e99f2aef8?s=47 Kazuki Shibata
September 27, 2016
Technology
7
4.5k

 ReactコンポーネントとCSSコンポーネントは1対1なのか問題について

React Meetup #4 でのLT資料です。

B22ff27b7826e3299c8dba2e99f2aef8?s=128

Kazuki Shibata

September 27, 2016
Tweet

More Decks by Kazuki Shibata

See All by Kazuki Shibata
microCMSでif文を作る
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
1
450
SvelteKitでJamstackを試す
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
1
530
フロントエンドのトレンド〜サーバーレスSPA、Jamstack〜
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
16
4.3k
Jamstack × PWA におけるキャッシュ戦略
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
3
800
CSR / SSR / SSGの動向2020
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
2
990
Jamstack×microCMS 実装編
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
4
460
SentryでSPAのエラーログを収集する
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
1
770
useRefについて調べてみた
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
1
92
フロントエンドエンジニアのキャリアパス
B22ff27b7826e3299c8dba2e99f2aef8?s=48 shibe97
9
3.1k

Other Decks in Technology

See All in Technology
Scrum Fest Osaka 2022 段階的スクラムマスターのススメ
68073cc248e24e0b94cc6895e5c4710f?s=48 orimomo
0
750
RDRA + JavaによるレジャーSaaSプロダクトの要件定義と実装のシームレスな接続
050b8cdbe92809580ed71d0d0d327e36?s=48 jjebejj
PRO
3
530
サーバレスECにおける Step Functions の使い方 〜ステートマシン全部見せます！〜
74cec195bfb6cb5165256d88cb7fcf0f?s=48 miu_crescent
0
190
Data in Google I/O - IO Extended GDG Seoul
3bd69093dbe39b14603242b96cfbd7c6?s=48 kennethanceyer
0
150
データをモデリングしていたら、組織をモデリングし始めた話 / engineers-in-carta-vol3-data-engineer
F3358acf3b3f8423f2db7718b51b5022?s=48 pei0804
4
3.3k
Security Hub のマルチアカウント 管理・運用をサーバレスでやってみる
640727b1a8120669de9b6d7f1d469893?s=48 ch6noota
0
790
約6年間運用したシステムをKubernetesに完全移行するまで/Kubernetes Novice Tokyo
46839cf590a549efe13547c17a6b2fde?s=48 isaoshimizu
5
810
Target SDK Versionを上げない Notification runtime permission対応
0c5e92294cc0cfba620641c589db9378?s=48 napplecomputer
0
130
20220622_FinJAWS_あのときにAWSがあったらこうできた
Feb135945a82ac9c12e91ba5f7e8bce2?s=48 taketakekaho
0
110
ひとりでも安定して 組織を変える活動を続けていくための ストレスマネジメント
D1bae34031a7675147bc658967c3a4cb?s=48 pastelinc
0
830
History of the ML system in KARTE
290d6f09d5a1df2c2ecb6601011fe5c1?s=48 kargo113
0
630
Design for Humans: How to make better modernization decisions
4d71670118785e492d724ba8c0ae54ad?s=48 indualagarsamy
2
120

Featured

See All Featured
A better future with KSS
5f2da528927a2ec9ba4fec2069cbc958?s=48 kneath
225
15k
Building Applications with DynamoDB
39488f9d172ab92fd352f2cd7b73258d?s=48 mza
83
4.7k
Gamification - CAS2011
4394ceb8b277f35ee3da7030384efb5d?s=48 davidbonilla
75
3.9k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
F383c6a4dc55e331bbe2987b622cee6b?s=48 stephaniewalter
269
11k
Large-scale JavaScript Application Architecture
96270e4c3e5e9806cf7245475c00b275?s=48 addyosmani
499
110k
Why Our Code Smells
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
324
55k
Six Lessons from altMBA
766b9746b59e6f09e280cd33cf4ed419?s=48 skipperchong
14
1.4k
Designing for humans not robots
D36d2c1821af9249b69ff7f5ed60529b?s=48 tammielis
241
23k
Designing on Purpose - Digital PM Summit 2013
7653c7c449918ff6542880a8c284f5e7?s=48 jponch
106
5.6k
Fantastic passwords and where to find them - at NoRuKo
8ec1383b240b5ba15ffb9743fceb3c0e?s=48 philnash
27
1.5k
GraphQLの誤解/rethinking-graphql
3cb4e761dbdb7aebd1ffd85f752e1e3e?s=48 sonatard
27
6.6k
Design by the Numbers
027d1ebf66cc039a0bd3b55eeadbe75d?s=48 sachag
271
17k

Transcript

  1. 3FBDUίϯϙʔωϯτͱ$44ίϯϙʔωϯτ͸
 ରͳͷ͔໰୊ʹ͍ͭͯ !TIJCF

  2. σβΠφʔ / ϑϩϯτΤϯυΤϯδχΞ γϕ @shibe97

  3. ॳΊʹݴ͓ͬͯ͘ͱ

  4. ๻͸ର೿Ͱ͢

  5. Ҏલ͸ର͡Όͳ͍೿Ͱͨ͠

  6. ͔͠͠ɺ࠷ۙ͸Ұपճͬͯɺ ΍ͬͺର͡ΌͶʁͬͯͳͬͯ·͢

  7. 3FBDUίϯϙʔωϯτ ͱ $44ίϯϙʔωϯτ

  8. )5.-ͷ·ͱ·Γ ͱ $44ͷ·ͱ·Γ

  9. )5.-΋$44΋ͲͪΒ΋7JFXΛදݱ͢ΔͨΊͷ΋ͷ $44͸)5.-ʹඥͮ͘ ෼ղͰ͖Δཻ౓΋౳͍͠

  10. 3FBDUίϯϙʔωϯτ͸7JFXͱϩδοΫΛ ෼཭͢Δ͜ͱͰ͔ͳΓࡉ͔͘෼ղͰ͖Δ

  11. 1SFTFOUBUJPOBMBOE$POUBJOFS$PNQPOFOUT 1SFTFOUBUJPOBM$PNQPOFOU ࠶ར༻ՄೳͳϐϡΞͳίϯϙʔωϯτ $POUBJOFS$PNQPOFOU SFEVYͷDPOOFDU ؔ਺Λར༻͠ɺDPNQPOFOUBDUJPOTUPSFΛඥ෇͚Δ

  12. 5XJUUFSͷλΠϜϥΠϯͷྫ

  13. )PNF5JNFMJOFͱ.FOUJPOT5JNFMJOF

  14. 5JNFMJOF ίϯϙʔωϯτ 5JNFMJOF ίϯϙʔωϯτ

  15. 5JNFMJOF ίϯϙʔωϯτ 5JNFMJOF ίϯϙʔωϯτ )PNF5JNFMJOFίϯςφ .FOUJPOT5JNFMJOFίϯςφ

  16. 5JNFMJOF ίϯϙʔωϯτ 5JNFMJOF ίϯϙʔωϯτ )PNF5JNFMJOFίϯςφ .FOUJPOT5JNFMJOFίϯςφ UIJTQSPQTHFU5JNFMJOF HFU)PNF5JNFMJOF HFU.FOUJPOT5JNFMJOF

  17. +49CSPXTFSJGZXFCQBDL ͕ঢ়گΛม͑ͨ

  18. +49ͱͯ͠)5.-Λ+4্Ͱ؅ཧͰ͖ΔΑ͏ʹͳͬͨ CSPXTFSJGZXFCQBDLΛ༻͍ͯɺ+4ϑΝΠϧΛ෼ׂͯ͠
 ؅ཧͰ͖ΔΑ͏ʹͳͬͨ )5.-͕$44ͱಉ౳ʹ෼ׂͰ͖ΔͷͰ͋Ε͹ɺཻ౓͸ἧ͏

  19. "UPNJD%FTJHO

  20. ͜ΕҎ্ ෼ׂͰ͖ͳ͍୯Ґ 

  21. 8FCʹ͓͍ͯɺίϯϙʔωϯτ͸ )5.-Ͱߏ੒͞Ε͍ͯΔ

  22. ͜ΕҎ্෼ղͰ͖ͳ͍
 )5.-ͷঢ়ଶͱ͸ʁ

  23. )5.-λάͦͷ΋ͷ 

  24. ۃ୺ͳ࿩ɺ%0.͕ͭͭ
 ίϯϙʔωϯτʹ੒Γ͏Δ

  25. %0.πϦʔ

  26. %0.πϦʔ "UPN

  27. %0.πϦʔ .PMFDVMF

  28. %0.πϦʔ 0SHBOJTN

  29. %0.πϦʔ

  30. ϕετ͸"UPN୯ҐͰ
 ίϯϙʔωϯτԽ

  31. ͨͩ͠ɺ޻਺ͱͷ݉Ͷ߹͍΋͋Δ ڞ௨Խ͢΂͖΋ͷ͕ग़͖ͯͨλΠϛϯάͰখ͍͞
 ίϯϙʔωϯτʹ෼ղ͍ͯ͘͠ͷ΋͋Γ

  32. None
  33. None
  34. None

  35. ͚ͩ͜͜ίϯϙʔωϯτԽ͢Δ͜ͱʹ
 ҙຯ͸͋Δͷʁ 2

  36. ҙຯ͸͋Δ "

  37. /BNFγϕ/BNF

  38. /BNFKT

  39. ελΠϧࠐΈͷίϯϙʔωϯτʹͰ͖Δ ϝϦοτ

  40. None
  41. None
  42. None

  43. ଞͷίϯϙʔωϯτʹྲྀ༻Ͱ͖Δ ϝϦοτ

  44. $44ίϯϙʔωϯτͷ೉͍͠ͱ͜Ζ ద༻͢ΔελΠϧ͸ίϯϙʔωϯτ಺ʹด͍ͯ͡Δඞཁ͕͋Δ ֎෦ʹӨڹͷ͋ΔελΠϧ͸֎ଆʢ਌ʣͷίϯϙʔωϯτͰࢦఆ ͢Δ΂͖

  45. 4DSFFO/BNF\ DPMPS qPBUMFGU NBSHJOMFGUQY ^ DMBTT/BNFl4DSFFO/BNFz DTT KTY

  46. 4DSFFO/BNF\ DPMPS qPBUMFGU NBSHJOMFGUQY ^ º º DMBTT/BNFl4DSFFO/BNFz DTT KTY

  47. 4DSFFO/BNF\ DPMPS qPBUMFGU NBSHJOMFGUQY ^ º º 5XFFU@@TDSFFO/BNF\ qPBUMFGU NBSHJOMFGUQY

    ^ DMBTT/BNFl4DSFFO/BNF5XFFU@@TDSFFO/BNFz DTT KTY

  48. յΕͳ͍$44ʹ͢ΔͨΊʹ ֤$44ίϯϙʔωϯτʹඞཁͳ͜ͱ ࣗ෼ࣗ਎ͷελΠϦϯά ࢠίϯϙʔωϯτͷϨΠΞ΢τ

  49. ਌͸ࢠཁૉΛ஌͍ͬͯΔ ࢠ͸਌ཁૉΛ஌Βͳ͍

  50. ͦΕͬͯ3FBDUίϯϙʔωϯτ΋Ұॹ

  51. ͔ͩΒཻ౓΋ἧ͏

  52. ·ͱΊ 3FBDUίϯϙʔωϯτ΋$44ίϯϙʔωϯτͱಉ౳ͷཻ౓Ͱ ࡉ෼ԽͰ͖Δʢ͸ͣʣ ίϯϙʔωϯτ͸ࡉ෼Խ͢Δʹӽͨ͜͠ͱ͸ͳ͍͕ɺ
 ޻਺ͱͷτϨʔυΦϑ

  53. 5IBOLT !TIJCF