๋ธ”๋กœ๊ทธ

๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป (์ด๋ฒˆ ์ฃผ ์ˆ˜์š”์ผ 18/10๋ถ€ํ„ฐ ์‹œ์ž‘) Gato GraphQL ์›จ๋น„๋‚˜ ์‹œ๋ฆฌ์ฆˆ @ WPBuilds

Leonardo Losoviz
์ž‘์„ฑ์ž: Leonardo Losoviz ยท

์ด๋ฒˆ ์ฃผ ์ˆ˜์š”์ผ 10์›” 18์ผ๋ถ€ํ„ฐ, WPBuilds ํŒŸ์บ์ŠคํŠธ์—์„œ Gato GraphQL ํ™œ์šฉ๋ฒ•์— ๊ด€ํ•œ ์›จ๋น„๋‚˜ ์‹œ๋ฆฌ์ฆˆ๋ฅผ ์‹œ์ž‘ํ•ฉ๋‹ˆ๋‹ค. ํ˜ธ์ŠคํŠธ๋Š” ๋ฐ”๋กœ Nathan Wrigley์ž…๋‹ˆ๋‹ค.

GraphQL์„ ์‚ฌ์šฉํ•ด๋ณธ ์ ์ด ์žˆ๋“  ์—†๋“ , WordPress์—์„œ GraphQL๋กœ ๋ฌด์—‡์„ ์ด๋ฃฐ ์ˆ˜ ์žˆ๋Š”์ง€ ๋ฐฐ์šฐ๊ณ  (๋†€๋ผ์›€์„ ๊ฒฝํ—˜ํ•˜๊ณ ) ์‹ถ์œผ์‹œ๋‹ค๋ฉด, ์ด ์›จ๋น„๋‚˜ ์‹œ๋ฆฌ์ฆˆ๋Š” ๋ฐ”๋กœ ์—ฌ๋Ÿฌ๋ถ„์„ ์œ„ํ•œ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

GraphQL์—๋Š” ์ „ํ˜€ ๊ด€์‹ฌ์ด ์—†๋”๋ผ๋„ WordPress ์‚ฌ์ดํŠธ ๊ด€๋ฆฌ์— ๋„์›€์ด ๋˜๋Š” ๋„๊ตฌ๋ฅผ ๋ฐœ๊ฒฌํ•˜๊ณ  ์‹ถ์œผ์‹œ๋‹ค๋ฉด, ์ด ์›จ๋น„๋‚˜ ์‹œ๋ฆฌ์ฆˆ๋„ ์—ฌ๋Ÿฌ๋ถ„๊ป˜ ๊ผญ ๋งž์Šต๋‹ˆ๋‹ค.

๏ผˆ๋ชฐ๋ž˜ ๋ง์”€๋“œ๋ฆฌ์ž๋ฉด, ์ข‹์€ ํ• ์ธ ํ˜œํƒ์„ ์›ํ•˜์‹ ๋‹ค๋ฉด ์ด ์‹œ๋ฆฌ์ฆˆ๋Š” ์—ฌ๋Ÿฌ๋ถ„์„ ์œ„ํ•œ ๊ฒƒ์ด๊ธฐ๋„ ํ•ฉ๋‹ˆ๋‹ค! ๋ฉ‹์ง„ ํ• ์ธ ์ฟ ํฐ ์ฝ”๋“œ๊ฐ€ ๊ณต๊ฐœ๋ ์ง€๋„ ๋ชจ๋ฆ…๋‹ˆ๋‹ค ๐Ÿ™Š๏ผ‰

Gato GraphQL ์›จ๋น„๋‚˜ ์‹œ๋ฆฌ์ฆˆ - 1ํšŒ

์žฅ์†Œ: wpbuilds.com/live

์ผ์‹œ: 2023๋…„ 10์›” 18์ผ๏ผˆ์ˆ˜๏ผ‰, ์˜คํ›„ 3์‹œ๏ผˆ์˜๊ตญ ์‹œ๊ฐ„๏ผ‰/ ์˜ค์ „ 10์‹œ๏ผˆ๋™๋ถ€ ์‹œ๊ฐ„๏ผ‰/ ์˜ค์ „ 7์‹œ๏ผˆํƒœํ‰์–‘ ์‹œ๊ฐ„๏ผ‰

์บ˜๋ฆฐ๋”: Google / Outlook / 365


์ด ์‹œ๋ฆฌ์ฆˆ๋Š” ์ด 5ํšŒ์— ๊ฑธ์ณ ์ง„ํ–‰๋˜๋ฉฐ, WordPress ์‚ฌ์ดํŠธ๋ฅผ ๊ตฌ์ถ•ํ•  ๋•Œ ์ž์ฃผ ๋งˆ์ฃผ์น˜๋Š” 20๊ฐ€์ง€ ๋ฌธ์ œ๋ฅผ ๊นŠ์ด ์žˆ๊ฒŒ ๋‹ค๋ฃน๋‹ˆ๋‹ค.

