Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

ゆく技術_くる技術.pdf

Avatar for IMANISHI TOSHIFUMI IMANISHI TOSHIFUMI
December 19, 2018
Technology
0
270

 ゆく技術_くる技術.pdf

Avatar for IMANISHI TOSHIFUMI

IMANISHI TOSHIFUMI

December 19, 2018
Tweet

More Decks by IMANISHI TOSHIFUMI

See All by IMANISHI TOSHIFUMI
Vue 3 超入門 ー ゆく Vue くる Vue
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
0
180
Form_design_from_Netflix.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
0
140
New_Sass_Module_System.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
2
880
JAMstack_kotohajime.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
0
100
mercurial_nyuumon.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
0
77
Web制作者のためのSassの参考書.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
3
2.8k
裏CSS.pdf
Avatar for IMANISHI TOSHIFUMI toshifumiimanishi
0
120

Other Decks in Technology

See All in Technology
Introduction to Sansan for Engineers / エンジニア向け会社紹介
Avatar for Sansan, Inc. sansan33
PRO
5
47k
useEffectってなんで非推奨みたいなこと言われてるの？
Avatar for マグロ隊長kinTV maguroalternative
9
6.2k
なぜ使われないのか？──定量×定性で見極める本当のボトルネック
Avatar for KAKEHASHI kakehashi
PRO
1
640
MS Ignite 2025で発表されたFoundry IQをRecap
Avatar for Akira Sato satodayo
3
230
シンプルを極める。アンチパターンなDB設計の本質
Avatar for Facilo Inc. facilo_inc
1
990
履歴テーブル、今回はこう作りました 〜 Delegated Types編 〜 / How We Built Our History Table This Time — With Delegated Types
Avatar for moznion moznion
15
9.2k
AI駆動開発によるDDDの実践
Avatar for ディップ株式会社 dip_tech
PRO
0
270
会社紹介資料 / Sansan Company Profile
Avatar for Sansan, Inc. sansan33
PRO
11
390k
【５分でわかる】セーフィー エンジニア向け会社紹介
Avatar for Safie safie_recruit
0
37k
Oracle Cloud Infrastructure：2025年11月度サービス・アップデート
Avatar for oracle4engineer oracle4engineer
PRO
1
110
DGX SparkでローカルLLMをLangChainで動かした話
Avatar for Hirokatsu Endo ruzia
1
250
AI 時代のデータ戦略
Avatar for na0 na0
8
3.2k

Featured

See All Featured
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.5k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.6k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.5k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.3k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
73
11k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
269
13k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
253
22k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.1k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9k

