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

[Tama.rb年忘れLT会]レールに乗ったCSSコーディング

8aebb410308ec2c655550798e92cd2df?s=47 ken3ypa
December 27, 2020

 [Tama.rb年忘れLT会]レールに乗ったCSSコーディング

8aebb410308ec2c655550798e92cd2df?s=128

ken3ypa

December 27, 2020
Tweet

Transcript

  1. Ϩʔϧʹ৐ͬͨ$44ίʔσΟϯά !LFOZQB 3BJMTʷ5BJMXJOE$44Ͱ !5BNBSC೥๨Ε-5ձ

  2. Έͳ͞Μɺࠓ೥΋Ұ೥͓ؒർΕ༷Ͱͨ͠ʂ

  3. ͲΜͳҰ೥ؒΛա͝͞Ε·͔ͨ͠ʁ

  4. ΅͘͸͜Μͳײ͡Ͱͨ͠

  5. None
  6. ˢ͜ͷลͰ$44ʹ͑Β͍ۤ࿑ͨ͠ͷͰ ࠓ೔͸$44ʹ͍͓ͭͯ࿩͍ͨ͠ͱࢥ͍·͢

  7. ໨࣍     ͖͔͚ͬ  5BJMXJOE$44ͱ͸  5BJMXJOEʷ3BJMTͰ

    4DBGGPMEΞϓϦΛ࡞ͬͨྫ ࠓ೔͓࿩͢͠Δ͜ͱ
  8. ໨࣍    5BJMXJOE$44Λݱ৔Ͱ࢖͓ͬͨ࿩ ʢ͍͔ͭ͸࢖͍͍ͨʣ  ֓ཁҎ্ͷ5BJMXJOE$44ͷ͓࿩͠  ܥͷࠩ෼ͱ͔ɺ1VSHF$44ͱ͔

    ࠓ೔͓࿩͠͠ͳ͍͜ͱ
  9. ͱ͍͏Θ͚Ͱ΍͍͖ͬͯ·͠ΐ͏ʂ

  10. ͖͔͚ͬ w SBJMTOFX͔Β։࢝ɻϑϩϯτͷॳظઃఆɾ࣮૷΋αʔόʔαΠυ͕࣮ࢪ w σβΠφʔͷํ͸$44͸ॻ͔ͣɺσβΠϯΧϯϓͷ࡞੒ͷΈ w $44ʹ஌ݟͷ͋Δϝϯόʔɺ΄΅օແ w ͍ΘΏΔʮ#PPUTUSBQषʯΛආ͚ΔͨΊɺ$44ϑϨʔϜϫʔΫ͸ར༻ͤͣ w

    Α͘࢖͏σβΠϯύʔπ͸ελΠϧΨΠυΛ࡞੒ͯ͠؅ཧ w ϨεϙϯγϒରԠ ͖͔͚ͬɿ$44͍ͬͺ͍͕Μ͹ͬͨϓϩδΣΫτ֓ཁ
  11. ͖͔͚ͬ $44ͷॻ͖ํͳΜ΋Θ͔ΒΜʜ #&.ͬͯͳΜ͡Όʜ ϝσΟΞΫΤϦʜ$44ઃܭʜʁ ͦ͏͍͏ͷ΋͋Δͷ͔ʜ ʙҊ݅ॳظʙ

  12. ͖͔͚ͬ 3BJMTͷίʔυҰߦ΋ॻ͍ͯͶ͑ʜ ͳΜͳΒελΠϧΨΠυ΋׬੒ͯ͠Ͷ͑ʜ ΋ͬͱ͏·͘΍Εͳ͍΋ͷ͔ʜ ʙҊ݅ʹೖͬͯϲ݄ޙʙ

  13. ʙ·͋ͦΜͳ͜ΜͳͰ৭ʑ׬੒ʙ

  14. ͖͔͚ͬ ૝ఆΑΓσβΠϯ·ΘΓʹ޻਺͕ ͔͔ͬͯ͠·ͬͨʜ ख௚͠΋Կ౓΋ൃੜͨ͠͠ʜ ΋ͬͱɺ͍͍ײ͡ʹ͔͚Δํ๏͸ ͳ͍΋ͷ͔ʜ ʙҊ݅ऴྃޙʙ

  15. ͖͔͚ͬ ͓ʜ͜Ε͸ʜ ʙҊ݅ऴྃޙʙ

  16. None
  17. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸ 5BJMXJOE$44͝ଘ஌ͷํɺ৮ͬͨ͜ͱͷ͋Δํ ͲΕ͙Β͍͍Βͬ͠Ό͍·͔͢ʁ

  18. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸ w ϢʔςΟϦςΟϑΝʔετͷ$44ϑϨʔϜϫʔΫ w #PPUTUSBQͷΑ͏ͳίϯϙʔωϯτܥͷΫϥε͸༻ҙ͞Ε͓ͯΒͣɺͦΕͧΕͷ$44ϓϩύςΟͱ ஋ʹରԠͨ͠ɺϢʔςΟϦςΟΫϥε͕ఏڙ͞Ε͍ͯΔ 5BJMXJOE$44ͱ͸

  19. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸

  20. #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ #PPUTUSBQͩͱ

  21. #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ 5BJMXJOE$44ͩͱ

  22. #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ 5BJMXJOE$44ͩͱ

  23. ͪͳΈʹͦͷଞ༗໊ͳ$44ϑϨʔϜϫʔΫͱ ͷൺֱ #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ ଞͷओཁ$44ϑϨʔϜϫʔΫͱͷൺֱ

  24. #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ w #PPUTUSBQ w ط੡඼ʢίϯϙʔωϯτʣ͕ఏڙ͞Ε͍ͯΔ w ϢʔςΟϦςΟ΋ఏڙ͞Ε͍ͯΔ͕ɺ਺͸5BJMXJOE$44΄Ͳଟ͘ͳ͍ w ηϚϯςΟοΫͳDMBTTΛϕʔεʹࢦఆ͢Δ

    w 5BJMXJOE$44 w ίϯϙʔωϯτ͸ఏڙ͞Ε͍ͯͳ͍ w ϢʔςΟϦςΟͷΈ͕ఏڙ͞Ε͓ͯΓɺ΄΅શͯͷ$44ͷϓϩύςΟΛ໢ཏ w ΠϯϥΠϯελΠϧͷΑ͏ͳܗࣜͰDMBTTʢϢʔςΟϦςΟʣΛ෇༩͢Δ
  25. #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ͸ w ֦ுੑ͕ߴ͍ w ࣗલͰελΠϧΛߏங͍ͯͨ͘͠Ίɺ͍ΘΏΔʮ#PPUTUSBQषʯͷ͠ͳ͍ύʔπ͕ ࡞੒Ͱ͖Δ w ෆཁͳελΠϧ͕෇༩͞Εͳ͍ͨΊɺελΠϧͷ্ॻ͖Λ͢Δඞཁ͕ͳ͘ͳΔ w

    Α͘࢖͏ελΠϧ͸ίϯϙʔωϯτͱͯ͠੾Γग़͢ࣄ͕Ͱ͖ɺ࠶ར༻Ͱ͖Δ w ʢͪ͜Βͷػೳ͸͋ͱͰ࣮ྫ͓ݟͤ͠·͢ʣ ϢʔςΟϦςΟϑΝʔετͰ͋Δར఺
  26. ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ͸ ͋Εɺ͡Ό͋ΠϯϥΠϯελΠϧͱԿ͕ҧ͏ͷʁ ͪͳΈʹʮΠϯϥΠϯελΠϧʯͬΆ͍ͱݴ͍·͕ͨ͠ʜ

  27. ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ͸ w IPWFSɺGPDVTͳͲͷΠϕϯτΛઃఆՄೳ w ϝσΟΞΫΤϦΛઃఆՄೳ w TNQYNEQYMHQYYMQY w ϕϯμʔϓϨϑΟΫεͷࢦఆ͕ෆཁ

    ΠϯϥΠϯελΠϧͱͷൺֱ
  28. ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ͸ w XJEUI QBEEJOH DPMPSͳͲʹ͍ͭͯ΋ 5BJMXJOEଆͰఏڙ͞Ε͍ͯΔϢʔςΟ ϦςΟΛར༻͠ɺ෇༩͢Δํࣜ ΠϯϥΠϯελΠϧͱͷൺֱ

  29. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸ w 5BJMXJOE$44ͱ͸ϢʔςΟϦςΟϑΝʔετͷ$44ϑϨʔϜϫʔΫ w ϢʔςΟϦςΟͷΈΛఏڙ͠ɺ w Ϩγϙϯγϒʹهड़Ͱ͖ w ΠϯϥΠϯελΠϧͰίʔσΟϯά͕Մೳͳ֦ுੑͷߴ͍ϑϨʔϜϫʔΫ

    ·ͱΊΔͱ
  30. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸ ʜͰɺ͜Ε͕Ͳ͏ศརͳͷʁ ·ͱΊΔͱ

  31. 5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ͸ ࣮ࡍͷίʔυΛݟͯΈ·͠ΐ͏ ࠓճͷλΠτϧ͸

  32. Ϩʔϧʹ৐ͬͨ$44ίʔσΟϯά 3BJMTʷ5BJMXJOE$44Ͱ

  33. ίʔυ࣮ྫ 5BJMXJOEʷ3BJMT ը໘ڞ༗Λͯ͠ίʔυΛ֬ೝ͍͖ͯ͠·͢ IUUQTHJUIVCDPNLFOZQBSBJMT@PO@UBJMXJOE@DTT

  34. ײ૝ 5BJMXJOEʷ3BJMT w $44ϑΝΠϧΛ࡞ΒͣϏϡʔϑΝΠϧͷΈʹूதͰ͖ΔͨΊૣ࣮͘૷Ͱ͖Δ w طଘελΠϧͷ্ॻ͖΍໊લۭؒͷিಥΛߟ͑ͳͯ͘΋ྑ͍ w $44Λ஌͍ͬͯΕ͹Πϯϓοτ͸ʢଞͷ'8ͱൺ΂ʣ࠷খݶͰࡁΉ w ެࣜ)1ͷݕࡧϖʔδ͕༏ल

    ίʔσΟϯάͨ͠ࡍͷײ૝
  35. ײ૝ 5BJMXJOEʷ3BJMT ैདྷ͸ $44ઃܭ ࣮૷ ࠷ॳʹઃܭ͢Δඞཁ͕͋Γɺ࣮૷͸ͦͷޙ

  36. ײ૝ 5BJMXJOEʷ3BJMT 5BJMXJOE$44ͩͱ $44ઃܭ ࣮૷ $44ઃܭɾ໋໊ͷϑΣʔζΛޙʹ࣋ͬͯ͘Δ͜ͱ͕Ͱ͖Δ

  37. ײ૝ 5BJMXJOEʷ3BJMT w ηϚϯςΟοΫͰ͸ͳ͍ w )5.-ͱ$44͕ີ݁߹ɻDMBTTΛݟͨͱ͖ʹʮͦΕ͕Կͳͷ͔ʯͷ൑ผࠔ೉ w ϐΫηϧύʔϑΣΫτʹ͸ͳΒͳ͍ w 5BJMXJOE͕ఏڙ͍ͯ͠ΔϢʔςΟϦςΟͷ੍໿Λड͚Δ

    w ͦ΋ͦ΋$44͕ॻ͚ͳ͍ͱ࣮૷Ͱ͖ͳ͍ w ίϯϙʔωϯτϕʔεͷ'8ͱҟͳΓɺ$44ͷ஌ࣝ͸.645Ͱඞཁ σϝϦοτ
  38. ײ૝ 5BJMXJOEʷ3BJMT w ಠࣗͷίϯϙʔωϯτ΍ελΠϧ͕ඞཁ w '8Λ֦ு͢ΔΑ͏ͳελΠϧͰ͸ؒʹ߹Θͳ͍έʔε w $44ઃܭʹ஌ݟɾܦݧͷͳ͍։ൃϝϯόʔ͕ຆͲ w ॳ଎Λग़͍ͨ͠ɺ$44ઃܭ͸ޙճ͠ʹ͍ͨ͠

    ͏·͘ϋϚΓͦ͏ͳॴɿྫ͑͹ԼهͷΑ͏ͳϓϩδΣΫτ
  39. ײ૝ 5BJMXJOEʷ3BJMT w ؅ཧը໘΍ࣾ಺޲͚πʔϧͳͲ#PPUTUSBQषͷ͢ΔσβΠϯͰ΋໰୊ͳ͍ ৔߹͸ίϯϙʔωϯτϑΝʔετͷ'8 w ͦΕҎ֎ͷ৔߹͸5BJMXJOE$44Λੵۃతʹ࢖͍͖͍ͬͯͨؾ࣋ͪ ݸਓతʹ͸

  40. ͓ΘΓʹ 5BJMXJOEʷ3BJMT Ϩʔϧʹ৐ͬͨ։ൃΛ͢Δ͜ͱͰ ྑ͍ϓϥΫςΟεʹԊͬͨ։ൃ͕ग़དྷɺ ૉૣ͘Ձ஋Λಧ͚Δ͜ͱ͕Ͱ͖Δ'8 ͱ͜ΖͰ 3BJMT͸$P$ $POWFOUJPO0WFS$POGJHVSBUJPO Λॏࢹͨ͠ϑϨʔϜϫʔΫ IUUQTEIIELSBJMTJTPNBLBTFIUNM

  41. ͓ΘΓʹ 5BJMXJOEʷ3BJMT 5BJMXJOE΋·ͨɺن໿ʹPNBLBTF͢Δ͜ͱͰ Ϩʔϧʹ৐ͬͨ։ൃ͕ग़དྷΔ఺Ͱ͸Ұॹ IUUQTEIIELSBJMTJTPNBLBTFIUNM

  42. ͓ΘΓʹ 5BJMXJOEʷ3BJMT ʮਓྨʹ$44͸ૣ͗ͨ͢ʯͱΑ͘ݴΘΕ·͕͢ ਓྨ͕$44ʹ௥͍ͭͨ͘Ίͷ5BJMXJOE ௥͍෩ Λ ఏڙͯ͘͠ΕΔͷͰ͸ͱʜظ଴͍ͯ͠·͢

  43. ͓ΘΓʹ 5BJMXJOEʷ3BJMT IUUQTUBJMXJOEDTTKBFOUBQBQQ ܥ΁ͷϝδϟʔόʔδϣϯΞοϓ΍ ެࣜαΠτͷ೔ຊޠԽ΋ߦΘΕ͓ͯΓ ࠓͱͯ΋)PUͳϑϨʔϜϫʔΫͰ͢ ؾʹͳΔํ͸ͥͻ͓ࢼ͍ͩ͘͠͞ʂ

  44. ͝ਗ਼ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