๋ธ”๋กœ๊ทธ

๐ŸŽŠ Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ, ์ƒˆ๋กœ์šด ํ—ค๋“œ๋ฆฌ์Šค ์Šคํƒ€ํ„ฐ, WordCamp ์ฐธ๊ฐ€ ๋“ฑ

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

์•ˆ๋…•ํ•˜์„ธ์š”! 2024๋…„ 3์›”๊นŒ์ง€์˜ Gato GraphQL ๊ด€๋ จ ๋ชจ๋“  ์†Œ์‹์„ ์ „ํ•ด๋“œ๋ฆฝ๋‹ˆ๋‹ค.

์ƒˆ ์›น์‚ฌ์ดํŠธ๊ฐ€ ์™„์„ฑ๋˜์—ˆ์Šต๋‹ˆ๋‹ค!

์ง€๊ธˆ ์ด ๋ธ”๋กœ๊ทธ ํฌ์ŠคํŠธ๋ฅผ ์ฝ๊ณ  ๊ณ„์‹  ์ด ์›น์‚ฌ์ดํŠธ ์ž์ฒด๊ฐ€ ์ƒˆ๋กญ๊ฒŒ ์žฌ๊ตฌ์ถ•๋˜์—ˆ์Šต๋‹ˆ๋‹ค:

Gato GraphQL์˜ ์ƒˆ ์›น์‚ฌ์ดํŠธ
Gato GraphQL์˜ ์ƒˆ ์›น์‚ฌ์ดํŠธ

์ €ํฌ๊ฐ€ ๋งŒ์กฑํ•˜๊ณ  ์žˆ๋‹ค๋Š” ํ‘œํ˜„์€ ์˜คํžˆ๋ ค ๋ถ€์กฑํ•  ์ •๋„์ž…๋‹ˆ๋‹ค (์ด์ „ ๋ฒ„์ „์„ ๋ฐฉ๋ฌธํ•ด ๋ณด์…จ๋‹ค๋ฉด ๊ทธ ์ด์œ ๋ฅผ ์•„์‹ค ๊ฒƒ์ž…๋‹ˆ๋‹ค ๐Ÿคฃ).

์ด ์‚ฌ์ดํŠธ๋Š” Next.js, Typescript, Tailwind CSS๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ตฌ์ถ•๋œ ์ •์  ์‚ฌ์ดํŠธ์ด๋ฉฐ, Netlify์— ํ˜ธ์ŠคํŒ…๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

ํŠนํžˆ ์ƒˆ๋กœ์šด ๋ฌธ์„œ ์„น์…˜์— ํฐ ๊ธฐ๋Œ€๊ฐ์„ ๋А๋ผ๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ๋ชจ๋“  ๋ฌธ์„œ๋ฅผ ์‰ฝ๊ฒŒ ํƒ์ƒ‰ํ•  ์ˆ˜ ์žˆ๊ณ  GraphQL ์ฟผ๋ฆฌ๋„ ์†์‰ฝ๊ฒŒ ๋ณต์‚ฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:

Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ ๋ฌธ์„œ ์„น์…˜
Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ ๋ฌธ์„œ ์„น์…˜

๋˜ํ•œ Algolia๋ฅผ ํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ๋„ ์‚ฌ์ดํŠธ์— ์ถ”๊ฐ€ํ–ˆ์Šต๋‹ˆ๋‹ค. ์ƒ๋‹จ ๋‚ด๋น„๊ฒŒ์ด์…˜์˜ "search" ์•„์ด์ฝ˜์„ ํด๋ฆญํ•˜๋ฉด ๋ชจ๋“  ๋ฌธ์„œ ํ•ญ๋ชฉ๊ณผ ๋ธ”๋กœ๊ทธ ํฌ์ŠคํŠธ์—์„œ ์ •๋ณด๋ฅผ ๊ฒ€์ƒ‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:

Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ
Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ

์ด์ œ ์›น์‚ฌ์ดํŠธ๊ฐ€ (๊ฑฐ์˜) ์™„์„ฑ๋˜์—ˆ์œผ๋‹ˆ, ๋”์šฑ ์œ ์ตํ•œ ์ฝ˜ํ…์ธ ๋ฅผ ๋งŒ๋“œ๋Š” ๋ฐ ์ง‘์ค‘ํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค.

