Material - UI v1が 出そうなので使ってみた

Material - UI v1が出そうなので使ってみた感想です。

Transcript

1. .BUFSJBM6*WƢ
   ͘ƳƜǀDŽƽ˚ƹƼǕƵ
   
   3FBDULZPUPW
   

   View Slide

2. !NJTVNJ@UBLVNB
   !NJTVNJ@UBLVNB
   CMPHNJTNJUIQPSUGPMJPDPN
   NJTNJUI
   ૔՛ਸʬ
   w ॳ͸ͯͳ
   w 3FBDU͸ձࣾͰ΍Γͦ͏ͳͷͰݸਓతʹ͍Ζ͍Ζࢼ͠த
   w 3FBDU,ZPUP͕ࠓ೔ͩͱࠓ೔ؾ͖ͮ·ͨ͠ʜ
   

   View Slide

3. .BUFSJBM6*
   

   View Slide

4. .BUFSJBM6*
   w ͨͿΜҰ൪஌ΒΕͯΔ3FBDUͷίϯϙʔωϯτϥΠϒϥϦ
   w ʮ"XX:FBI .BUFSJBM6*WJTDPNJOHʯ
   w ͳΜ͔΋͏͙͢དྷͦ͏
   

   View Slide

5. .BUFSJBM6*WǨDžƮǗǡ
   w ʮOQNJOTUBMM4NBUFSJBMVJ!OFYUʯͰΠϯετʔϧ
   w 47(ΞΠίϯ͸ʮOQNJOTUBMM4NBUFSJBMVJJDPOTʯͰ࢖͑Δ
   w SFBDUUBQFWFOUQMBHJO͍ͬͯ͏ͷ͕΋͏ෆཁͦ͏
   

   View Slide

6. .BUFSJBM6*WǨƺơƹƼǕǡ
   ͨͱ͑͹Ϙλϯ
   JNQPSU'MBU#VUUPOGSPNbNBUFSJBMVJ'MBU#VUUPO`
   JNQPSU3BJTFE#VUUPOGSPNbNBUFSJBMVJ3BJTFE#VUUPO`
   DPOTU&YBNQMF
   \
   EJW
   'MBU#VUUPOMBCFMl%FGBVMUz
   3BJTFE#VUUPOMBCFMl1SJNBSZz
   EJW
   ^
   JNQPSU#VUUPOGSPNbNBUFSJBMVJ#VUUPO`
   DPOTU&YBNQMF
   \
   EJW
   #VUUPO%FGBVMU#VUUPO
   #VUUPOSBJTFEDPMPSlQSJNBSZz1SJNBSZ#VUUPO
   EJW
   ^
   ͱͳ͍ͬͯͨͷ͕
   ͜͏
   

   View Slide

7. -BZPVUƢ౼;ƫǢƼǡ
   w લόʔδϣϯͰ͸ϨΠΞ΢τ͸ͳ͔ͬͨ
   w 'MFYCPYΛ࢖ͬͨ෼ׂͷ(SJE-BZPVU͕௥Ճ͞Ε͍ͯΔ
   w (SJEΛ࢖͏
   

   View Slide

8. ƺơƹƼǕǡ
   w HVUUFSͰִؒΛࢦఆ
   w ࿮ʹ͸DPOUBJOFSɺத͸JUFN
   w YT΍TNɺMHͳͲ༻ҙ͞ΕͯΔϒϨΠΫϙΠϯτͰԿ෼ׂʹ͢Δ͔ࢦఆ
   w ϒϨΠΫϙΠϯτͷ୯Ґ͕EQͱ͍͏΍ͭ
   JNQPSU(SJEGSPNNBUFSJBMVJ(SJE
   DPOTU&YBNQMF
   \
   EJW
   (SJEDPOUBJOFSHVUUFS\^
   (SJEJUFNYT\^TN\^
   YTTN
   (SJE
   (SJEJUFNYT\^TN\^
   YTTN
   (SJE
   (SJE
   EJW
   ^
   

   View Slide

9. ƺơƹƼǕǡ
   w ੔ྻ͢Δͷ΋༻ҙ͞ΕͯΔ
   w EJSFDUJPOɺKTVUJpZɺBMJHOͳͲqFYCPY࢖ͬͯͨΒ͍͍ͩͨ෼͔Δ
   JNQPSU(SJEGSPNNBUFSJBMVJ(SJE
   DPOTU&YBNQMF
   \
   EJW
   (SJEDPOUBJOFSEJSFDUJPOlDPMVNOKVTUJGZlTQBDFBSPVOEBMJHOlqFYFOE
   (SJEJUFNYT\^TN\^(SJE
   (SJEJUFNYT\^TN\^(SJE
   (SJEJUFNYT\^TN\^(SJE
   (SJE
   EJW
   ^
   

   View Slide

10. ƺơƹƼǕƵ؎؆
    w MBZPVU૿͑ͯΔͷ͸ศར
    w EQ͍ͬͯ͏୯Ґ͕ͪΐͬͱ෼͔Βͳ͍
    w .FOV*UFNQSJNBSZ5FYUl4BNQMFzͱ͍͏ײ͡ʹͳͬͯͨͷ͕ɺ
    .FOV*UFN4BNQMF.FOV*UFNͱด͡ΒΕΔΑ͏ʹͳͬͯΔͷ͕ݸ
    ਓతʹ͸͍͍
    w υΩϡϝϯτ͸΋͏ͪΐͬͱॆ࣮ͯ͠΄͍͠ʢ͜Ε͔Βʁʣ
    w ͳΜ͔ྑͦ͞͏
    

    View Slide

11. ƠǥǠ
    
    3FBDULZPUPW
    

    View Slide