๊ฐ ์„ธ์…˜์˜ ํ”„๋กœ๊ทธ๋žจ์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค๏ผˆ๋ชจ๋‘ ์˜๊ตญ ์‹œ๊ฐ„ ์˜คํ›„ 3์‹œ ์‹œ์ž‘๏ผ‰.

1ํšŒ: 10์›” 18์ผ๏ผˆ์ˆ˜๏ผ‰

ใ€ŒGato GraphQL ์†Œ๊ฐœ, ๊ด€๋ฆฌ ํ™”๋ฉด์—์„œ ์ฟผ๋ฆฌ ์‹คํ–‰, API ์—”๋“œํฌ์ธํŠธ ์ƒ์„ฑ, ์ ‘๊ทผ ์ œ์–ด, ์บ์‹ฑใ€

๋ผ์ด๋ธŒ ๋ฐ๋ชจ:
  1. WP ๋ฐ์ดํ„ฐ ๊ฒ€์ƒ‰ ๏ผˆ์˜ˆ: ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ๋กœ ๊ฒŒ์‹œ๋ฌผ์ด๋‚˜ ์‚ฌ์šฉ์ž ์ฐพ๊ธฐ๏ผ‰
  2. ๋™์  ๋ฐ์ดํ„ฐ ์ฟผ๋ฆฌ
  3. WP-CLI ๋ณด์™„ ๏ผˆ์˜ˆ: ๋ช…๋ น์„ ์ ์šฉํ•  ๋ฆฌ์†Œ์Šค ์„ ํƒ๏ผ‰
  4. PHP ์ฝ”๋“œ ์—†์ด API ์—”๋“œํฌ์ธํŠธ๋ฅผ ๊ณต๊ฐœํ•˜๊ณ  ๋น„๋ฐ€๋ฒˆํ˜ธ ๋ณดํ˜ธ ๋˜๋Š” ๋น„๊ณต๊ฐœ๋กœ ์„ค์ •ํ•˜๊ธฐ
  5. ์„œ๋“œํŒŒํ‹ฐ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ ์—†์ด API ์‘๋‹ต ์บ์‹ฑํ•˜๊ธฐ

2ํšŒ: 10์›” 25์ผ๏ผˆ์ˆ˜๏ผ‰

ใ€ŒGutenberg ์—ฐ๋™, ์‚ฌ์šฉ์ž๋ณ„ ์ฝ˜ํ…์ธ  ์ปค์Šคํ„ฐ๋งˆ์ด์ง•, ๊ฒŒ์‹œ๋ฌผ ๋ณต์ œใ€

๋ผ์ด๋ธŒ ๋ฐ๋ชจ:
  1. ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ์ปค์Šคํ…€ ๋ธ”๋ก์œผ๋กœ ๋ฐ์ดํ„ฐ ๊ณต๊ธ‰ํ•˜๊ธฐ
  2. DRY ๋กœ์ง์„ ์‚ฌ์šฉํ•˜์—ฌ ํด๋ผ์ด์–ธํŠธ ์‚ฌ์ด๋“œ ๋ Œ๋”๋ง๏ผˆCSR๏ผ‰๊ณผ ์„œ๋ฒ„ ์‚ฌ์ด๋“œ ๋ Œ๋”๋ง๏ผˆSSR๏ผ‰๋ชจ๋‘์—์„œ ๋ธ”๋ก ๋ฐ์ดํ„ฐ ๊ฐ€์ ธ์˜ค๊ธฐ
  3. ๋ธ”๋ก์—์„œ ๊ตฌ์กฐํ™”๋œ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์™€ ๋…ธ์ถœํ•˜๊ธฐ
  4. JavaScript ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋ธ”๋ก์— ๋งคํ•‘ํ•˜๊ธฐ
  5. ๊ฐœ์ธํ™”๋œ ์ด๋ฉ”์ผ ์ „์†กํ•˜๊ธฐ
  6. ์‚ฌ์šฉ์ž๋ณ„๋กœ ์ฝ˜ํ…์ธ  ์ปค์Šคํ„ฐ๋งˆ์ด์ง•ํ•˜๊ธฐ
  7. ๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๋ฌผ ๋ณต์ œํ•˜๊ธฐ ๋ฐ ์—ฌ๋Ÿฌ ๊ฒŒ์‹œ๋ฌผ ํ•œ ๋ฒˆ์— ๋ณต์ œํ•˜๊ธฐ

3ํšŒ: 11์›” 29์ผ๏ผˆ์ˆ˜๏ผ‰

ใ€Œ์ฝ˜ํ…์ธ  ์ผ๊ด„ ์—…๋ฐ์ดํŠธ, ์ž‘์—… ์ž๋™ํ™”ใ€

