๋ธ”๋กœ๊ทธ

๐Ÿ˜ฒ WordPress์—์„œ GraphQL๋กœ ํ•  ์ˆ˜ ์žˆ๋Š” 15๊ฐ€์ง€ (๋ชฐ๋ž๋˜ ๊ฒƒ๋“ค)

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

์ง€๋‚œ 9์›” WordCamp Malaysia 2023์—์„œ Gato GraphQL์„ ๋ฐœํ‘œํ•  ๊ธฐํšŒ๋ฅผ ์–ป์—ˆ์œผ๋ฉฐ, ๊ฐ•์—ฐ ์˜์ƒ์ด ๊ณต๊ฐœ๋˜์—ˆ์Šต๋‹ˆ๋‹ค:

15 things (you didn't know) you can do with GraphQL in WordPress

์˜์ƒ์€ ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค:

ํƒ€์ž„์Šคํƒฌํ”„:

[00:00] ์ธํŠธ๋กœ

[00:49] WordPress์—์„œ GraphQL์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์— ๋Œ€ํ•ด ์ผ๋ฐ˜์ ์œผ๋กœ ์•Œ๋ ค์ง„ ๋‚ด์šฉ

[02:43] wp-admin์—์„œ Gato GraphQL ์‚ดํŽด๋ณด๊ธฐ:

  • [02:53] ๋น„๊ณต๊ฐœ GraphiQL ํด๋ผ์ด์–ธํŠธ
  • [04:00] ๋น„๊ณต๊ฐœ ๋Œ€ํ™”ํ˜• ์Šคํ‚ค๋งˆ ํด๋ผ์ด์–ธํŠธ
  • [04:36] ๊ณต๊ฐœ GraphiQL ํด๋ผ์ด์–ธํŠธ
  • [05:39] ๊ณต๊ฐœ ๋Œ€ํ™”ํ˜• ์Šคํ‚ค๋งˆ ํด๋ผ์ด์–ธํŠธ
  • [06:19] ์ปค์Šคํ…€ ์—”๋“œํฌ์ธํŠธ
  • [06:52] ํผ์‹œ์Šคํ‹ฐ๋“œ ์ฟผ๋ฆฌ

[08:14] WordPress์—์„œ Gato GraphQL๋กœ ํ•  ์ˆ˜ ์žˆ๋Š” 15๊ฐ€์ง€:

  • [08:51] ๋ ˆ์‹œํ”ผ ์„น์…˜ ์†Œ๊ฐœ
  • [09:29] (#1) WP ๋ฐ์ดํ„ฐ ๊ฒ€์ƒ‰ (์˜ˆ: ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ๋กœ ๊ฒŒ์‹œ๋ฌผ ๋˜๋Š” ์‚ฌ์šฉ์ž ๊ฒ€์ƒ‰ํ•˜๊ธฐ)
  • [12:40] (#2) WP-CLI ๋ณด์™„ํ•˜๊ธฐ (์˜ˆ: ๋ช…๋ น์„ ์ ์šฉํ•  ๋ฆฌ์†Œ์Šค ์„ ํƒํ•˜๊ธฐ)
  • [14:10] (#3) ๊ฐœ์ธํ™”๋œ ์ด๋ฉ”์ผ ๋ณด๋‚ด๊ธฐ
  • [16:18] (#4) CSR๊ณผ SSR ๋ชจ๋‘์—์„œ ๋ธ”๋ก์šฉ ๋ฐ์ดํ„ฐ ๊ฐ€์ ธ์˜ค๊ธฐ๏ผˆDRY ๋กœ์ง ์‚ฌ์šฉ๏ผ๏ผ‰ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [16:40] (#5) JavaScript ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋ธ”๋ก์— ๋งคํ•‘ํ•˜๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [16:49] (#6) ๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๋ฌผ ๋ณต์ œํ•˜๊ธฐ
  • [18:22] (#7) ๋‹ค์–‘ํ•œ ์‚ฌ์šฉ์ž์— ๋งž๊ฒŒ ์ฝ˜ํ…์ธ  ๋งž์ถคํ™”ํ•˜๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [18:28] (#8) ์ฝ˜ํ…์ธ ๋ฅผ ์ผ๊ด„ ์ˆ˜์ •ํ•˜๊ธฐ (์˜ˆ: ์‚ฌ์ดํŠธ ๋„๋ฉ”์ธ ๋งˆ์ด๊ทธ๋ ˆ์ด์…˜ ์‹œ ๋ชจ๋“  ๊ฒŒ์‹œ๋ฌผ์—์„œ ๋ฌธ์ž์—ด ๊ต์ฒดํ•˜๊ธฐ)
  • [20:14] (#9) ๊ด€๋ฆฌ ์ž‘์—… ์ž๋™ํ™”ํ•˜๊ธฐ (์˜ˆ: ํ•„์ˆ˜ ๋ธ”๋ก์ด ๋ˆ„๋ฝ๋œ ๊ฒฝ์šฐ ์‚ฝ์ž…ํ•˜๊ธฐ) [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [20:53] (#10) ์บ ํŽ˜์ธ ์ „์— ๋ชจ๋“  ๊ฒŒ์‹œ๋ฌผ์— ์ปค์Šคํ…€ CTA ๋ธ”๋ก์„ ์ถ”๊ฐ€ํ•˜๊ณ  ์ดํ›„์— ์ œ๊ฑฐํ•˜๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [20:56] (#11) ๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๋ฌผ ๋ฒˆ์—ญํ•˜๊ธฐ๏ผˆ๋ธ”๋ก ์†์„ฑ ์ˆ˜์ค€์—์„œ๏ผ๏ผ‰
  • [23:13] (#12) ์ƒˆ ๊ฒŒ์‹œ๋ฌผ์ด ์žˆ์„ ๋•Œ ์•Œ๋ฆผ์„ ๋ณด๋‚ด๊ณ , ์ผ์ผ ํ™œ๋™ ์š”์•ฝ์„ ์ด๋ฉ”์ผ๋กœ ๋ณด๋‚ด๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [23:17] (#13) Mailchimp ๊ตฌ๋…์ž์™€ ์›น์‚ฌ์ดํŠธ ์‚ฌ์šฉ์ž ๋ฐ์ดํ„ฐ ๊ฒฐํ•ฉํ•˜๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [23:24] (#14) ๋‹ค๋ฅธ WordPress ์‚ฌ์ดํŠธ์—์„œ ๊ฒŒ์‹œ๋ฌผ ๊ฐ€์ ธ์˜ค๊ธฐ [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]
  • [23:26] (#15) ์—ฌ๋Ÿฌ ๋‹ค์šด์ŠคํŠธ๋ฆผ ์‚ฌ์ดํŠธ์— ์ฝ˜ํ…์ธ  ๋ฐฐํฌํ•˜๊ธฐ (์˜ˆ: ๋ฉ€ํ‹ฐ์‚ฌ์ดํŠธ ๋‚ด ๋ฐ์ดํ„ฐ ๋™๊ธฐํ™”ํ•˜๊ธฐ) [๋ฐ๋ชจ ๊ฑด๋„ˆ๋œ€]

[23:34] ๊ฒฐ๋ก 

[23:53] Q&A:

  • [23:54] "์ด ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ๋งŒ๋“ค๊ฒŒ ๋œ ๊ณ„๊ธฐ๊ฐ€ ๋ฌด์—‡์ธ๊ฐ€์š”? ๊ฐœ๋ฐœ์ž๋กœ์„œ ์–ด๋–ค ๋ฌธ์ œ์— ์ง๋ฉดํ•˜์—ฌ ์ด ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ๋งŒ๋“ค๊ธฐ๋กœ ๊ฒฐ์‹ฌํ•˜์…จ๋‚˜์š”?"
  • [25:13] "REST API๋กœ๋„ ๊ฐ€๋Šฅํ•œ๊ฐ€์š”? ์˜ˆ๋ฅผ ๋“ค์–ด Gato REST API ๊ฐ™์€ ๊ฒƒ์œผ๋กœ์š”?"
  • [25:52] "๊ด€๊ณ„๋ฅผ ๊ฐ€์ง„ ํ…Œ์ด๋ธ” ๋ถ€๋ถ„ [GraphQL ์Šคํ‚ค๋งˆ]์€ ์–ด๋–ค ๋‚ด์šฉ์ธ๊ฐ€์š”?"
  • [27:58] "[GraphQL ์Šคํ‚ค๋งˆ์— ๋Œ€ํ•ด] ์ž๋™ํ™”๋˜์–ด ์žˆ๋‚˜์š”, ์•„๋‹ˆ๋ฉด ์ˆ˜๋™์œผ๋กœ ๋งคํ•‘ํ•ด์•ผ ํ•˜๋‚˜์š”?"
  • [29:47] "AI ์–ด์‹œ์Šคํ„ดํŠธ๋ฅผ ๊ตฌ๋™ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‚˜์š”? (REST API ๋Œ€์‹  GraphQL์„ ์‚ฌ์šฉํ•˜์—ฌ)"

์Šฌ๋ผ์ด๋“œ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค:

์ฆ๊ฒ๊ฒŒ ๊ฐ์ƒํ•˜์„ธ์š”!


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

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