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

2000年頃のフロントエンド技術

 2000年頃のフロントエンド技術

16年でフロントエンド技術はここまで変わった。今の20代はFramesetを知らない。今の30代、40代はテクノロジーが変わりまくるこの危機的状況に気づくべきた。

Tomoyuki Sugita

August 28, 2016
Tweet

More Decks by Tomoyuki Sugita

Other Decks in Technology

Transcript

  1. 2000೥ࠒͷϑϩϯτΤϯυٕज़
    Grand Frontend Osaka 2016࠙਌ձLT
    ΫοΫϏζגࣜձࣾɹਿా஌ࢸ

    View Slide

  2. ࣗݾ঺հ

    View Slide

  3. 5PNPZVLJ
    4VHJUB

    !UPNPUPNPCJMF
    w ΫοΫϏζגࣜձࣾ
    w %FWFMPQNFOUNBOBHFS
    w 3FBDUKTͷνϡʔτϦΞϧ
    ΍Γ·ͨ͠ʂ

    View Slide

  4. How old are
    You?

    View Slide

  5. ୅ʁ
    ୅ʁ
    ୅લ൒ʁ
    ୅ޙ൒ʁ
    ୅Ҏ্ʁ

    View Slide

  6. ୅ʁ
    ୅ʁ
    ୅લ൒ʁ
    ୅ޙ൒ʁ
    ୅Ҏ্ʁ

    View Slide

  7. ϒϥ΢β
    ϔομʔ
    ϝχϡʔ ίϯςϯπ

    View Slide

  8. 2000೥ࠒͷٕज़Ͱ
    ίʔσΟϯάͯ͠Έ·͢

    View Slide

  9. ϚʔΫΞοϓฤ

    View Slide

  10. ࠓͷίʔσΟϯά


    .
    .
    .

    View Slide

  11. 2000೥ࠒͷίʔσΟϯά
    loose.dtd">

    .
    .
    .

    View Slide

  12. 2000೥ࠒͷίʔσΟϯά
    loose.dtd">

    .
    .
    .

    View Slide

  13. 2000೥ࠒͷίʔσΟϯά

    .
    .

    .

    View Slide

  14. ϨΠΞ΢τฤ

    View Slide

  15. ϒϥ΢β
    ϔομʔ
    ϝχϡʔ ίϯςϯπ

    View Slide

  16. ࠓͷϨΠΞ΢τ
    IFBEFS
    OBW EJWJElDPOUFOUTz
    TFDUJPO

    View Slide

  17. 2000೥͝ΖͷϨΠΞ΢τ
    IFBEFSIUNM
    NFOVIUNM JOEFYIUNM
    8FC$PNQPOFOUT͸࢖͍·ͤΜΑ

    View Slide

  18. 2000೥ࠒͷίʔσΟϯά
    frameset.dtd">

    .
    .
    .

    View Slide

  19. 2000೥͝ΖͷϨΠΞ΢τ(վ)
    5%JElIFBEFSz
    5%JE

    lNFOVz
    5%JElDPOUFOUTz

    View Slide

  20. View Slide

  21. DPMTQBO

    View Slide

  22. DPMTQBO
    ίϯςϯπʹΑͬͯԿނ͔ζϨΔ

    View Slide

  23. TQBDFSHJG
    IFJHIUQY
    XJEUIQY
    ಁ໌(*'ը૾
    ͦ͜Ͱొ৔ɾɾɾ

    View Slide

  24. JNHTSDlTQBDFSHJGz

    XJEUIIFJHIU

    View Slide

  25. JNHTSDlTQBDFSHJGz

    XJEUIIFJHIU

    BMUlz
    4&0ؾʹ͢Δ੎

    View Slide

  26. XJEUI XJEUI
    IFJHIU DPMTQBO
    TQBDFSHJGͳ͠ʁ

    View Slide

  27. XJEUI XJEUI
    IFJHIU

    DPMTQBO
    TQBDFS
    HJGͳ
    ͠ʁ

    View Slide

  28. CSS࢖Θͳͯ͘΋
    ϨΠΞ΢τͰ͖Δʂ

    View Slide

  29. ηϯλϦϯάฤ

    View Slide

  30. ϒϥ΢β
    ϔομʔ
    ϝχϡʔ ίϯςϯπ
    ౰ͨΓલ͗ͯ͢࿩୊ʹ͢Β্͕Βͳ͍
    ίϯςφͷηϯλϦϯά

    View Slide

  31. ࠓͷίʔσΟϯά
    div#container {
    margin: 0 auto;
    }

    View Slide

  32. 2000೥ࠒͷίʔσΟϯά


    ...


    View Slide

  33. CSS࢖Θͳͯ͘΋
    ηϯλϦϯάͰ͖Δʂ

    View Slide

  34. ·ͱΊ
    • ࠓͷਓ͸֮͑Δ͜ͱ͕ଟͯ͘େมͩͶʂ
    • Ͱ΋ɺ͋ͷ࣌୅ʹ͸໭Γͨ͘ͳ͍ʂ

    View Slide

  35. αʔόʔαΠυΤϯδχΞืूத
    ΫοΫϏζגࣜձࣾ

    View Slide