Transcript

  1. Ώٕ͘ज़ɺ͘Δٕज़ Dec 19, 2018 / Toshifumi Imanishi

  2. ͳ͔ͳ͔୤ͤͳ͍K2VFSZ :PV%PO`U/FFEK2VFSZɺ୤K2VFSZ͕ۙ೥࿩୊ʹͳΔɻK2VFSZ͸ɺϒϥ΢βؒͷࠩҟΛ ٵऩ͢ΔɺωΠςΟϒ+BWB4DSJQUΑΓ؆୯ɾָνϯͱ͍͏ཧ༝Ͱଟ͘ͷ։ൃऀ͔Β਌͠ ·Ε͍ͯΔɻ ʲ୤K2VFSZͷओͳཧ༝ʳ w ϒϥ΢βͷਐԽɺ+4ͷ৽ػೳͷ௥Ճ w ػೳཁ݅Λຬͨ͢ͷʹྗྔෆ଍ ͔͠͠ɺK2VFSZΛࣺͯΔ͜ͱ͸Ͱ͖ͳ͍ɻ୹ظϓϩδΣΫτʹ͓͍ͯɺωΠςΟϒ

    +BWB4DSJQU΍7VFKTΑΓ࢖͍׳ΕͨK2VFSZͰ։ൃ͢Δ҆৺ײɻطଘίʔυΛK2VFSZ Ҏ֎Ͱॻ͖׵͑ΔֶशBOE࣌ؒతίετɻ

  3. 7VFKTͷબ୒ࢶ ͍͘ΒK2VFSZ͕༏लͰ΋ۜͷ஄ؙͰ͸ͳ͍ɻͨͱ͑͹ɺ͓໰͍߹ΘͤϑΥʔϜͷ6*Λ࣮૷͢ Δ৔߹ɺΠϕϯτͱ%0.ཁૉΛ௚઀ඥ͚ͮΔΑΓɺঢ়ଶʢTUBUFʣΛڬΜͩ΄͏͕εέʔϥϏ ϦςΟͰ͋Δɻ7VFKTͷϦΞΫςΟϏγεςϜ͸ɺΦϒβʔόʔύλʔϯΛϕʔεʹ࣮૷͞Ε ͍ͯΔͨΊɺʮঢ়ଶͷ؂ࢹʯɺʮมߋݕ஌ʯ΍ʮ%0.ͷࣗಈ൓өʯΛ։ൃऀ͕ҙࣝ͢Δ͜ͱͳ ͘ॲཧ͞ΕΔɻ event event event element

    element element element element element ঢ়ଶ event event event

  4. ঃʑʹ୤K2VFSZͷಓΛ୧Ζ͏ɻઌड़ͨ͠7VFKTΛ࢖༻͢Δ৔߹ɺK2VFSZΑΓωΠςΟϒ +BWB4DSJQUΛར༻࣮ͨ͠૷͕ଟ͘ͳΔͩΖ͏ɻK2VFSZͷϝιουΛωΠςΟϒ+BWB4DSJQUʹ ॻ͖׵͑Δʹ͸ɺͲ͏͢Ε͹Α͍͔ʁ ͦΜͳͱ͖͸ɺ:PV8PO`U/FFEK2VFSZ͕͓͢͢Ίʂ :PV8PO`U/FFEK2VFSZ $('.element').offset(); ? (JU)VCͰެ։தɿIUUQTHJUIVCDPNUPTIJGVNJJNBOJTIJ:PV8POU/FFEK2VFSZ

  5. 9"ͷςϯϓϨʔτΤϯδϯ͸ɺ&+4͕σϑΝΫτελϯμʔυͰ͋Δɻ&+4͸ɺ)5.-ϕʔε ͷߏจΏ͑Մಡੑ͕͋Γɺֶशίετ΋গͳ͘ಋೖෑډͷ௿͍ݴޠͰ͋Δɻ ͔͠͠ɺ&+4Ͱ͸ύϫʔෆ଍Λײ͡Δ͜ͱ͸͋Γ·ͤΜ͔ʁͨͱ͑͹ɺ&+4ʹςϯϓϨʔτܧঝ ͕ඪ४ͰඋΘͬͯ·ͤΜɻ͔ͱ͍ͬͯɺ1VH͸ΠϯσϯτߏจͷͨΊՄಡੑ͕ѱ͍ʢͳΜ͔ؾ࣋ ͪѱ͍ʣɻͰ͸ɺͲ͏͢Δ͔ʜ ৽ͨͳςϯϓϨʔτΤϯδϯͷՄೳੑ ❤ ❤

  6. /VOKVDLTͱ͸ɺ.P[JMMBۘ੡ͷςϯϓϨʔτΤϯδϯͰ͋Δɻ/VOKVDLT͸ɺ)5.-ϕʔε ͷߏจͰςϯϓϨʔτܧঝ͕ඪ४౥ࡌ͞Ε͍ͯΔڧྗͳݴޠͰ͋Δɻ ςϯϓϨʔτܧঝΛར༻͢Δ͜ͱͰɺςϯϓϨʔτͷ࠶ར༻Λ༰қʹ͢Δɻ͜Ε͸ɺ&+4Ͱ๊͑ Δ໰୊ʢ෼ׂ౷࣏ͷ໰୊ʣΛղܾ͢ΔͩΖ͏ɻ/VOKVDLTͷ༗༻ੑ͸ɺ2JJUBͷΞυϕϯτΧ ϨϯμʔͰެ։༧ఆɻ·ͨɺ෼ׂ౷࣏ͷ໰୊͸ྠಡձͷײ૝จʹެ։தɻ /VOKVDLTͷ͢͢Ί ❤

  7. HVMQͷਖ਼ࣜϦϦʔε

  8. HVMQͰԿ͕มΘͬͨͷʁ w+BWB4DSJQUؔ਺ͰλεΫΛFYQPSU wSVOTFRVFODF΍HVMQTPVSDFNBQTͷඪ४౥ࡌ wXBUDIػೳͷڧԽ wMBTU3VO ʹΑΔ࣮ߦ࣌ؒͷ୹ॖ ͍Ζ͍Ζศརʹͳͬͨ

  9. (SJEͷࣗಈ഑ஔΛ*&༻ʹαϙʔτ

  10. ΨϯΨϯ(SJE-BZPVUͰ͍͜͏ʂ *&Ͱࣗಈ഑ஔΛߦ͏৔߹ɺBVUPQSFpYFSͷΦϓγϣϯͰbBVUPQMBDF`ࢦఆ͢ΔPSίʔυ ্ʹ BVUPQSFpYFSHSJEBVUPQMBDF ͱ͍͏ίϝϯτΛهड़͢ΔɻHSJEUFNQMBUF BSFBͱࣗಈ഑ஔ͕*&Ͱ࢖༻Ͱ͖ΔΑ͏ʹͳͬͨࠓɺ$44(SJE-BZPVUΛ࢖Θͳ͍ཧ ༝͕ͳ͍ʂͪͳΈʹ4BGBSJʢݱࡏͷ࠷৽όʔδϣϯ͸ʣͰ͸ɺHBQϓϩύ ςΟ͕ޮ͔ͳ͍ͨΊɺHSJEHBQʢچϓϩύςΟʣͷ྆ํΛهड़͢Δඞཁ͕͋Δɻ˞ͨͩ͠ɺ "VUPQSFpYFSͰิ׬͞Εͳ͍৔߹ʹݶΔɻ

  11. 1SFUUJFSͷ)5.-αϙʔτ

  12. 1SFUUJFSͯԿʁ 1SFUUJFSͱ͸ɺ੔ܗπʔϧͰ͋ΔɻΑ͘-JOUπʔϧͱൺֱ͞ΕΔ͕ɺ-JOU͸ίʔσΟϯά ϧʔϧͷ੔߹ੑΛνΣοΫɺ1SFUUJFS͸Մಡੑͷ޲্Λ໨తͱͨ͠ίʔυ੔ܗΛͦΕͧΕ ୲͍ͬͯΔɻͳͷͰɺ1SFUUJFSͱ-JOUΛ߹Θͤͯ࢖༻͢Δέʔε͕ଟ͍ɻ߹Θͤͯ࢖͏ύλʔ ϯʹ͸ɺͭͷύλʔϯ͕͋ΔɻʢҎ߱ɺ&4-JOUΛྫʹઆ໌͢Δɻʣ 1SFUUJFSͷه๏ϧʔϧΛ&4-JOUͷϧʔϧͱͯ͠ఆٛ͢Δɻ 1SFUUJFSͰ੔ܗͨ͠ίʔυΛAFTMJOUpYAʹύΠϓͰܨ͍Ͱ౉͢ɻ طʹ&4-JOU͕։ൃςϯϓϨʔτʹ૊Έࠐ·Ε͍ͯΔ৔߹ɺΛਪ঑͢Δɻ

  13. )5.-੔ܗͷΧελϚΠζੑ ݱঢ়ɺΦϓγϣϯ͕গͳ͘ΧελϚΠζʹ͚ܽΔɻಛʹ1SJOU8JEUIͱ)5.-8IJUFTQBDF 4FOTJUJWJUZ͸ɺબ୒ͷ༨஍͋Γɻ1SJOU8JEUI͸ɺҰߦͷ࠷େจࣈ਺Λ੍ޚ͢ΔΦϓγϣϯͰ ͋Δɻ1SFUUJFS͸ɺจࣈҎ্ΛՄಡੑͷ͋Δίʔυͱͯ͠ਪ঑͢Δɻ)5.-8IJUFTQBDF 4FOTJUJWJUZ͸ɺΠϯϥΠϯͷෆཁͳۭനΛղܾ͢ΔͨΊͷΦϓγϣϯͰ͋ΔɻͲͪΒͷΦϓγϣ ϯ΋੔ܗޙʹվߦ͕ൃੜ͢ΔͩΖ͏ɻ <link rel="stylesheet" href="https://fonts.googleapis.com/earlyaccess/notosansjp.css" />

    <span class="dolorum atque aspernatur" >Est molestiae sunt facilis qui rem.</span > Print Width ʹΑΔ੔ܗ HTML Whitespace Sensitivity ʹΑΔ੔ܗ

  14. HVMQ΍1SFUUJFSΛ࢖༻ͨ͠ ςϯϓϨʔτΛ(JU)VCʹͯެ։த https://github.com/toshifumiimanishi/website-boilerplate

  15. ·ͱΊ wঃʑʹ୤K2VFSZ͠Α͏ w/VOKVDLTΛ࢖͓͏ wHVMQʹҠߦ͠Α͏ w$44(SJE-BZPVUΛ࢖͓͏ w1SFUUJFSΛ࢖͓͏

  16. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