ソースコードを快適に引き継いでいくためにやりたいこと/jtf2021w-f5-hassaku-building-development-environment-with-docker-and-vscode

July Tech Festa 2021 Winter - Session F5

https://techfesta.connpass.com/event/193966/

1. ιʔείʔυΛշదʹҾ͖ܧ͍Ͱ͍ͨ͘Ίʹ ΍Γ͍ͨ͜ͱ @hassaku July Tech Festa 2021 Winter (2021.01.24) #JTF2021w_f - ίϯςφͱ VSCode Λ࢖ͬͯ։ൃ؀ڥΛշదʹ͢Δ -
2. ࠓ೔࿩͍ͨ͜͠ͱ • VSCode ͱίϯςφΛ࢖ͬͯ։ൃ؀ڥΛշదʹ͍ͨ͠ • ϩʔΧϧͰಈ͔ͤΔ։ൃ؀ڥΛखʹೖΕΔ • ͦͷଞɺVSCode ͰೖΕ͍ͯΔઃఆͷ࿩
3. hassaku (twitter: @hassaku_63) Serverworks Co., Ltd. ࣾ಺SE
4. Interested in: • AWS CDK • Serverless • Python • TypeScript
5. ࣮ફ AWS CDK - TypeScript Ͱ Πϯϑϥ΋ΞϓϦ΋ʂ https://booth.pm/ja/items/1881928 2020.03 - 2020.04
 ٕज़ॻయ Ԡԉࡇ (ٕज़ॻయ8)
6. Agenda 1. ॱௐʹҾ͖ܧ͛ͳ͔ͬͨࢥ͍ग़ 2. “ִ཭͞Εͨ” ։ൃ؀ڥ 3. Docker Componse 4. VSCode Remote Container
7. ॱௐʹҾ͖ܧ͛ͳ͔ͬͨࢥ͍ग़ ※લϑϦɻϑΟΫγϣϯͰ͢
8. ͋Δ೔ͷʢՍۭʣ ࣾ಺SE ࠓ೔͔ΒอकΑΖ͘͠Ͷ ػೳվमͱόάใࠂ΋དྷͯΔ͔Β
   ͳΔ͸΍ͰΑΖ͘͠ͶɻͳΔ͸΍Ͱ
