Skip to content

Week4 Sprint

LeeYeonJu edited this page Nov 12, 2020 · 1 revision

์Šคํ”„๋ฆฐํŠธ ํšŒ์˜ ๋กœ๊ทธ

์Šคํ”„๋ฆฐํŠธ ๋ชฉํ‘œ ๐Ÿˆ

  • ์‹ค์‹œ๊ฐ„ ์˜์‚ฌ์†Œํ†ต

    • FE : WebRTC ๋ถ€๋ถ„ View ํ‹€์žก๊ธฐ, ์‚ฌ์šฉ์ž๊ฐ€ ๋‚˜๊ฐ”์„ ๋•Œ black screen ๋ฌธ์ œ ํ•ด๊ฒฐ.(๊ณฝ๋ณ‘์„ )
    • BE : nginx์—์„œ https ํ†ต์‹  ๊ตฌํ˜„, api์ž‘์„ฑํ•˜๊ธฐ
    • ๊ณตํ†ต : WebRTC, Chat๊ณผ ํ•ฉ์น˜๊ธฐ(๊ณฝ๋ณ‘์„ )
  • ๊ณต๋™ ๋ฌธ์„œ ํŽธ์ง‘

    • webRTC, chat๊ณผ ํ•ฉ์น˜๊ธฐ
  • ๋ฌธ์„œ ๊ด€๋ฆฌ

    • ํŒ€๊ณผ ํ•ฉ์น˜๊ธฐ
    • JWT์— ๋Œ€ํ•œ ๊ณต๋ถ€ ๋ฐ secret key๋กœ ์ธ์ฆ ๊ธฐ๋Šฅ ๊ตฌํ˜„ํ•˜๊ธฐ
  • ํŒ€ ๋ฐ ํŒ€์› ๊ด€๋ฆฌ

    • ec2 ์˜ฌ๋ฆฌ๊ธฐ
    • client์— ํ•ฉ์น˜๊ธฐ
  • ์ธ์ฆ ๋ฐ ์‚ฌ์šฉ์ž ๊ด€๋ฆฌ

    • google ๋กœ๊ทธ์ธ ๊ตฌํ˜„
    • jwt ์ €์žฅ ํ›„ client์—๊ฒŒ cookie๋กœ ์ „์†ก
  • ์›Œํฌ์ŠคํŽ˜์ด์Šค

  • ๋ฌธ์„œ api ํ•ฉ์น˜๊ธฐ

  • ํŒ€ api ํ•ฉ์น˜๊ธฐ

  • ์ค‘๊ฐ„๋ฐœํ‘œ ์ค€๋น„(๊ณฝ๋ณ‘์„ )

์Šคํ”„๋ฆฐํŠธ ๋‹จ์œ„ ๐Ÿ—“

  • 6์ผ

์Šคํฌ๋Ÿผ ๋งˆ์Šคํ„ฐ ๐Ÿ‘จโ€๐Ÿ”ง

ํšŒ์˜ ๋‚ด์šฉ ๐Ÿ’ฌ

  • todo๋ฅผ ์ „๋ฐ˜์ ์œผ๋กœ ์ญˆ์šฑ ์ž‘์„ฑํ•˜์˜€๊ณ , todo๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ์ฃผ์ฐจ๋ณ„๋กœ ๊ณ„ํšํ•˜์—ฌ ์ง„ํ–‰ํ•˜๊ธฐ๋กœ ํ•˜์˜€๋‹ค.(WBS ์—…๋ฐ์ดํŠธ ์™„๋ฃŒ)


์Šคํ”„๋ฆฐํŠธ ํšŒ๊ณ  ๋กœ๊ทธ

