ExpressJSでIssueビューアを作ってみた感想

Transcript

1. &YQSFTT+4Ͱ
 *TTVFϏϡʔΞΛ
 ࡞ͬͯΈͨ Χϧςοτίϛϡχέʔγϣϯζɹޙ౻
   लએ
   IJEFOPSJHPUP!HNBJMDPN  Χϧςοτίϛϡχέʔγϣϯζ։ൃ෦
 ࣾ಺ษڧձ

2. ൿ࿩ w +4Ͱ࡞Γ࢝ΊΑ͏ͱ͢Δલʹ΋ΞϨίϨߟ͍͑ͯͨɻ w 1)1ͰϞσϧΛ࣮૷ͨ͜͠ͱ΋͋Δɻ ͳͥɺͦͷ··1)1Ͱ
   ࡞Βͳ͔ͬͨͷ͔ʁ wϞσϧΛ࡞ͬͯ΋ɺཉ͍͠΋ͷʹ͔ۙͮͳ͍
   wΞϓϦͷܗ͕΋΍ͬͱ͍ͯͯ͠ɺͦͷ෦෼ͷϑΟʔυ όοΫ͕ཉ͍͠ͷʹɺҧ͏෦෼͹͔Γʹख͕͔͔Δ

3. &YQSFTT+4ͱ͸ʁ w OPEFKT্ͷɺ8FCαʔόʔαΠυΞϓϦͷͨΊͷϑ ϨʔϜϫʔΫ
   w 1)1Ͱ͍͑͹4JMFYΈ͍ͨͳҹ৅ IUUQFYQSFTTKTDPN

4. &YQSFTT+4ΞϓϦͷॳΊํ w FHHIFBEJPͷνϡʔτϦΞϧ͕ ෼͔Γ΍͍͢
   w IUUQTFHHIFBEJPTFSJFT HFUUJOHTUBSUFEXJUI FYQSFTTKT egghead.ioはJS系のチュートリアルを幅広くカバー。（後藤はProユーザー）

5. &YQSFTT+4ΞϓϦͷॳΊํ # プロジェクトディレクトリ作成
 $ mkdir IssueViewer; cd IssueViewer ! #

   npmパッケージ初期化 $ npm init -y ! # expressインストール $ npm i -S express ! # nodemonインストール $ npm i -D nodemon packages.json

6. &YQSFTT+4ͷίʔυͷྫ index.js

7. ΞϓϦͷ࣮ߦ w IUUQMPDBMIPTU # 開発用アプリサーバー起動
 $ npm run dev この部分に対応

8. *TTVFϏϡʔΞΛ
 ࡞ͬͯΈΔ͜ͱʹͨ͠

9. ࠷ॳʹໝ૝

10. γεςϜશମͷઃܭ +40/Λ
    ͦͷ··
    ϑΝΠϧʹอଘ

11. (JU)VC
    "1* w OQNͰ͍͔ͭ͘Ϟδϡʔϧ͕͋Δ
 IUUQTXXXOQNKTDPNQBDLBHFHJUIVC
    ΛͱΓ ͋͑ͣ࢖ͬͯΈΔ

12. ͭͷϓϩδΣΫτͰߏங "OHVMBS+4༻ίʔυ܈ +40/σʔλ܈ &YQSFTT+4༻ίʔυ܈

13. ಈ࡞͢ΔΞϓϦ %&.0

14. &YQSFTT+4ͷײ૝ w ࠾༻ͨ͠ઃܭʢ+40/Λอଘ͓͚ͯͩ͘͠ʣ͕γϯ ϓϧͩͬͨ఺Λൈ͖ʹͯ͠΋ɺ+40/
    "1*ͷόοΫ ΤϯυΛҰॠͰ࡞ΕΔ͸खܰ
    w ೉͍͜͠ͱΛ΍ΕΔؾ͕͠ͳ͍ɻʢྑ͍ҙຯͰʣׂ Γ੾Γ͕ྑ͍ɻ

15. ࠓճͷ࡞ΓํͰͷؾ͖ͮ w όοΫΤϯυͱϑϩϯτΤϯυΛϓϩδΣΫτͰ࡞Δͷ͸खܰ
    w ͔͠͠ɺόοΫΤϯυ΋ϑϩϯτΤϯυ΋ͲͪΒ΋+4Ͱॻ͍ͯ ͍ΔͱɺࠓԿΛॻ͍͍ͯΔͷ͔ࠞཚ͠΍͍͢ɻ
    w ͓·͚ʹɺόοΫΤϯυʹ΋ϑϩϯτΤϯυʹ΋DPOUSPMMFSͩͱ ͔ϧʔςΟϯάͩͱ͔ςϯϓϨʔτͩͱ͔͕ग़͖ͯͯࠞཚɻ
    w

    +4Ͱ౷Ұ͢Δ৔߹͸ɺόοΫΤϯυͱϑϩϯτΤϯυͷϓϩδΣ ΫτΛ෼͚ͨํ͕͍͍ͷ͔΋ɻ

16. ࠓޙߟ͑ͯߦ͖͍ͨ఺ w ѻ͏ϞϊʹΑͬͯ͸ɺσʔλߏ଄ͷϞσϧ౳ΑΓ΋ɺΞϓϦͷ֎ ଆ͔Βঃʑʹ࡞͍͖͍ͬͯͨࣄ͕͋ΔʢΉ͠Ζͦͷํ͕ଟ͍ʁʣ
    w ͜͏͍͏৔߹ʹɺࠓճͷΑ͏ʹόοΫΤϯυ͸ͬ͘͞Γ༻ҙͯ͠ɺ ϑϩϯτΤϯυ͔Β߈ΊΔΑ͏ͳ΍Γํ͕ͬ͘͠Γ͘Δʢ࡞Γͨ ͍Ϟϊʹରͯ͠ϑΟʔυόοΫ͕ૣ͍ʣ
    w ͔͠͠׬੒౓্͕͕ͬͯߦͬͨޙɺόοΫΤϯυΛ࡞Γ௚͢ͷ͔ɻ

    ͦͷ··࢖͍ଓ͚ΒΕΔͷ͔ɻ͜ͷ෦෼͸ະ஌ɻ

17. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ

18. ࢀߟจݙ w /PEFKT
    W
    "1*
    %PDVNFOUBUJPO
 IUUQTOPEFKTPSHEJTUMBUFTUWYEPDTBQJ
    w &YQSFTT+4
    Y
    "1*
    %PDVNFOUBUJPO
 IUUQFYQSFTTKTDPNFOYBQJIUNM
    w (JU)VC
    "1*
    %PDVNFOUBUJPO
 IUUQTEFWFMPQFSHJUIVCDPNW
    

    w OQN
    HJUIVC
    /PEF+4
    XSBQQFS
    GPS
    UIF
    (JU)VC
    "1* 
 IUUQTXXXOQNKTDPNQBDLBHFHJUIVC