9. Կ͔ΒΩϟονΞοϓ͢Δʁ 1. ۓٸੑ·ͨ͸ॏཁ౓ͷߴ͍ Issue ͷ֬ೝ 2. ΞϓϦέʔγϣϯͷ೺Ѳ 1. υΩϡϝϯςʔγϣϯͷॴࡏ 2. ߏ੒ɺιʔεͷཧղ 3. σϓϩΠํ๏ͷ֬ೝ 4. ؂ࢹܥͷ࢓૊Έͷ༗ແ 3. ݕূ؀ڥͷௐୡ
10. ΞϓϦέʔγϣϯͷ೺Ѳ ԿΛ೺Ѳ͢Δ͔ʁ • શମߏ੒ਤ • ґଘؔ܎ʢ֎෦αʔϏεʗύοέʔδʣ • ΞϓϦʗϞδϡʔϧߏ੒ • ओཁͳϢʔεέʔε
11. ΞϓϦέʔγϣϯͷ೺Ѳ Ͳ͏΍ͬͯ೺Ѳ͢Δ͔ʁ • υΩϡϝϯςʔγϣϯͷॴࡏΛ֬ೝ • ιʔεͷ֬ೝ • ϑϨʔϜϫʔΫ౳ͷґଘؔ܎ • σΟϨΫτϦߏ੒ • ݕূ؀ڥΛ༻ҙͯ͠ಈ͔ͯ͠ΈΔ
12. ΞϓϦέʔγϣϯͷ೺Ѳ Ͳ͏΍ͬͯ೺Ѳ͢Δ͔ʁ • υΩϡϝϯςʔγϣϯͷॴࡏΛ֬ೝ • ιʔεͷ֬ೝ • ϑϨʔϜϫʔΫ౳ͷґଘؔ܎ • σΟϨΫτϦߏ੒ • ݕূ؀ڥΛ༻ҙͯ͠ಈ͔ͯ͠ΈΔ
13. ʮಈ͔ͯ͠ΈΔʯ͜ͱͷ೉͠͞ • ͜Ε͕Ͱ͖Δͱ৭ʑḿΔɻ͘͢͝ḿΔ • ಈ࡞ͷΠϝʔδΛ͔ͭΈ΍͍͢ • ڍಈͷ࠶ݱݕূΛ͠΍͘͢ͳΔ • ֎෦Өڹ͕೺ѲͰ͖ͳ͍͏ͪ͸ᷖᮣʹಈ͔ͤͳ͍ • ຊ൪؀ڥͷ֎෦αʔϏεΛݺͼग़ͯ͠͠·͏͔΋ʁ • σʔλετΞͷ໰୊ • ͋Δఔ౓ͷσʔλ͕ͳ͍ͱ࣮ࡍͷڍಈʹ͍ۙಈ࡞͕ݟ͑ͳ͍ • ݕূதʹॻ͖׵͑ͨσʔλͷ෭࡞༻Ͱ࠶ݱੑ͕औΕͳ͘ͳΔ • ্هΛΫϦΞͯ͠΋ɺʮͪΌΜͱʯಈ͔͢·Ͱʹ͸ϋʔυϧ͕͋Δ • ʁʁʁʮಈ͘͸ͣͳͷʹɺͳΜ͔ݟ஌Β͵Τϥʔ͕ग़ͯࢭ·ͬͯ͠·͏ΜͰ͚͢Ͳɾɾɾʯ • ϩʔΧϧPCʹطʹೖ͍ͬͯΔґଘؔ܎ͷ໰୊ɻωΠςΟϒϥΠϒϥϦͳͲ • ్தͰݕূ໨తͰΠϯετʔϧ͍ͯͨ͠ʢຊདྷෆཁͳʣґଘؔ܎ͷ͍ͤͰඍົʹ؀ڥࠩҟ͕͋ͬͨ
14. • ͜Ε͕Ͱ͖Δͱ৭ʑḿΔɻ͘͢͝ḿΔ • ಈ࡞ͷΠϝʔδΛ͔ͭΈ΍͍͢ • ڍಈͷ࠶ݱݕূΛ͠΍͘͢ͳΔ • ֎෦Өڹ͕೺ѲͰ͖ͳ͍͏ͪ͸ᷖᮣʹಈ͔ͤͳ͍ • ຊ൪؀ڥͷ֎෦αʔϏεΛݺͼग़ͯ͠͠·͏͔΋ʁ • σʔλετΞͷ໰୊ • ͋Δఔ౓ͷσʔλ͕ͳ͍ͱ࣮ࡍͷڍಈʹ͍ۙಈ࡞͕ݟ͑ͳ͍ • ݕূதʹॻ͖׵͑ͨσʔλͷ෭࡞༻Ͱ࠶ݱੑ͕औΕͳ͘ͳΔ • ্هΛΫϦΞͯ͠΋ɺʮͪΌΜͱʯಈ͔͢·Ͱʹ͸ϋʔυϧ͕͋Δ • ʁʁʁʮಈ͘͸ͣͳͷʹɺͳΜ͔ݟ஌Β͵Τϥʔ͕ग़ͯࢭ·ͬͯ͠·͏ΜͰ͚͢Ͳɾɾɾʯ • ϩʔΧϧPCʹطʹೖ͍ͬͯΔґଘؔ܎ͷ໰୊ɻωΠςΟϒϥΠϒϥϦͳͲ • ్தͰݕূ໨తͰΠϯετʔϧ͍ͯͨ͠ʢຊདྷෆཁͳʣґଘؔ܎ͷ͍ͤͰඍົʹ؀ڥࠩҟ͕͋ͬͨ ʮಈ͔ͯ͠ΈΔʯ͜ͱͷ೉͠͞ ͜ͷ΁ΜͷਏΈΛίϯςφϕʔεͷ։ൃ؀ڥ
 ʢͱ VSCode Ͱʣܰݮ͍ͨ͠