์ด๋ฅผ ์œ„ํ•ด ๋‹ค๋ฅธ WordPress ํ”Œ๋Ÿฌ๊ทธ์ธ๊ณผ ๋น„๊ตํ•˜์—ฌ Gato GraphQL์˜ ๊ธฐ๋Šฅ์„ ๋ณด์—ฌ์ฃผ๋Š” ์ƒˆ๋กœ์šด Comparisons ์„น์…˜์„ ์ถ”๊ฐ€ํ–ˆ์Šต๋‹ˆ๋‹ค. ํ˜„์žฌ 2ํŽธ์˜ ๊ธ€์ด ๊ฒŒ์žฌ๋˜์–ด ์žˆ์œผ๋ฉฐ(Gato GraphQL vs WP REST API, Gato GraphQL vs WPGraphQL), ์•ž์œผ๋กœ ๋” ๋งŽ์€ ๊ธ€์ด ์ค€๋น„ ์ค‘์ž…๋‹ˆ๋‹ค.

Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ Comparisons ํŽ˜์ด์ง€
Gato GraphQL ์ƒˆ ์›น์‚ฌ์ดํŠธ์˜ Comparisons ํŽ˜์ด์ง€

๊ทธ ์ดํ›„์—๋Š” "How to" ์˜์ƒ ํŠœํ† ๋ฆฌ์–ผ ์ œ์ž‘์„ ์‹œ์ž‘ํ•  ์˜ˆ์ •์ž…๋‹ˆ๋‹ค. "ํฌ์ŠคํŠธ ๋ณต์ œํ•˜๋Š” ๋ฐฉ๋ฒ•", "ํฌ์ŠคํŠธ ์ž๋™ ๋ฒˆ์—ญํ•˜๋Š” ๋ฐฉ๋ฒ•", "RSS ํ”ผ๋“œ์—์„œ ํฌ์ŠคํŠธ ๊ฐ€์ ธ์˜ค๋Š” ๋ฐฉ๋ฒ•" ๋“ฑ ๋‹ค์–‘ํ•œ ๋ฐ๋ชจ๊ฐ€ ํฌํ•จ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค. ๊ธฐ๋Œ€ํ•ด ์ฃผ์„ธ์š”!

์ด ์ƒˆ ์‚ฌ์ดํŠธ๋ฅผ ๋‘˜๋Ÿฌ๋ณด์‹œ๊ณ  ํ”ผ๋“œ๋ฐฑ์„ ๋‚จ๊ฒจ์ฃผ์„ธ์š”: ๋งˆ์Œ์— ๋“œ์…จ๋‚˜์š”? ์•„๋‹ˆ๋ฉด ๊ทธ๋ ‡์ง€ ์•Š์œผ์…จ๋‚˜์š”? ์–ด๋–ค ์ ์„ ๊ฐœ์„ ํ•˜๋ฉด ์ข‹์„๊นŒ์š”?

Gato GraphQL์„ ์œ„ํ•œ ์ƒˆ๋กœ์šด Next.js WordPress ์Šคํƒ€ํ„ฐ

Colby Fayock์˜ Next.js WordPress starter๋Š” Next.js์™€ GraphQL์„ ํ™œ์šฉํ•˜์—ฌ ํ—ค๋“œ๋ฆฌ์Šค WordPress ์‚ฌ์ดํŠธ๋ฅผ ๋งŒ๋“ค๊ธฐ ์œ„ํ•œ ํ”„๋กœ์ ํŠธ์ž…๋‹ˆ๋‹ค.

์ด ํ”„๋กœ์ ํŠธ๊ฐ€ WPGraphQL์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•˜๊ณ  ์žˆ์–ด์„œ, Gato GraphQL์—์„œ๋„ ๋™์ž‘ํ•˜๋„๋ก ํฌํฌํ•˜์—ฌ ์ˆ˜์ •ํ•˜๊ธฐ๋กœ ๊ฒฐ์ •ํ–ˆ์Šต๋‹ˆ๋‹ค.

๊ทธ ๊ฒฐ๊ณผ๋ฌผ์ด GatoGraphQL/next-wordpress-starter์ด๋ฉฐ, ์ด๋Š” Gato GraphQL ๊ธฐ๋ฐ˜์˜ Next.js WordPress ์Šคํƒ€ํ„ฐ์ž…๋‹ˆ๋‹ค.

