広島フロントエンド勉強会 Vol. 1 『Flexboxを使いこなす』

Transcript

1. 'MFYCPYΛ࢖͍͜ͳ͢ $PEF$PEF
   Ҫ্
   ୓
2. Ҫ্
   ୓ w ޿ౡϑϩϯτΤϯυษڧձओ࠵
   w $44
   /JUF
   JO
   )*304)*."
   ࣮ߦҕһձ෭ҕһ௕
   w 8&#
   506$)
   .&&5*/(
   ड෇ͷਓ $PEF$PEF ͜Μͳਓ
3. w 'MFYCPYͷ֓ཁ
   w 'MFYCPYͰศརͳ͜ͱ
   w ϓϩύςΟ
   w γϣʔτϋϯυ
   w 'MFYCPYͷ࢖͍Ͳ͜Ζ
   w Φεεϝͷษڧ๏
   w ·ͱΊ ໨࣍
4. 'MFYCPYͷ֓ཁ ˞ਖ਼໊ࣜশ$44
   'MFYJCMF
   #PY
   -BZPVU
   .PEVMF
5. ΠϯλʔϑΣʔεઃܭ༻ʹ࠷దԽ͞Εͨ
   $44ϘοΫεϞσϧ ೥͝Ζ͔Β͋ͬͨɻ ೥࢓༷มߋɻ ೥࢓༷มߋɻ ͦΕʹΑΓɺόʔδϣϯ͚ͩͰͳ͘
   ϒϥ΢β͝ͱͰ΋࣮૷ʹࠩҟ͕͋Δɻ
6. ˞*&ʹόά͋Γ
   IUUQXXXDPOJGFSKQJF@DIFDLIUNM 1)14&44*%BDEDTOCEJEIFBUE $BO
   *
   VTF
   
   
   
7. 'MFYCPYͰศརͳ͜ͱ
8. w ߦͰԣฒͼ
   w ԣฒͼʹͳͬͨཁૉͷߴ͞Λἧ͑Δ
   w ෳ਺ཁૉͷఱ஍தԝ഑ஔ
   w ϦΩουϨΠΞ΢τ ϓϩύςΟΛ૊Έ߹ΘͤͨΓɺ
   +BWB4DSJQUʹཔ͍ͬͯͨΑ͏ͳ഑ஔ͕؆୯ʹͰ͖Δ
9. ϓϩύςΟ
10. Ұॹʹ஋Λೖྗͯ͠ࢼͯ͠Έ·͠ΐ͏ IUUQHPPHMD98TF
11. EJTQMBZGMFY ·ͣ͸͡Ίʹ ਌
12. qFYEJSFDUJPO w SPX
    w DPMVNO
    w SPXSFWFSTF
    w DPMVNOSFWFSTF ࢠཁૉ 'MFY
    JUFN ͷ഑ஔΛܾΊ·͢ ਌
13. qFYXSBQ w OPXSBQ
    w XSBQ
    w XSBQSFWFSTF ࢠཁૉͷંΓฦ͠Λઃఆ͠·͢ ਌
14. KVTUJGZDPOUFOU w GMFYTUBSU
    w GMFYFOE
    w DFOUFS
    w TQBDFCFUXFFO
    w TQBDFBSPVOE ਌ཁૉͷਫฏํ޲Λج४ʹࢠཁૉ഑ஔ͠·͢ ਌
15. BMJHOJUFNT w GMFYTUBSU
    w GMFYFOE
    w DFOUFS
    w TUSFUDI
    w CBTFMJOF ਌ཁૉͷਨ௚ํ޲Λج४ʹࢠཁૉ഑ஔ͠·͢ ਌
16. BMJHODPOUFOU w GMFYTUBSU
    w GMFYFOE
    w DFOUFS
    w TUSFUDI
    w CBTFMJOF
    w TQBDFCFUXFFO
    w TQBDFBSPVOE ਌ཁૉͷਨ௚ํ޲Λج४ʹෳ਺ߦࢠཁૉΛ഑ஔ͠·͢ ਌
17. qFYHSPX w ੔਺  
 
 
 ਺஋ʹΑͬͯԣ෯Λ෼഑
 
 େ͖͍ํ͕ɺ޿͘ͳΔɻ ࢠཁૉͷ৳ͼΔഒ཰Λܾఆ͠·͢ ࢠ