15. “ִ཭͞Εͨ” ։ൃ؀ڥ
16. ؾ҆͘৮ΕΔ؀ڥ͕΄͍͠ • ֎෦Өڹ͕ͳ͍͜ͱΛ֬৴Ͱ͖Δ͜ͱ • ΞϓϦ͔Βͷ Outbound ੍͕ݶʗېࢭ͞Ε͍ͯΔ • DBͷσʔλ͸ৗʹҰఆͷεφοϓγϣοτΛอ͍ͬͯͯ΄͍͠ • ݕূͷաఔͰมߋͨ͠σʔλ͸Ϧηοτ͍ͨ͠
17. ։ൃ؀ڥͱͯ͠ͷίϯςφ (docker) • ؀ڥͷ࠶ݱੑ • ։ൃ؀ڥʗಈ࡞؀ڥ͸ Dockerfile ʹهड़ͯ͠Ϗϧυ • Կ౓΋࢖͍ࣺͯͰ͖Δ • ϩʔΧϧPCͷ؀ڥࠩҟΛഉআ • DockreHub ͷެࣜΠϝʔδ͕ॆ࣮ • ༗໊Ͳ͜Ζ͸͍͍ͩͨ͋Δ • DBܥͷΠϝʔδ͸ dump ͔ΒॳظσʔλΛऔΓࠐΉํ๏΋αϙʔτ • docker-compose • AP-DB ͷෳ਺ίϯϙʔωϯτͷߏ੒΋ͱΕΔ • N/W पΓͷઃఆ΋ compose ͷઃఆϑΝΠϧͰهड़
18. docker-compose
19. ExampleʢDjango + PostgreSQLʣ $POUBJOFS
    "QQ $POUBJOFS
    %# Host machine Docker #SJHEF
    *' /FUXPSL
    *' Internet access
20. ExampleʢDjango + PostgreSQLʣ $POUBJOFS
    "QQ $POUBJOFS
    %# Host machine Docker #SJHEF
    *' /FUXPSL
    *' Internet access
21. ExampleʢDjango + PostgreSQLʣ $POUBJOFS
    "QQ $POUBJOFS
    %# Host machine Docker #SJHEF
    *' /FUXPSL
    *' Internet access
22. Example σΟϨΫτϦߏ੒ • config … ϓϩδΣΫτ • polls … Django App • Dockerfile … ΞϓϦέʔγϣϯίϯςφ • docker-compose … ݕূ؀ڥ • requirements*.txt … ґଘؔ܎ # project # djnago app dir
23. Example docker-compose.yml • services • db … PostgreSQL • app … Django DevServer • networks • ϒϦοδ & ֎΁ͷ௨৴Λېࢭ
24. Example docker-compose.yml • services • db … PostgreSQL • app … Django DevServer • networks • ϒϦοδ & ֎΁ͷ௨৴Λېࢭ ্ཱͪ͛Δ ίϯςφͷఆٛ
25. Example docker-compose.yml • services • db … PostgreSQL • app … Django DevServer • networks • ϒϦοδ & ֎΁ͷ௨৴Λېࢭ ίϯςφͷ N/W
26. Example - docker-compose docker-compose.yml networks
27. Example - docker-compose docker-compose.yml services.db
28. Example - docker-compose docker-compose.yml services.app command: python3 manage.py \ runserver \ —settings config.settings_local
29. Example - App settings_local.py
30. Example - App settings_local.py • docker-compose.yml ͷઃఆ಺༰ͱ
 ಉ͡΋ͷΛهड़ • DBͷϗετ໊͸ yml Ͱఆٛͨ͠
 αʔϏε໊ (=db) ͰղܾՄೳ
31. Example Django settings settings_local.py • docker-compose.yml ͷઃఆ಺༰ͱ
 ಉ͡΋ͷΛهड़ • DBͷϗετ໊͸ yml Ͱఆٛͨ͠
 αʔϏε໊ (=db) ͰղܾՄೳ
