TileCloud の開発を支える技術

2019/6/28 (金)に開催された KYOTO.git での LT のスライドです。

Transcript

1. TileCloud ͷ։ൃΛࢧ͑Δٕज़ 2019/06/28@KYOTO.git
 kamata, ryo
2. TileCloud ͱ͸ʁ • ஍ਤϗεςΟϯάαʔϏε • ΢ΣϒαΠτ΍ΞϓϦʹ૊ΈࠐΜͰར༻Ͱ͖·͢ • ஍ਤͷλΠϧͱͦΕΛѻ͏ͨΊͷ JavaScript API Λఏڙ͍ͯ͠·͢ • Φʔϓϯϕʔλʹ޲͚ͯ࡞ۀத
3. ஍ਤͷλΠϧͱ͸ʁ • ϥελʔλΠϧ:
 256 px ࢛ํͷը૾ϑΝΠϧෑ͖٧Ίͯ஍ਤΛදࣔ https://www.openstreetmap.org/copyright OpenStreetMap Contributors
4. ஍ਤͷλΠϧͱ͸ʁ • ϕΫτϧλΠϧ:
 JSON ܗࣜͷ஍෺ͷू·ΓΛόΠφϦʹϑΥʔϚοτͨ͠΋ͷ • ΫϥΠΞϯταΠυʢϒϥ΢βʣͰWebGL Λ࢖ͬͯ஍ਤΛϨ ϯμϦϯά • ϓϩύςΟΛઃఆͯ͠ΫϥΠΞϯ τͰσβΠϯมߋ͕Մೳ
 ʢ3D දࣔͳͲʣ • ๛͔ͳදݱྗ • σʔλ͕ܰྔ
5. TileCloud Λࢼ͢
6. TileCloud Λࢼ͢
7. TileCloud Λࢼ͢ • ެࣜυΩϡϝϯτΛެ։தʂ https://docs.tilecloud.io • Embed API ͱ͍͏ JavaScript API ΋ެ։͍ͯ͠·͢ • HTML Λهड़͢Δ͚ͩͰ஍ਤΛදࣔɾΧελϚΠζͰ ͖·͢ • playground (https://playcode.io/290651) Ͱ؆୯ʹࢼ͢ ͜ͱ΋Ͱ͖·͢
8. TileCloudͷ
 Πϯϑϥߏ੒ɾ։ൃ؀ڥ
9. Serverless • λΠϧ 
 CloudFront + Lambda@Edge + S3 • Embed API (JavaScript API)
 API Gateway + Lambda + DynamoDB • μογϡϘʔυ
 Cognito + API Gateway + Lambda + DynamoDB
10. GitHub • ϦϙδτϦϗεςΟϯά • CI αʔϏε౳ͱͷ࿈ܞʢCircle CIɺ Netlifyʣ NetlifyɾGitHub Pages • σϞαΠτɺμογϡϘʔυɺ੩తϦιʔεͷϗεςΟϯά
11. Circle CI • ίϛοτͷϓογϡʹԠͯࣗ͡ಈςετΛ࣮ߦ • Scheduled job Λ࢖͍ɺ e2e ςετʢEnd to End ςετʣΛఆظ࣮ߦ
 ʢ"ಥવյΕ͍ͯΔ" ঢ়گΛݕग़ʣ
12. Circle CI • CD (Continuous Deployment) • Git λά͕ϓογϡ͞Εͨ࣌͸ຊ൪؀ڥʹσϓϩΠ • master ϒϥϯνͷίϛοτ͕ϓογϡ͞Εͨͱ͖͸։ ൃ؀ڥʹσϓϩΠ • ͦͷଞͷίϛοτ͸ςετͷΈΛ࣮ߦ
13. Circle CI • Circle CI ͷ Workflow Λ׆༻ • ఆٛͨ͠ෳ਺ͷ job ͷ࣮ߦॱ Λ੍ޚ • ෳࡶͳϏϧυͰ΋ɺCI ͷ࣮ߦ ࣌ؒͷංେΛ๷͙ workflows: version: 2 build: jobs: - test: filters: tags: only: /.*/ branches: only: /.*/ - deploy: requires: - build filters: tags: only: /.*/ branches: only: master
14. Φʔτϝʔγϣϯ • GitHub ͱ֤छαʔϏε (CIɾNetlify ͳͲ) ͱͷΠϯςάϨʔγϣϯΛ׆༻ • σϓϩΠɾςετͳͲͷ։ൃ޻ఔΛըҰԽ • CI Λ࢖͍ਝ଎ͳϑΟʔυόοΫΛಘΔ • Πϯϑϥߏ੒ͷࣗಈԽ • Serverless & CloudFormation ༷ʑͳϨΠϠʔͰࣗಈԽΛࢪ͠ɺଐਓԽΛ๷͙