์ฃผ๊ฐ„ ํšŒ๊ณ  ๋‚ด์šฉ ๐Ÿ’ฌ

  • ๊ณฝ๋ณ‘์„ 

    • WebRTC ์ž˜ํ•œ๊ฒƒ

      • Video on/off ๋ฒ„ํŠผ ๊ธฐ๋Šฅ ์™„์„ฑ
      • MIC on/off ๋ฒ„ํŠผ ๊ธฐ๋Šฅ ์™„์„ฑ
      • Chat๊ณผ WebRTC client ๋ถ€๋ถ„ merge
      • develop์— merge
    • ๋ณด์ถฉํ•  ๊ฒƒ + ์•„์‰ฌ์šด ๊ฒƒ

      • View ๊ตฌํ˜„ํ•˜๊ธฐ (CSS)
      • ์‚ฌ์šฉ์ž๊ฐ€ ๋‚˜๊ฐ”์„ ๋•Œ black screen ์œ ์ง€๋˜๋Š” ํ˜„์ƒ ์ œ๊ฑฐํ•˜๊ธฐ.
  • ์ด์—ฐ์ฃผ node.js + express๋กœ ํ•™๊ต ์›น์‹œ์Šคํ…œ์„ค๊ณ„ ๋•Œ ์ž ์‹œํ–ˆ๋˜ ๊ฒฝํ—˜์„ ์‚ด๋ ค ํŒ€๊ด€๋ฆฌ, ์ธ์ฆ์„œ๋น„์Šค ๊ฐœ๋ฐœ์— ๋„์ „ํ•ด๋ณด์•˜๋‹ค.

    • ์ž˜ํ•œ ์ 

      • express-team ํด๋” ๊ตฌ์กฐํ™” (routes/controller/middleware/service/models/utils) spring boot์ฒ˜๋Ÿผ ํŠน์ • ํŒจํ„ด์— ๋”ฐ๋ผ ํŠน์ • ์‚ฌ์šฉ์„ฑ์— ๋”ฐ๋ผ ์ฝ”๋“œ๋ฅผ ๋ถ„๋ฆฌํ•˜์—ฌ ๊น”๋”ํ•˜๊ฒŒ ์ž‘์„ฑํ•ด๋ณด๊ณ  ์‹ถ์—ˆ๋‹ค. ๊ทธ๋ž˜์„œ ์—ฌ๋Ÿฌ ์‚ฌ๋žŒ์˜ github๋ฅผ ํƒ๋ฐฉํ–ˆ๋˜ ๊ฒƒ ๊ฐ™๋‹ค.
      • express-validator ์ ์šฉ controller์— ์žˆ๋Š” ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ ์ฒ˜๋ฆฌํ•˜๊ธฐ ์ „์— request ํ˜•์‹์ด ์˜ณ์€์ง€ ๋ฏธ๋ฆฌ ์ฒดํฌํ•  ์ˆ˜ ์žˆ์„๊นŒ๋ผ๋Š” ์ƒ๊ฐ์„ ํ–ˆ๋‹ค. schema์— ๋Œ€ํ•ด ์ฒดํฌํ•˜๋Š” joi ํ•จ์ˆ˜๋„ ์žˆ๋˜ ๋ฐ ์‹œ๊ฐ„๋˜๋ฉด ์ ์šฉํ•˜๋ฉด ์ข‹์„ ๊ฒƒ ๊ฐ™๋‹ค.
      • wiki์— architecture ๊ณผ์ • ๊ธฐ๋ก ์ดˆ๋ฐ˜ ์•„ํ‚คํ…์ฒ˜๋ฅผ ์ง„ํ–‰ํ•˜๊ณ  ์ด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ์ œ์•ˆํ–ˆ๋˜ ์•„ํ‚คํ…์ฒ˜์— ๋Œ€ํ•ด์„œ ์™œ ๋‚ด๊ฐ€ ๊ทธ๋ ‡๊ฒŒ ์ง„ํ–‰ํ–ˆ๋Š”์ง€์— ๋Œ€ํ•ด์„œ ๋ณต๊ธฐํ•˜๊ณ  ์ž‘์„ฑํ–ˆ๋‹ค.
    • ์•„์‰ฌ์šด ์ 

      • express ๊ฐœ๋ฐœ์— ์•„์ง ์ต์ˆ™์ง€ ์•Š์•„ ํŠน์ •์ƒํ™ฉ์— ํ•„์š”ํ•œ ๋ชจ๋“ˆ(์˜ˆ๋ฅผ ๋“ค๋ฉด body-parser)์„ ์ฐพ์•„ ์“ฐ์ง€ ๋ชปํ•ด ๊ฒ€์ƒ‰ํ•˜๋Š๋ผ ์‹œ๊ฐ„์ด ๋Šฆ์–ด์กŒ๋‹ค.
      • google plus๋ฅผ ๋” ์ด์ƒ ์ง€์›ํ•˜์ง€ ์•Š๋Š” ๋‹ค๋Š” ๊ฒƒ์„ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค. ์ด๋ฒˆ ์ฃผ์— google ๋กœ๊ทธ์ธ ๋ฐ jwt ๋ฐœ๊ธ‰ํ•˜๋Š” ๊ฒƒ์„ ๋ชฉํ‘œ๋กœ ํ–ˆ์ง€๋งŒ ์™„์„ฑํ•˜์ง€ ๋ชปํ–ˆ๋‹ค.
  • ์ •์†Œ์˜

    • ๊ธฐ๋ณธ์ ์ธ CRUD์—์„œ ํ•˜๋‚˜์”ฉ ๊ธฐ๋Šฅ์„ ๋ถ™์—ฌ๋‚˜๊ฐ”๊ณ  ์™„์„ฑ์ด ๋˜์—ˆ๋‹ค.
    • ํ…Œ์ŠคํŠธ ์ฝ”๋“œ๋ฅผ ์“ฐ๋ฉด ๋‹จ์ˆœํžˆ ๋‹จ์œ„ํ…Œ์ŠคํŠธ์—๋งŒ ์ข‹์€ ๊ฒƒ์ด ์•„๋‹ˆ๊ณ  ๋‚˜์ค‘์— CI๋ฅผ ํ•  ๋•Œ ํ•„์š”ํ•˜๋‹ค๋Š” ๊ฒƒ์„ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค.
    • ๊ตฌ๊ธ€๋ง ํ•˜๋ฉด ์ž๋ฃŒ์™€ ์˜ˆ์‹œ๊ฐ€ ๋งŽ์ง€๋งŒ, ๋‚ด ์ƒํ™ฉ๊ณผ ์•„์ฃผ ๋˜‘๊ฐ™์€ ๊ฒƒ์€ ์—†๊ธฐ ๋•Œ๋ฌธ์— ์ž˜ ์กฐํ•ฉํ•˜๊ณ  ๊ธฐ๋ณธ ๊ฐœ๋…์„ ์ตํžˆ๋Š” ๊ฒƒ์˜ ์ค‘์š”์„ฑ์„ ๋Š๊ผˆ๋‹ค.
  • ์กฐ์„ฑ์›

    • ๋ณ‘์„ ์ดํ˜•๊ณผ ์ง ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ํ•ด์„œ webRTC์˜ ๋งˆ์ดํฌ, ๋น„๋””์˜ค on/off๋ฅผ ๊ตฌํ˜„ํ–ˆ๋‹ค.
    • yjs๋ฅผ ์ด์šฉํ•œ ํ”Œ์ ์„ ์‚ดํŽด๋ดค๋Š”๋ฐ cattaz ๋ผ๋Š” ์‚ฌ์ดํŠธ๊ฐ€ ์šฐ๋ฆฌ๊ฐ€ ์›ํ•˜๋Š” ๊ธฐ๋Šฅ๋“ค์„ ๊ตฌํ˜„ํ•ด๋†“์•„์„œ ์ฝ”๋“œ๋ฅผ ๋ถ„์„ ๋ฐ ์ ์šฉํ•˜๊ณ  ์žˆ๋‹ค.
  • ํ•˜ํƒœ๋ฆฐ

    • ec2์—์„œ https๊ฐ„ ํ†ต์‹  ๊ตฌํ˜„์— ์„ฑ๊ณตํ–ˆ๋‹ค. ์—„์ฒญ ๊ฐ„๋‹จํ•œ ๋ฌธ์ œ์˜€๋Š”๋ฐ ๋‚ด๊ฐ€ ๋„ˆ๋ฌด ๋ณต์žกํ•˜๊ฒŒ ์ƒ๊ฐํ•˜๊ณ  ์žˆ์—ˆ๋‹ค. ec2์—์„œ๋งŒ ํฌํŠธ๋ฅผ ์—ด์–ด์ฃผ๋ฉด ๋œ๋‹ค๊ณ  ์ƒ๊ฐํ–ˆ๋Š”๋ฐ nginx์—์„œ๋„ ํฌํŠธ๋ฅผ ์—ด์–ด์ค˜์•ผํ–ˆ๋‹ค.
    • ๋‚ด๊ฐ€ ๋งก์€ ๋ถ€๋ถ„์˜ ๊ธฐ๋Šฅ๊ตฌํ˜„ ๋ฐ ํ†ต์‹ ์€ ์ด์ œ ์™„์ „ํžˆ ๋๋‚ฌ๋‹ค. ์–ผ๋ฅธ ๋ฐฐํฌ๋ฅผ ๋งก์•„ ๋„์ปค์™€ ์ฟ ๋ฒ„๋„คํ‹ฐ์Šค๊นŒ์ง€ ๋งˆ๋ฌด๋ฆฌํ•ด์•ผ๊ฒ ๋‹ค.

