์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ฑ„๋„ํ†ก ์•„์ด์ฝ˜

[์ดˆ๊ธ‰] 6๊ฐ€์ง€ ํ”„๋กœ์ ํŠธ๋กœ ๋‹ค์ง€๋Š” Qt ์‚ฌ์šฉ๋ฒ• (REST API)

6๊ฐ€์ง€ ํ”„๋กœ์ ํŠธ๋กœ ๋‹ค์ง€๋Š” Qt QML๊ณผ C++ ์‹ค์ „ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค. ๋‹ค์–‘ํ•œ ํ˜•ํƒœ์˜ UI ๊ฐœ๋ฐœ๊ณผ REST API ํ†ต์‹ ๊นŒ์ง€ ์•„์šฐ๋ฅด๋Š” ์—ฐ์Šต์„ ํ†ตํ•ด ์‹ค๋ฌด ๊ธฐ๋ณธ๊ธฐ๋ฅผ ๋‹ฆ์•„๋ณด์„ธ์š”!

Thumbnail

์ดˆ๊ธ‰์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[๋ฐ์Šคํฌํ†ฑ ์•ฑ ๊ฐœ๋ฐœ, ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • Qt ํฌ๋กœ์Šคํ”Œ๋žซํผ ์•ฑ ๊ฐœ๋ฐœ (Desktop Client)

  • REST API ํ†ต์‹  ํด๋ผ์ด์–ธํŠธ ๊ฐœ๋ฐœ

์ฝ”๋”ฉํ…Œ์ŠคํŠธ์—๋งŒ ์“ฐ๋Š” C++๐Ÿ˜‚ ๋‹ค์–‘ํ•œ ํ”„๋กœ๊ทธ๋žจ์„ ๋งŒ๋“ค์–ด๋ณด๊ณ  ์‹ถ์ง€ ์•Š๋‚˜์š”?

QML๊ณผ C++๋ฅผ ๊ฐ€์ง€๊ณ  ์‚ฌ์ง„ ๋ทฐ์–ด๋ถ€ํ„ฐ ๊ทธ๋ฆผํŒ, REST API๋ฅผ ํ™œ์šฉํ•œ ์Œ์•… ๊ฒ€์ƒ‰ ํ”„๋กœ๊ทธ๋žจ๊นŒ์ง€!

  • ์ €๋„ C++์€ ์•Œ์ง€๋งŒ ๋ญ”๊ฐ€ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋Š”๊ฒŒ ์—†๋‚˜ ๋‹ต๋‹ตํ–ˆ์Šต๋‹ˆ๋‹ค.

  • Qt ํ”„๋ ˆ์ž„์›Œํฌ๋ฅผ ์•Œ๊ณ ๋ถ€ํ„ฐ๋Š” ๋‹ค์–‘ํ•œ UI์™€ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ ๊ฐ€์ง„ ํ”„๋กœ์ ํŠธ(cross-platform, desktop-application)๋ฅผ ๋งˆ์Œ

    ๊ป ๊ฐœ๋ฐœํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜ ์ถ”์ฒœํ•ด์š”

๋‹ค์–‘ํ•œ GUI ํ”„๋กœ๊ทธ๋žจ์„ ๋งŒ๋“ค์–ด๋ณด๊ณ  ์‹ถ์œผ์‹  C++ ๊ฐœ๋ฐœ์ž

์œ ์ €์™€ ์ƒํ˜ธ์ž‘์šฉํ•˜๋Š” UI/UX๋ถ€ํ„ฐ REST API ํ†ต์‹ ์„ ํ†ตํ•ด JSON์„ ํŒŒ์‹ฑํ•˜๊ณ  ๊ฐ€๊ณตํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ๋ฐฐ์šฐ๊ณ  ์‹ถ์œผ์‹  ๋ถ„

๋ฐ์Šคํฌํƒ‘ ํด๋ผ์ด์–ธํŠธ (์‘์šฉSW) ๊ฐœ๋ฐœ์„ ํ•ด๋ณด๊ณ  ์‹ถ์œผ์‹  ๋ถ„

์ˆ˜๊ฐ• ํ›„์—๋Š”

  • ๋‹ค์–‘ํ•œ UI/UX๋ฅผ ์ œ๊ณตํ•˜๋Š” ๋ฐ์Šคํฌํƒ‘ ํด๋ผ์ด์–ธํŠธ ํ”„๋กœ๊ทธ๋žจ์„ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

  • REST API ํ†ต์‹ ๊ณผ JSON ํŒŒ์‹ฑ์„ ํ†ตํ•ด ๋™์ ์ธ ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์„ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

  • ํ”„๋กœ์ ํŠธ๋ฅผ ์„ค๊ณ„๋ถ€ํ„ฐ View, Model ๊ฐœ๋ฐœ๊นŒ์ง€, ๊ทธ๋ฆฌ๊ณ  ํ”„๋กœ๊ทธ๋žจ ๋ฐฐํฌ๊นŒ์ง€ ํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

์ด ๊ฐ•์˜์˜ ํŠน์ง•

์‹ค๋ฌด์—์„œ ์ž์ฃผ ์‚ฌ์šฉํ•˜์ง€๋งŒ ๋ถ€์กฑํ•œ ์ž๋ฃŒ๋กœ ์ธํ•ด ๊ณ ์ƒํ•˜์‹œ๋Š” ๋ถ€๋ถ„์„ ๋„์™€๋“œ๋ฆฌ๊ณ ์ž ํ•ฉ๋‹ˆ๋‹ค.

REST API๋ฅผ ์ด์šฉํ•œ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ

(1) REST API๋ฅผ ์ด์šฉํ•œ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ

๋น„๋™๊ธฐ๋กœ API๋ฅผ ์š”์ฒญํ•˜๊ณ  ์‘๋‹ต์„ ๋ฐ›์•„ ์ฒ˜๋ฆฌํ•˜๋Š” ์ „๊ณผ์ •์„ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

(2) 2D ๊ทธ๋ฆผํŒ ๊ทธ๋ฆฌ๊ธฐ

Qt QML์—์„œ ์ œ๊ณตํ•˜๋Š” 2D ๊ด€๋ จ UI ์ปดํฌ๋„ŒํŠธ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ๊ณต์œ ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ์ œ๊ฐ€ ๋ถ€์กฑํ•˜์—ฌ ๋ง‰๋ง‰ํ–ˆ๋˜ ๋ถ„๋“ค์—๊ฒŒ ๋„์›€์„ ๋“œ๋ฆฌ๊ณ ์ž ํ•ฉ๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๋‚ด์šฉ์„ ๋ฐฐ์›Œ์š”

(1) ๊ฐœ๋ฐœ ํ”„๋กœ์„ธ์Šค์— ๋”ฐ๋ผ ํ•จ๊ป˜ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.

UI ํ”„๋กœํ† ํƒ€์ดํ•‘๋ถ€ํ„ฐ ์„ค๊ณ„, ๊ทธ๋ฆฌ๊ณ  View์™€ Model ๊ฐœ๋ฐœ๊นŒ์ง€ ์ฒด๊ณ„์ ์œผ๋กœ ํ•จ๊ป˜ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.

(2) ์ดํ•ด๋ฅผ ์œ„ํ•ด ์นœ์ ˆํ•˜๊ฒŒ ์„ค๋ช…ํ•ฉ๋‹ˆ๋‹ค.

๋ง๊ณผ ๊ธ€๋กœ ์„ค๋ช…ํ•˜๊ธฐ ์–ด๋ ค์šด ๋ถ€๋ถ„์€ ๊ทธ๋ฆผ๊ณผ ๊ณต์‹ ๋ฌธ์„œ๋ฅผ ํ†ตํ•ด ์ดํ•ด์‹œ์ผœ๋“œ๋ฆฌ๊ฒ ์Šต๋‹ˆ๋‹ค.

์ด ๊ฐ•์˜๋ฅผ ๋งŒ๋“  ์‚ฌ๋žŒ

  • C++๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ์ž„๋ฒ ๋””๋“œSW๋ถ€ํ„ฐ ๋ฐ์Šคํฌํƒ‘ ํด๋ผ์ด์–ธํŠธ(์‘์šฉSW)๊นŒ์ง€ ๊นŠ๊ณ  ๋‹ค์–‘ํ•˜๊ฒŒ ํ”„๋กœ์ ํŠธ ๊ฒฝํ—˜์„ ์Œ“์•„์™”์Šต๋‹ˆ๋‹ค.

  • Qt, Flutter์™€ ๊ฐ™์€ ํฌ๋กœ์Šคํ”Œ๋žซํผ ํ”„๋ ˆ์ž„์›Œํฌ๋ฅผ ๊พธ์ค€ํžˆ ๊ณต๋ถ€ํ•˜๊ณ  ์‚ฌ์šฉํ•˜๋ฉด์„œ ํฌ๋กœ์Šคํ”Œ๋žซํผ ํ”„๋ ˆ์ž„์›Œํฌ์— ๋Œ€ํ•œ ์ดํ•ด์™€ ์•ˆ๋ชฉ์„ ํ‚ค์›Œ์™”์Šต๋‹ˆ๋‹ค.


๊ถ๊ธˆํ•œ ์ ์ด ์žˆ๋‚˜์š”?

Q. ์ด ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ• ํ›„ ์‹ค์ œ ํ”„๋กœ์ ํŠธ์— ๋ฐ”๋กœ ์ ์šฉํ•  ์ˆ˜ ์žˆ๋‚˜์š”?

์ด ๊ฐ•์˜์˜ ์ปค๋ฆฌํ˜๋Ÿผ์€ QML์„ ํ™œ์šฉํ•œ ๊ธฐ๋ณธ๋ถ€ํ„ฐ REST API ํ†ต์‹ ๊นŒ์ง€์˜ ๋‹ค์ฑ„๋กœ์šด ์˜ˆ์ œ๋ฅผ ๋‹ด๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. 1ํŽธ์— ํ•ด๋‹นํ•˜๋Š” ์ž…๋ฌธ ๊ฐ•์˜์™€ ํ•จ๊ป˜ ์ตํžˆ์‹œ๋ฉด ์‹ค๋ฌด, ๊ณผ์ œ์—์„œ๋„ ํฐ ๋„์›€์„ ์–ป์œผ์‹ค ์ˆ˜ ์žˆ์„ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

Q. ๋‹ค๋ฅธ ํฌ๋กœ์Šคํ”Œ๋žซํผ ํ”„๋ ˆ์ž„์›Œํฌ(Flutter, React Native)์— ๋น„ํ•ด Qt๊ฐ€ ๊ฐ–๋Š” ์ด์ ์€ ๋ฌด์—‡์ธ๊ฐ€์š”?

์šฐ์„ , ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ C++๋กœ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ์—์„œ ๋ฉ”๋ชจ๋ฆฌ ๊ด€๋ฆฌ, ์„ฑ๋Šฅ ์ธก๋ฉด์—์„œ ํฌ๋‚˜ํฐ ์ด์ ์„ ๊ฐ–์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ์ด์  ๋•๋ถ„์— ์ž๋™์ฐจ ์—…๊ณ„, ์˜๋ฃŒ๊ธฐ๊ธฐ, ์„ฑ๋Šฅ์ด ์ค‘์š”ํ•œ ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ ๋ฐ ์ž„๋ฒ ๋””๋“œ ํ”„๋กœ๊ทธ๋žจ์—์„œ ๋งŽ์ด ์‚ฌ์šฉ๋˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

Q. ์™œ QWidget์ด ์•„๋‹Œ QML๋กœ View(UI)๋ฅผ ์ž‘์„ฑํ•˜๋‚˜์š”?

QWidget๋„ Qt Designer์™€ ํ•จ๊ป˜ํ•˜๋ฉด C++๋งŒ์œผ๋กœ ๋ชจ๋“  ๋ถ€๋ถ„์„ ์ปค๋ฒ„ํ•˜์—ฌ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์žฅ์ ์ด ์žˆ์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ, ์„ ์–ธํ˜•์ธ QML์„ ์‚ฌ์šฉํ•˜๋ฉด ๋””ํ…Œ์ผํ•œ UI ์ˆ˜์ • ๋ฐ Model๊ณผ View์˜ ๋ถ„๋ฆฌ๊ฐ€ ํ™•์‹คํ•˜๊ฒŒ ๋œ๋‹ค๋Š” ๋“ฑ์˜ ๋‹ค์–‘ํ•œ ์žฅ์ ์ด ์žˆ์Šต๋‹ˆ๋‹ค. ํŠนํžˆ, ํ˜„์—…์—์„œ ๋””์ž์ด๋„ˆ์™€ ํ•จ๊ป˜ํ•œ๋‹ค๋ฉด ๋””์ž์ด๋„ˆ์˜ ๋””ํ…Œ์ผํ•œ UI/UX์— ๋งž์ถ”์–ด ์ž‘์—…ํ•  ์ˆ˜ ์žˆ์„ ๋ฟ๋”๋Ÿฌ ์„ธ๋ฐ€ํ•œ ์ˆ˜์ • ์š”์ฒญ๋„ ์ง๊ด€์ ์œผ๋กœ ํ•ด๋‚ด์‹ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ˆ˜๊ฐ• ์ „ ์ฐธ๊ณ  ์‚ฌํ•ญ

์‹ค์Šต ํ™˜๊ฒฝ

  • Windows 10 ์ด์ƒ

  • Qt 6.6.0 ์ด์ƒ

  • MSVC 2019 C++

ํ•™์Šต ์ž๋ฃŒ

  • ๊ฐ•์˜์™€ ํ•จ๊ป˜ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜์‹œ๋ฉด ๋”์šฑ ํ•™์Šต์— ๋„์›€์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค.

์„ ์ˆ˜ ์ง€์‹ ๋ฐ ์œ ์˜์‚ฌํ•ญ

  • C++ ๊ธฐ๋ณธ

  • QML ๊ธฐ๋ณธ

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ์˜ REST API ํ†ต์‹  ๋ฐฉ๋ฒ•์„ ๋ฐฐ์šฐ๊ณ  ์‹ถ์œผ์‹  ๋ถ„

  • ๋ฐ์Šคํฌํƒ‘ GUI ํด๋ผ์ด์–ธํŠธ ๊ฐœ๋ฐœ์„ ํ•˜๊ณ  ์‹ถ์€ ๋ถ„

  • ํฌ๋กœ์Šคํ”Œ๋žซํผ ์•ฑ ๊ฐœ๋ฐœ์— ๊ด€์‹ฌ์ด ์žˆ๋Š” ๋ถ„

์„ ์ˆ˜ ์ง€์‹,
ํ•„์š”ํ• ๊นŒ์š”?

  • C++

  • QML

์•ˆ๋…•ํ•˜์„ธ์š”
์ฝ”๋“œ๋ธŒ๋ฆฟ์ง€์ž…๋‹ˆ๋‹ค.

129

๋ช…

์ˆ˜๊ฐ•์ƒ

9

๊ฐœ

์ˆ˜๊ฐ•ํ‰

5

๊ฐœ

๋‹ต๋ณ€

4.8

์ 

๊ฐ•์˜ ํ‰์ 

3

๊ฐœ

๊ฐ•์˜

๐Ÿ‘‹๐Ÿผ ๊ฐ„๋‹จํ•œ ์ธ์‚ฌ์™€ ์ž๊ธฐ์†Œ๊ฐœ

ํ”Œ๋žซํผ ์‚ฌ์ด์˜ ๊ฒฝ๊ณ„๋ฅผ ํ—ˆ๋ฌด๋Š” ๊ฐœ๋ฐœ์— ๋งค๋ ฅ์„ ๊ฐ€์ง€๊ณ  ๊ด€๋ จ ๊ฐ•์˜๋ฅผ ์ œ์ž‘ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ์ž˜ ๋ถ€ํƒ๋“œ๋ฆฝ๋‹ˆ๋‹ค!

๋ฌธ์˜ : codebridge747@gmail.com

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

33๊ฐœ โˆ™ (5์‹œ๊ฐ„ 23๋ถ„)

๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์•„์ง ์ถฉ๋ถ„ํ•œ ํ‰๊ฐ€๋ฅผ ๋ฐ›์ง€ ๋ชปํ•œ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.
๋ชจ๋‘์—๊ฒŒ ๋„์›€์ด ๋˜๋Š” ์ˆ˜๊ฐ•ํ‰์˜ ์ฃผ์ธ๊ณต์ด ๋˜์–ด์ฃผ์„ธ์š”!