32. Example - Build & Run > docker-compose build > docker-compose up -d > docker-compose ps
33. Tips(1) - DB migration docker-compose exec ίϚϯυͰ migrate ͢Δ > docker-compose exec <service> <command> manage.py migration
34. Tips(1) - DB migration docker-compose exec ίϚϯυͰ migrate ͢Δ > docker-compose exec <service> <command> https://matsuand.github.io/docs.docker.jp.onthefly/compose/reference/exec/ manage.py dbshell
35. Tips(2) - ॳظσʔλ౤ೖ ެࣜΠϝʔδ͕౤ೖํ๏Λఏڙ͍ͯ͠Δ Postgres Ͱ͸ɺ /docker-entrypoint-initdb.d/ ഑Լʹ *.sql ·ͨ͸ *.sql.gz ܗࣜͷμϯϓΛ഑ஔ͓͚ͯ͠͹OK https://hub.docker.com/_/postgres # Initialization scripts
36. Tips(2) - ॳظσʔλ౤ೖ (sample) σΟϨΫτϦߏ੒
37. Tips(2) - ॳظσʔλ౤ೖ (sample) docker-compose.yml ʢൈਮʣ postgres/Dockerfile
38. VSCode - Remote Container
39. Remote Container https://code.visualstudio.com/docs/remote/containers • VSCode ͷ֦ுػೳ • VSCode ্Ͱίϯςφͷ։ൃ؀ڥΛಈ͔ͤΔ
40. ͳʹ͕خ͍͠ʁ • ·ͬ͞Βͳ VM ʹઐ༻ͷ։ൃ؀ڥΛ࡞ͬͯ։ൃͰ͖ΔΠϝʔδ • docker-compose ୯ମͷ৔߹͸ΞϓϦͷ࣮ߦ؀ڥͷΈίϯςφԽ͢Δ • VSCode ্ͷ࣮ߦίϯςΩετίϯςφͷதʹͳΔ • ΤσΟλɺλʔϛφϧͳͲ • VSCode ͷଞͷػೳ͕ซ༻Ͱ͖Δʢ֦ுػೳ΋ؚΉʣ • ίϯςφ্ͷ։ൃ؀ڥͰ΋σόοΨ͕࢖͑ΔΑ͏ʹͳΔ • Linter ΍ Git पลͷ֦ுػೳͳͲ
41. Remote Container ίϚϯυύϨοτ (Ctrl+P) Λ։͍ͯ “Add Development Container …” Λબ୒ ϕʔεʹ͢Δ؀ڥΛબ୒ (Python3 & PostgreSQL)
42. Remote Container ίϯςφ؀ڥΛϏϧυ … Rebuild Container ίϯςφ؀ڥͰ VSCode Λ։͖௚͢
 …Open Workspace in Container
43. Remote Container Remote Container ؔ܎ͷઃఆϑΝΠϧ͕ੜ੒͞ΕΔ # VSCode Remote Container ͷઃఆϑΝΠϧ
44. ↓ ”Dev Container”
45. ↑ ίϯςφ಺ͷ /workspace Ͱλʔϛφϧ͕ىಈ
46. Remote Container Remote Container ؔ܎ͷઃఆϑΝΠϧ͕ੜ੒͞ΕΔ # VSCode Remote Container ͷઃఆϑΝΠϧ ੜ੒͞Ε֤ͨϑΝΠϧͷղઆ ʢVSCode ʹ੾Γସ͑ʣ
47. ༨ஊ όΠϒϧ͕طʹ͋ͬͨ Atsushi Morimoto (@74th) ஶ https://74th.booth.pm/items/2425642
48. ͓ΘΓʹ
49. ·ͱΊ • docker-compose Ͱؾָʹ࡞ΕΔʢյͤΔʣ։ൃ؀ڥΛ
 खʹೖΕΑ͏ • VSCode ͸͍͍ͧ • ࢿྉɺαϯϓϧίʔυ͸ޙ೔ެ։༧ఆʢtwitterʣ • ʢυΩϡϝϯτ΋ॻ͜͏ʣ