๋ผ์ด๋ธŒ ๋ฐ๋ชจ:
  1. ์ฝ˜ํ…์ธ  ์ผ๊ด„ ์ ์šฉ ๏ผˆ์˜ˆ: ์‚ฌ์ดํŠธ ๋„๋ฉ”์ธ ์ด์ „ ์‹œ ๋ชจ๋“  ๊ฒŒ์‹œ๋ฌผ์˜ ๋ฌธ์ž์—ด ์ผ๊ด„ ๊ต์ฒด๏ผ‰
  2. ๊ด€๋ฆฌ ์ž‘์—… ์ž๋™ํ™” ๏ผˆ์˜ˆ: ํ•„์ˆ˜ ๋ธ”๋ก์ด ์—†์„ ๋•Œ ์ž๋™์œผ๋กœ ์‚ฝ์ž…ํ•˜๊ธฐ๏ผ‰
  3. ๋ชจ๋“  ๊ฒŒ์‹œ๋ฌผ์— ์ปค์Šคํ…€ CTA ๋ธ”๋ก ์ถ”๊ฐ€ํ•˜๊ธฐ๏ผˆ์บ ํŽ˜์ธ ์ „๏ผ‰๋ฐ ์ œ๊ฑฐํ•˜๊ธฐ๏ผˆ์บ ํŽ˜์ธ ํ›„๏ผ‰
  4. ์ƒˆ ๊ฒŒ์‹œ๋ฌผ์ด ์˜ฌ๋ผ์™”์„ ๋•Œ ์•Œ๋ฆผ ์ „์†ก ๋ฐ ๋งค์ผ ํ™œ๋™ ์š”์•ฝ์„ ์ด๋ฉ”์ผ๋กœ ๋ฐ›๊ธฐ

4ํšŒ: 12์›” 6์ผ๏ผˆ์ˆ˜๏ผ‰

ใ€Œ์ฝ˜ํ…์ธ  ๋ฒˆ์—ญ, ์™ธ๋ถ€ ์„œ๋น„์Šค ์—ฐ๋™, ์ฝ˜ํ…์ธ  ๊ฐ€์ ธ์˜ค๊ธฐ/๋ฐฐํฌใ€

๋ผ์ด๋ธŒ ๋ฐ๋ชจ:
  1. ๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๋ฌผ ๋ฒˆ์—ญํ•˜๊ธฐ๏ผˆ๋ธ”๋ก ์†์„ฑ ์ˆ˜์ค€์œผ๋กœ๏ผ๏ผ‰๋ฐ ์—ฌ๋Ÿฌ ๊ฒŒ์‹œ๋ฌผ ํ•œ ๋ฒˆ์— ๋ฒˆ์—ญํ•˜๊ธฐ
  2. ์™ธ๋ถ€ ์„œ๋น„์Šค ์—ฐ๋™ ๏ผˆ์˜ˆ: Mailchimp ๊ตฌ๋…์ž ๋ฐ์ดํ„ฐ์™€ ์‚ฌ์ดํŠธ ์‚ฌ์šฉ์ž ๋ฐ์ดํ„ฐ ๊ฒฐํ•ฉํ•˜๊ธฐ๏ผ‰
  3. ๋‹ค๋ฅธ WordPress ์‚ฌ์ดํŠธ์—์„œ ๊ฒŒ์‹œ๋ฌผ ๊ฐ€์ ธ์˜ค๊ธฐ
  4. ์—ฌ๋Ÿฌ ๋‹ค์šด์ŠคํŠธ๋ฆผ ์‚ฌ์ดํŠธ์— ์ฝ˜ํ…์ธ  ๋ฐฐํฌํ•˜๊ธฐ ๏ผˆ์˜ˆ: ๋ฉ€ํ‹ฐ์‚ฌ์ดํŠธ ๋‚ด ๋ฐ์ดํ„ฐ ๋™๊ธฐํ™”๏ผ‰

5ํšŒ: 12์›” 13์ผ๏ผˆ์ˆ˜๏ผ‰

ใ€ŒGraphQL ์Šคํ‚ค๋งˆ ํ™•์žฅใ€

์ปค์Šคํ…€ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์˜ค๋Š” ๋ฆฌ์กธ๋ฒ„๋ฅผ ํฌํ•จํ•œ ํ™•์žฅ ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ•์„ ๋ฐฐ์šฐ๊ณ , ํ…Œ๋งˆ, ํ”Œ๋Ÿฌ๊ทธ์ธ, ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์— ํ™œ์šฉํ•ฉ๋‹ˆ๋‹ค.


ํ•จ๊ป˜ํ•ด์š”!

๊ผญ ๋ต™๊ธฐ๋ฅผ ๊ธฐ๋Œ€ํ•ฉ๋‹ˆ๋‹ค!

๐Ÿ‘‹ Ciao,
Leo


๋‰ด์Šค๋ ˆํ„ฐ ๊ตฌ๋…ํ•˜๊ธฐ

Gato GraphQL์˜ ๋ชจ๋“  ์—…๋ฐ์ดํŠธ๋ฅผ ๋†“์น˜์ง€ ๋งˆ์„ธ์š”.