์ž˜ํ–ˆ์œผ๋ฉฐ ์•ž์œผ๋กœ ๊ณ„์†ํ•  ์ผ ๐Ÿ€

  • ๊ณฝ๋ณ‘์„ 

    • WebRTC ๋ถ€๋ถ„์ด ๊ฑฐ์˜ ์™„์„ฑ ์ง์ „์ด๊ธด ํ•˜์ง€๋งŒ ๋ฐฉ์‹ฌํ•˜๋ฉด ์•ˆ๋œ๋‹ค. ์–ธ์ œ ์–ด๋””์„œ ๋””๋ฒ„๊น…์„ ํ•ด์•ผํ•  ์ง€ ๋ชจ๋ฅธ๋‹ค. ๊ทธ๋ž˜๋„ ๊ธ์ •์ ์ธ ๋งˆ์ธ๋“œ๋กœ, ํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ƒ๊ฐ์œผ๋กœ ์ง„ํ–‰ํ•ด์•ผํ•œ๋‹ค.
  • ์ด์—ฐ์ฃผ

    • ํด๋ฆฐ ์ฝ”๋“œ์™€ ๋””์ž์ธ ํŒจํ„ด์— ๊ด€์‹ฌ์ด ์žˆ์—ˆ๋Š”๋ฐ ์ด๋ฅผ ๊ฐœ๋ฐœํ•˜๋ฉด์„œ ์ ์šฉํ•ด๋ณด๋ ค๊ณ  ์—ฌ๊ธฐ์ €๊ธฐ ์ฐพ์•„๋ดค๋‹ค. ํ˜ผ์ž์„œ ์ฐพ์•„๋ณด๊ณ  ์ ์šฉํ•˜๋Š๋ผ ์ด๊ฒŒ ๋งž๋‚˜ ์‹ถ๊ธฐ๋„ ํ–ˆ์ง€๋งŒ ์ฃผ๊ด€์„ ๊ฐ€์ง€๊ณ  ํŒŒ์ผ์„ ๊ตฌ์กฐํ™”ํ•ด๋ณด์•˜๋‹ค.
  • ์ •์†Œ์˜

    • ํƒ€์ธ์—๊ฒŒ ์งˆ๋ฌธํ•˜๊ธฐ ์ „์— ์Šค์Šค๋กœ ์•Œ์•„๋ณด๋ฉฐ ๋ฐฐ์›Œ๊ฐ€๋‹ˆ ์ถ”ํ›„ ์งˆ๋ฌธํ•  ๋•Œ๋„ ์–ป๋Š” ๊ฒƒ์ด ๋งŽ์•˜๋‹ค. ์•ž์œผ๋กœ ์—ฌ๋Ÿฌ ์ž๋ฃŒ๋ฅผ ๋ณด๋Š”๋ฐ ๋‘๋ ค์›Œํ•˜์ง€๋ง์ž.
  • ์กฐ์„ฑ์›

    • cattaz์˜ ํด๋ž˜์Šคํ˜• ์ปดํฌ๋„ŒํŠธ๋“ค์„ ํ•จ์ˆ˜ํ˜•์œผ๋กœ ๋ฐ”๊ฟ”๊ฐ€๋ฉฐ ์šฐ๋ฆฌ ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•˜๊ณ ์žˆ๋‹ค. ์กฐ๊ธˆ๋งŒ ์‹œ๊ฐ„ํˆฌ์ž๋ฅผ ํ•˜๋ฉด ์šฐ๋ฆฌ๊ฐ€ ์›ํ•˜๋Š” ๊ธฐ๋Šฅ์„ ๊ฐ€์ ธ์˜ฌ ์ˆ˜ ์žˆ์„ ๊ฒƒ ๊ฐ™๋‹ค.
  • ํ•˜ํƒœ๋ฆฐ

    • ํ˜ผ์ž ๋งŽ์ด ์‚ฝ์งˆํ•ด๋ณธ ๊ฒฝํ—˜์ด ๋„์›€์ด ๋˜์—ˆ๋‹ค. ๋•๋ถ„์— ์„ค๋ช…์„ ๋“ค์–ด๋„ ๋ฐ”๋กœ ์•Œ์•„๋“ค์„ ์ˆ˜ ์žˆ์—ˆ๋‹ค.
    • ec2 - docker - k8s - CI์ž๋™ํ™” ์ด๋ ‡๊ฒŒ ์ฐจ๊ทผ์ฐจ๊ทผ ํ•ด์•ผ๊ฒ ๋‹ค๊ณ  ๋งˆ์Œ๋จน์—ˆ๋˜ ๋ถ€๋ถ„์ด ์ž˜ํ•œ๊ฒƒ ๊ฐ™๋‹ค. ๋งŒ์•ฝ์— ์ค‘๊ฐ„์— ๋ง‰ํžˆ๋ฉด ๋˜๋Œ์•„๊ฐˆ ๋‹จ๊ณ„๋ฅผ ์ฐจ๊ทผ์ฐจ๊ทผ ๋ฐŸ์•˜๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค.

