July Tech Festa 2021 Winter - Session F5
https://techfesta.connpass.com/event/193966/
ιʔείʔυΛշదʹҾ͖ܧ͍Ͱ͍ͨ͘ΊʹΓ͍ͨ͜ͱ@hassakuJuly Tech Festa 2021 Winter (2021.01.24) #JTF2021w_f- ίϯςφͱ VSCode Λͬͯ։ൃڥΛշదʹ͢Δ -
View Slide
ࠓ͍ͨ͜͠ͱ• VSCode ͱίϯςφΛͬͯ։ൃڥΛշదʹ͍ͨ͠• ϩʔΧϧͰಈ͔ͤΔ։ൃڥΛखʹೖΕΔ• ͦͷଞɺVSCode ͰೖΕ͍ͯΔઃఆͷ
hassaku (twitter: @hassaku_63)Serverworks Co., Ltd.ࣾSE
Interested in:• AWS CDK• Serverless• Python• TypeScript
࣮ફ AWS CDK - TypeScript ͰΠϯϑϥΞϓϦʂhttps://booth.pm/ja/items/18819282020.03 - 2020.04 ٕज़ॻయ Ԡԉࡇ (ٕज़ॻయ8)
Agenda1. ॱௐʹҾ͖ܧ͛ͳ͔ͬͨࢥ͍ग़2. “ִ͞Εͨ” ։ൃڥ3. Docker Componse4. VSCode Remote Container
ॱௐʹҾ͖ܧ͛ͳ͔ͬͨࢥ͍ग़※લϑϦɻϑΟΫγϣϯͰ͢
͋ΔͷʢՍۭʣࣾSEࠓ͔ΒอकΑΖ͘͠ͶػೳվमͱόάใࠂདྷͯΔ͔ΒͳΔͰΑΖ͘͠ͶɻͳΔͰ
Կ͔ΒΩϟονΞοϓ͢Δʁ1. ۓٸੑ·ͨॏཁͷߴ͍ Issue ͷ֬ೝ2. ΞϓϦέʔγϣϯͷѲ1. υΩϡϝϯςʔγϣϯͷॴࡏ2. ߏɺιʔεͷཧղ3. σϓϩΠํ๏ͷ֬ೝ4. ࢹܥͷΈͷ༗ແ3. ݕূڥͷௐୡ
ΞϓϦέʔγϣϯͷѲԿΛѲ͢Δ͔ʁ• શମߏਤ• ґଘؔʢ֎෦αʔϏεʗύοέʔδʣ• ΞϓϦʗϞδϡʔϧߏ• ओཁͳϢʔεέʔε
ΞϓϦέʔγϣϯͷѲͲ͏ͬͯѲ͢Δ͔ʁ• υΩϡϝϯςʔγϣϯͷॴࡏΛ֬ೝ• ιʔεͷ֬ೝ• ϑϨʔϜϫʔΫͷґଘؔ• σΟϨΫτϦߏ• ݕূڥΛ༻ҙͯ͠ಈ͔ͯ͠ΈΔ
ʮಈ͔ͯ͠ΈΔʯ͜ͱͷ͠͞• ͜Ε͕Ͱ͖Δͱ৭ʑḿΔɻ͘͢͝ḿΔ• ಈ࡞ͷΠϝʔδΛ͔ͭΈ͍͢• ڍಈͷ࠶ݱݕূΛ͘͢͠ͳΔ• ֎෦Өڹ͕ѲͰ͖ͳ͍͏ͪᷖᮣʹಈ͔ͤͳ͍• ຊ൪ڥͷ֎෦αʔϏεΛݺͼग़ͯ͠͠·͏͔ʁ• σʔλετΞͷ• ͋Δఔͷσʔλ͕ͳ͍ͱ࣮ࡍͷڍಈʹ͍ۙಈ࡞͕ݟ͑ͳ͍• ݕূதʹॻ͖͑ͨσʔλͷ෭࡞༻Ͱ࠶ݱੑ͕औΕͳ͘ͳΔ• ্هΛΫϦΞͯ͠ɺʮͪΌΜͱʯಈ͔͢·Ͱʹϋʔυϧ͕͋Δ• ʁʁʁʮಈͣ͘ͳͷʹɺͳΜ͔ݟΒ͵Τϥʔ͕ग़ͯࢭ·ͬͯ͠·͏ΜͰ͚͢Ͳɾɾɾʯ• ϩʔΧϧPCʹطʹೖ͍ͬͯΔґଘؔͷɻωΠςΟϒϥΠϒϥϦͳͲ• ్தͰݕূతͰΠϯετʔϧ͍ͯͨ͠ʢຊདྷෆཁͳʣґଘؔͷ͍ͤͰඍົʹڥࠩҟ͕͋ͬͨ
• ͜Ε͕Ͱ͖Δͱ৭ʑḿΔɻ͘͢͝ḿΔ• ಈ࡞ͷΠϝʔδΛ͔ͭΈ͍͢• ڍಈͷ࠶ݱݕূΛ͘͢͠ͳΔ• ֎෦Өڹ͕ѲͰ͖ͳ͍͏ͪᷖᮣʹಈ͔ͤͳ͍• ຊ൪ڥͷ֎෦αʔϏεΛݺͼग़ͯ͠͠·͏͔ʁ• σʔλετΞͷ• ͋Δఔͷσʔλ͕ͳ͍ͱ࣮ࡍͷڍಈʹ͍ۙಈ࡞͕ݟ͑ͳ͍• ݕূதʹॻ͖͑ͨσʔλͷ෭࡞༻Ͱ࠶ݱੑ͕औΕͳ͘ͳΔ• ্هΛΫϦΞͯ͠ɺʮͪΌΜͱʯಈ͔͢·Ͱʹϋʔυϧ͕͋Δ• ʁʁʁʮಈͣ͘ͳͷʹɺͳΜ͔ݟΒ͵Τϥʔ͕ग़ͯࢭ·ͬͯ͠·͏ΜͰ͚͢Ͳɾɾɾʯ• ϩʔΧϧPCʹطʹೖ͍ͬͯΔґଘؔͷɻωΠςΟϒϥΠϒϥϦͳͲ• ్தͰݕূతͰΠϯετʔϧ͍ͯͨ͠ʢຊདྷෆཁͳʣґଘؔͷ͍ͤͰඍົʹڥࠩҟ͕͋ͬͨʮಈ͔ͯ͠ΈΔʯ͜ͱͷ͜͠͞ͷΜͷਏΈΛίϯςφϕʔεͷ։ൃڥ ʢͱ VSCode Ͱʣܰݮ͍ͨ͠
“ִ͞Εͨ” ։ൃڥ
ؾ҆͘৮ΕΔڥ͕΄͍͠• ֎෦Өڹ͕ͳ͍͜ͱΛ֬৴Ͱ͖Δ͜ͱ• ΞϓϦ͔Βͷ Outbound ੍͕ݶʗېࢭ͞Ε͍ͯΔ• DBͷσʔλৗʹҰఆͷεφοϓγϣοτΛอ͍ͬͯͯ΄͍͠• ݕূͷաఔͰมߋͨ͠σʔλϦηοτ͍ͨ͠
։ൃڥͱͯ͠ͷίϯςφ (docker)• ڥͷ࠶ݱੑ• ։ൃڥʗಈ࡞ڥ Dockerfile ʹهड़ͯ͠Ϗϧυ• Կ͍ࣺͯͰ͖Δ• ϩʔΧϧPCͷڥࠩҟΛഉআ• DockreHub ͷެࣜΠϝʔδ͕ॆ࣮• ༗໊Ͳ͜Ζ͍͍ͩͨ͋Δ• DBܥͷΠϝʔδ dump ͔ΒॳظσʔλΛऔΓࠐΉํ๏αϙʔτ• docker-compose• AP-DB ͷෳίϯϙʔωϯτͷߏͱΕΔ• N/W पΓͷઃఆ compose ͷઃఆϑΝΠϧͰهड़
docker-compose
ExampleʢDjango + PostgreSQLʣ$POUBJOFS"QQ$POUBJOFS%#Host machine Docker#SJHEF*'/FUXPSL*'Internetaccess
ExampleσΟϨΫτϦߏ• config … ϓϩδΣΫτ• polls … Django App• Dockerfile … ΞϓϦέʔγϣϯίϯςφ• docker-compose … ݕূڥ• requirements*.txt … ґଘؔ# project# djnago app dir
Exampledocker-compose.yml• services• db … PostgreSQL• app … Django DevServer• networks• ϒϦοδ & ֎ͷ௨৴Λېࢭ
Exampledocker-compose.yml• services• db … PostgreSQL• app … Django DevServer• networks• ϒϦοδ & ֎ͷ௨৴Λېࢭ্ཱͪ͛Δίϯςφͷఆٛ
Exampledocker-compose.yml• services• db … PostgreSQL• app … Django DevServer• networks• ϒϦοδ & ֎ͷ௨৴Λېࢭίϯςφͷ N/W
Example - docker-composedocker-compose.ymlnetworks
Example - docker-composedocker-compose.ymlservices.db
Example - docker-composedocker-compose.ymlservices.appcommand:python3 manage.py \runserver \—settings config.settings_local
Example - Appsettings_local.py
Example - Appsettings_local.py• docker-compose.yml ͷઃఆ༰ͱ ಉ͡ͷΛهड़• DBͷϗετ໊ yml Ͱఆٛͨ͠ αʔϏε໊ (=db) ͰղܾՄೳ
ExampleDjango settingssettings_local.py• docker-compose.yml ͷઃఆ༰ͱ ಉ͡ͷΛهड़• DBͷϗετ໊ yml Ͱఆٛͨ͠ αʔϏε໊ (=db) ͰղܾՄೳ
Example - Build & Run> docker-compose build> docker-compose up -d> docker-compose ps
Tips(1) - DB migrationdocker-compose exec ίϚϯυͰ migrate ͢Δ> docker-compose exec manage.py migration
Tips(1) - DB migrationdocker-compose exec ίϚϯυͰ migrate ͢Δ> docker-compose exec https://matsuand.github.io/docs.docker.jp.onthefly/compose/reference/exec/manage.py dbshell
Tips(2) - ॳظσʔλೖެࣜΠϝʔδ͕ೖํ๏Λఏڙ͍ͯ͠ΔPostgres Ͱɺ /docker-entrypoint-initdb.d/ Լʹ*.sql ·ͨ *.sql.gz ܗࣜͷμϯϓΛஔ͓͚ͯ͠OKhttps://hub.docker.com/_/postgres# Initialization scripts
Tips(2) - ॳظσʔλೖ (sample)σΟϨΫτϦߏ
Tips(2) - ॳظσʔλೖ (sample)docker-compose.yml ʢൈਮʣpostgres/Dockerfile
VSCode - Remote Container
Remote Containerhttps://code.visualstudio.com/docs/remote/containers• VSCode ͷ֦ுػೳ• VSCode ্Ͱίϯςφͷ։ൃڥΛಈ͔ͤΔ
ͳʹ͕خ͍͠ʁ• ·ͬ͞Βͳ VM ʹઐ༻ͷ։ൃڥΛ࡞ͬͯ։ൃͰ͖ΔΠϝʔδ• docker-compose ୯ମͷ߹ΞϓϦͷ࣮ߦڥͷΈίϯςφԽ͢Δ• VSCode ্ͷ࣮ߦίϯςΩετίϯςφͷதʹͳΔ• ΤσΟλɺλʔϛφϧͳͲ• VSCode ͷଞͷػೳ͕ซ༻Ͱ͖Δʢ֦ுػೳؚΉʣ• ίϯςφ্ͷ։ൃڥͰσόοΨ͕͑ΔΑ͏ʹͳΔ• Linter Git पลͷ֦ுػೳͳͲ
Remote ContainerίϚϯυύϨοτ (Ctrl+P) Λ։͍ͯ “Add Development Container …” Λબϕʔεʹ͢ΔڥΛબ (Python3 & PostgreSQL)
Remote ContainerίϯςφڥΛϏϧυ … Rebuild ContainerίϯςφڥͰ VSCode Λ։͖͢ …Open Workspace in Container
Remote ContainerRemote Container ؔͷઃఆϑΝΠϧ͕ੜ͞ΕΔ# VSCode Remote Container ͷઃఆϑΝΠϧ
↓ ”Dev Container”
↑ ίϯςφͷ /workspace Ͱλʔϛφϧ͕ىಈ
Remote ContainerRemote Container ؔͷઃఆϑΝΠϧ͕ੜ͞ΕΔ# VSCode Remote Container ͷઃఆϑΝΠϧੜ͞Ε֤ͨϑΝΠϧͷղઆʢVSCode ʹΓସ͑ʣ
༨ஊόΠϒϧ͕طʹ͋ͬͨAtsushi Morimoto (@74th) ஶhttps://74th.booth.pm/items/2425642
͓ΘΓʹ
·ͱΊ• docker-compose Ͱؾָʹ࡞ΕΔʢյͤΔʣ։ൃڥΛ खʹೖΕΑ͏• VSCode ͍͍ͧ• ࢿྉɺαϯϓϧίʔυޙެ։༧ఆʢtwitterʣ• ʢυΩϡϝϯτॻ͜͏ʣ
hassaku63
hcrane
y0gi
nagworld
a4lg
yuya4
mitchan
yuuu
akkeylab
usamik26
maroon1st
yuhei_fujita
sasakendayo
chriscoyier
reverentgeek
samlambert
productmarketing
trishagee
mthomps
soudai
zakiyama
caitiem20
sonatard
lara