๊ผญ ํ™•์ธํ•ด ๋ณด์„ธ์š”!

๋˜ํ•œ leoloso/next-wordpress-starter๋„ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค. ์ด๋ฅผ ํ†ตํ•ด WPGraphQL์ด๋‚˜ Gato GraphQL ์ค‘ ์–ด๋А ๊ฒƒ์ด๋“  ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค (ํ™˜๊ฒฝ ๋ณ€์ˆ˜๋กœ ์ง€์ •ํ•˜๊ธฐ๋งŒ ํ•˜๋ฉด ๋˜๋ฉฐ, ๋‹ค๋ฅธ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์€ ์—†์Šต๋‹ˆ๋‹ค). ์ด ํ”„๋กœ์ ํŠธ๊ฐ€ Colby Fayock์˜ ์Šคํƒ€ํ„ฐ์— ๋ณ‘ํ•ฉ๋˜๊ธฐ๋ฅผ ๊ธฐ๋Œ€ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹คโ€ฆ ๊ทธ๊ฒƒ์€ ์ •๋ง ๋ฉ‹์ง„ ์ผ์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค ๐Ÿ˜Ž

Gato GraphQL์šฉ Next.js WordPress ์Šคํƒ€ํ„ฐ๋ฅผ ์‚ฌ์šฉํ•œ ์›น์‚ฌ์ดํŠธ
Gato GraphQL์šฉ Next.js WordPress ์Šคํƒ€ํ„ฐ๋ฅผ ์‚ฌ์šฉํ•œ ์›น์‚ฌ์ดํŠธ

WordCamp Asia 2024 ์ฐธ๊ฐ€

Gato GraphQL ํŒ€(์ฆ‰ ์ €, Leo!)์€ ๋Œ€๋งŒ ํƒ€์ด๋ฒ ์ด์—์„œ ์—ด๋ฆฐ WordCamp Asia 2024์— ์ฐธ๊ฐ€ํ–ˆ์Šต๋‹ˆ๋‹ค. ํ˜„์žฅ์—์„œ ๋งŒ๋‚˜ ๋ตŒ ๋ถ„๋“ค, ๋งŒ๋‚˜์„œ ์ •๋ง ๋ฐ˜๊ฐ€์› ์Šต๋‹ˆ๋‹ค! (๋ชจ๋“  ๋ถ„๋“ค๊ณผ ๋Œ€ํ™”๋ฅผ ๋‚˜๋ˆŒ ์ˆ˜ ์žˆ์–ด์„œ ๊ฐ์‚ฌํ–ˆ์Šต๋‹ˆ๋‹ค.)

ํƒ€์ด๋ฒ ์ด์—์„œ ์นœ๊ตฌ๋“ค๊ณผ ํ•จ๊ป˜ํ•œ Leo(์™ผ์ชฝ)
ํƒ€์ด๋ฒ ์ด์—์„œ ์นœ๊ตฌ๋“ค๊ณผ ํ•จ๊ป˜ํ•œ Leo(์™ผ์ชฝ)

๋‹ค์Œ์—๋Š” ํ† ๋ฆฌ๋…ธ์—์„œ ์—ด๋ฆฌ๋Š” WordCamp Europe 2024์— ์ฐธ๊ฐ€ํ•  ์˜ˆ์ •์ž…๋‹ˆ๋‹ค. ์ฐธ๊ฐ€ํ•˜์‹ค ์˜ˆ์ •์ธ๊ฐ€์š”? ๊ทธ๋ ‡๋‹ค๋ฉด ๊ผญ ๋งŒ๋‚˜์š”!

Gato GraphQL v2.2.2 ์ถœ์‹œ

์˜ค๋Š˜ Gato GraphQL v2.2.2๋ฅผ ์ถœ์‹œํ–ˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฒ„์ „์€ ๊ณง ์ถœ์‹œ๋  WordPress 6.5๋ฅผ ์œ„ํ•œ ๋ธ”๋ก ๋ฐ์ดํ„ฐ ์ฟผ๋ฆฌ ํ˜ธํ™˜์„ฑ ์ˆ˜์ • ์‚ฌํ•ญ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

๋ฆด๋ฆฌ์Šค ๋…ธํŠธ๋Š” ์—ฌ๊ธฐ์—์„œ ํ™•์ธํ•˜์‹ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.


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

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