๋” ์ž˜ํ–ˆ์œผ๋ฉด ์ข‹์•˜์„ ์ผ ๐Ÿ˜ฅ

  • ๊ณฝ๋ณ‘์„ 

    • ์ข€ ๋” ์ฒด๊ณ„์ ์œผ๋กœ CSS๋ฅผ ๋น ๋ฅธ ์‹œ์ผ๋‚ด์— ๊ตฌํ˜„ํ–ˆ์œผ๋ฉด ํ•˜๋Š” ์•„์‰ฌ์›€์ด ๋‚จ๋Š”๋‹ค. ํด๋ก  ์ฝ”๋”ฉ์ด์—ฌ๋„ ๋‚ด ์ž…๋ง›์— ๋งž๊ฒŒ ๊ตฌํ˜„ ํ•˜๋Š”๊ฒƒ์ด ์‰ฝ์ง€ ์•Š๋‹ค๋Š”๊ฑธ ๊นจ๋‹ฌ์•˜๋‹ค.
    • ์—ฌ๋Ÿฌ ๊ฐ€์ง€ ๊ธฐ๋Šฅ์„ ์ถ”๊ฐ€ํ•˜๋Š” ๊ฒƒ๋„ ์ข‹์ง€๋งŒ ํ˜„์žฌ ํ™˜๊ฒฝ์—์„œ ์ž˜ ๋™์ž‘ํ•˜๋Š” ๊ฒƒ์„ ํ™•์ธํ•˜๋Š” ๊ฒƒ๋„ ์ค‘์š”ํ•˜๋‹ค. ์•ž์œผ๋กœ ์–ด๋–ค ์˜ค๋ฅ˜๊ฐ€ ํŠ€์–ด๋‚˜์˜ฌ์ง€ ๋ชจ๋ฅด๋‹ˆ ๋ฐฉ์‹ฌ์„ ํ•˜๋ฉด ์•ˆ๋œ๋‹ค.
  • ์ด์—ฐ์ฃผ

    • google plus๋ฅผ ์ง€์›์•ˆํ•œ๋‹ค๋Š” ๊ฑธ ์ด๋ฒˆ์ฃผ ๊ฑฐ์˜ ๋์— ๋Šฆ๊ฒŒ ์•Œ์•˜๋‹ค. ๋Œ€์ฒด๋œ ๋ชจ๋“ˆ๋กœ ๋นจ๋ฆฌ ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์•ผ๊ฒ ๋‹ค.
    • javascript ๊ธฐ์ดˆ ์ง€์‹์„ ๋” ํƒ„ํƒ„ํžˆ ํ•ด์„œ ๊ฐœ๋ฐœํ•  ๋•Œ ์ฐพ์•„๋ณด๋Š” ์ผ์„ ๋” ์ค„์—ฌ์•ผ ๊ฒ ๋‹ค.
    • ์š”์ฆ˜ ๋“ค์–ด ์ฒด๋ ฅ์ด ๋ฐฉ์ „๋๋Š”์ง€ ๋Šฆ๊ฒŒ ์ผ์–ด๋‚˜๊ฒŒ ๋œ๋‹ค. ์‹œ๊ฐ„์„ ๋” ์†Œ์ค‘ํžˆ ์—ฌ๊ฒจ์•ผ๊ฒ ๋‹ค.
  • ์ •์†Œ์˜

    • ์ž๋ฃŒ๋งŒ ๋งŽ์ด ์ฐพ์•„๋†“๊ณ  ๊ทธ ์ž๋ฃŒ๋ฅผ ์†Œํ™”ํ•˜๋Š” ์‹œ๊ฐ„์ด ์˜ค๋ž˜๊ฑธ๋ ธ๋‹ค. ๋”์šฑ ์„ฑ์‹คํ•ด์ง€์ž.
    • ๊ธฐ๋Šฅ์„ ๋ถ™์ผ ์ˆ˜๋ก ๋ญ”๊ฐ€ ์ฝ”๋“œ๊ฐ€ ์ข€ ์ง€์ €๋ถ„ํ•ด๋ณด์ด๋Š” ๊ฒƒ ๊ฐ™์•„ ์•„์‰ฝ๋‹ค. ์ผ๋‹จ ๊ธฐ๋Šฅ์„ ๋งŒ๋“ค์–ด ๋†“๊ณ  ๋‚˜์ค‘์— refactoring์„ ๊ผญ ํ•ด์•ผ๊ฒ ๋‹ค.
  • ์กฐ์„ฑ์›

    • yjs ๊ด€๋ จํ•ด์„œ yjs๋ฅผ ์‚ฌ์šฉํ•œ ํ”„๋กœ์ ํŠธ๋“ค์ด ์–ด๋–ป๊ฒŒ yjs๋ฅผ ์ด์šฉํ–ˆ๋Š”์ง€ ์ผ์ฐ ์ฐพ์•„๋ดค์–ด์•ผ ํ–ˆ๋Š”๋ฐ ์ด ๋ถ€๋ถ„์ด ์ข€ ์•„์‰ฝ๋‹ค.
  • ํ•˜ํƒœ๋ฆฐ

    • ํ•œ์ฐธ ํ—ค๋ฉจ๋˜ ์˜ค๋ฅ˜๊ฐ€ ์‚ฌ์‹ค nginx์— ๋Œ€ํ•œ ์ดํ•ด๊ฐ€ ๋ถ€์กฑํ•ด์„œ ์ƒ๊ธด ๊ฒฐ๊ณผ์˜€๋‹ค. ์›๋ž˜ ํ•˜๊ณ ์žˆ๋˜ nginx ๋ฒˆ์—ญ์„ ๋งˆ์ณ์„œ ํ•œ์ธต ๋” ๋†’์•„์ง„ ์ดํ•ด๋„๋กœ ํ”„๋กœ์ ํŠธ์— ์ ‘๊ทผํ•˜๋ฉด ์ข‹์„ ๊ฒƒ ๊ฐ™๋‹ค.

๋‹ค์Œ ์Šคํ”„๋ฆฐํŠธ์— ์ ์šฉํ•  ๊ฒƒ ๐Ÿ“ˆ

  • WBS์™€ jira ๋งž์ถฐ ์—…๋ฐ์ดํŠธ ํ•  ๊ฒƒ
Clone this wiki locally