18. qFYHSPXͷαΠζܭࢉ qFYHSPX
     qFYHSPX
     QY QY QY QY QY QY
19. qFYTISJOL w ਖ਼ͷ੔਺  
 
 
 ਺஋ʹΑͬͯԣ෯Λ෼഑
 
 େ͖͍ํ͕ɺ޿͘ͳΔɻ
 
 
 ਌ཁૉ͔Β͸Έग़࣌͢ͷΈػೳ
 
 
 ྫ
    ਌QY
    ࢠQY 
 
 ɹ
    
    ൪໨ͷΈGMFYTISJOL
     ࢠཁૉͷॖΉഒ཰Λܾఆ͠·͢ ࢠ
20. qFYCBTJT w ਖ਼ͷ੔਺ BVUP ࢠཁૉͷ࠷ॳͷαΠζΛݩʹ
    ओ࣠ํ޲αΠζͷॳظ஋Λܾఆ͢Δ ˞ओ࣠ํ޲
 qFYEJSFDUJPOͷ஋ ࢠ ˞όά͋Γ
 *&Ͱ͸ɺCPYTJ[JOHCPSEFSCPYͷܭࢉΛߦͬͯ͘Εͳ͍
21. BMJHOTFMG ࢠཁૉͷ੔ྻΛBMJHOJUFNTͰͷࢦఆΑΓ༏ઌͤ͞Δ ࢠ w GMFYTUBSU
    w GMFYFOE
    w DFOUFS
    w TUSFUDI
    w CBTFMJOF
22. PSEFS ࢠཁૉͷฒͿॱ൪Λܾఆ͠·͢ w ਖ਼ͷ੔਺  ˞)5.-ࣗମ͕ೖΕସΘΔΘ͚Ͱ͸ͳ͍఺ʹ஫ҙ ࢠ
23. γϣʔτϋϯυ
24. qFYqPX qFYEJSFDUJPOͱqFYXSBQͷγϣʔτϋϯυ w OPXSBQ
    w XSBQ
    w XSBQSFWFSTF w SPX
    w DPMVNO
    w SPXSFWFSTF
    w DPMVNOSFWFSTF qFYEJSFDUJPO qFYXSBQ ਌
25. qFY qFYHSPX qFYTISJOL qFYCBTJTͷγϣʔτϋϯυ qFYHSPX qFYTISJOL qFYCBTJT w ਖ਼ͷ੔਺ w ਖ਼ͷ੔਺ w ਖ਼ͷ੔਺ ࢠ
26. ஫ҙ఺ w GMPBU΍DMFBS΍WFSUJDBMBMJHO͸GMFYΞΠςϜʹӨڹ͠ͳ͍
    w DPMVNOSFWFSTF͸GJSTUMJOF
    GJSTUMFUUFSͳͲͷٙࣅཁૉ ͸దԠ͞Εͳ͍
    w SFWFSTF
    PSEFS͸)5.-ࣗମ͕ೖΕସΘΔΘ͚Ͱ͸ͳ͍
27. 'MFYCPYͷ࢖͍Ͳ͜Ζ
28. ϝχϡʔϘλϯ
29. ϕʔεϨΠΞ΢τ
30. ΧϥϜ
31. Φεεϝͷษڧ๏
32. 'MFYCPY
    1MBZHSPVOE w 'MFYCPYͷ࣮ݧ͕Ͱ͖·͢ɻ
33. '-&9#09
    '30((: w 'MFYCPYΛήʔϜײ֮Ͱ༡ͼͳ͕Βֶ΂·͢ɻ
34. ·ͱΊ
35. ·ͱΊ w ΋͏࢖ͬͯ΋͍͍ஈ֊ʹདྷ͍ͯΔ͸ͣ
 
 ΋͏࢖͍ͬͯΔਓ΋͍Δ͸ͣ
    w 'MFYCPYͷಛੑ͕͋Δ 'MFYCPYΛཧղͯ͠ɺָΛ͠·͠ΐ͏
36. /&95 $44
    (SJE
    -BZPVU
    .PEVMF &EHF
    *&ͷΈ࣮૷ (PPHMF
    $ISPNF΋ࢼݧతʹ࣮૷ ઃఆඞཁ