{"id":274,"date":"2025-12-03T14:30:00","date_gmt":"2025-12-03T05:30:00","guid":{"rendered":"https:\/\/hed-g.me\/?p=274"},"modified":"2025-11-25T14:27:41","modified_gmt":"2025-11-25T05:27:41","slug":"rest-api%ec%99%80-graphql","status":"publish","type":"post","link":"https:\/\/hed-g.me\/?p=274","title":{"rendered":"REST API\uc640 GraphQL"},"content":{"rendered":"\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">API\ub780<\/h2>\n\n\n\n<p>API(Application Programming Interface)\ub294<\/p>\n\n\n\n<p>\ud074\ub77c\uc774\uc5b8\ud2b8(\ud504\ub860\ud2b8\uc5d4\ub4dc)\uc640 \uc11c\ubc84(\ubc31\uc5d4\ub4dc)\uac00 \ub370\uc774\ud130\ub97c \uc8fc\uace0\ubc1b\ub294 \uc57d\uc18d\uc774\ub2e4.<\/p>\n\n\n\n<p>\ub370\uc774\ud130\ub97c \uc5b4\ub5bb\uac8c \uc694\uccad\ud558\uace0, \uc5b4\ub5a4 \ud615\ud0dc\ub85c \ubc1b\uc744 \uac83\uc778\uc9c0\ub97c \uc815\uc758\ud558\ub294 \uaddc\uce59\uc774\uba70,<\/p>\n\n\n\n<p>\uc774 \uc57d\uc18d\uc758 \uad6c\uc870\ub294 REST\uc640 GraphQL\ub85c \ub098\ub25c\ub2e4.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">REST API<\/h2>\n\n\n\n<p>REST(Representational State Transfer)\ub294 2000\ub144\ub300 \ucd08\ubd80\ud130 \uc6f9\uc758 \ud45c\uc900\uc73c\ub85c \uc790\ub9ac\uc7a1\uc558\ub2e4. \uc790\uc6d0(Resource) \uc911\uc2ec\uc758 \uc124\uacc4\ub41c \uad6c\uc870.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\ud2b9\uc9d5<\/h3>\n\n\n\n<p>\uac01 \uc790\uc6d0\uc740 \uace0\uc720\ud55c URL\ub85c \ud45c\ud604\ub41c\ub2e4.<\/p>\n\n\n\n<p>HTTP \uba54\uc11c\ub4dc(GET, POST, \u2026)\ub85c \ub3d9\uc791\uc744 \uad6c\ubd84\ud558\uba70, \ub3d9\uc791\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\uc870\ud68c(GET)<\/li>\n\n\n\n<li>\uc0dd\uc131(POST)<\/li>\n\n\n\n<li>\uc218\uc815(PUT\/PATCH)<\/li>\n\n\n\n<li>\uc0ad\uc81c(DELETE)<\/li>\n<\/ul>\n\n\n\n<p>REST\ub294 \uc9c1\uad00\uc801\uc774\uace0 \ub2e8\uc21c\ud558\uba70, URL\uc744 \ubcf4\uba74 <strong>\ubb34\uc2a8 \ub3d9\uc791\uc744 \ud558\ub294\uc9c0<\/strong> \ud55c\ub208\uc5d0 \ud30c\uc545\ud558\uae30 \uc27d\ub2e4.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">GraphQL<\/h2>\n\n\n\n<p>GraphQL\uc740 2015\ub144 Facebook\uc774 \ub9cc\ub4e0 \ucffc\ub9ac \uc5b8\uc5b4\ub85c,<\/p>\n\n\n\n<p>REST\uac00 \uc5d4\ub4dc\ud3ec\uc778\ud2b8 \uc911\uc2ec\uc774\ub77c\uba74- GraphQL\uc740 <strong>\uc694\uccad \ub370\uc774\ud130 \uc911\uc2ec<\/strong>\uc774\ub2e4.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>query {\n  user(id: 1) {\n    name\n    email\n    posts(limit: 2) {\n      title\n      likes\n    }\n  }\n}\n<\/code><\/pre>\n\n\n\n<p>\uc774 \ud55c \uc904\uc758 \ucffc\ub9ac\ub85c \uc0ac\uc6a9\uc790 \uc815\ubcf4\uc640 \uac8c\uc2dc\uae00\uae4c\uc9c0 \ud55c \ubc88\uc5d0 \uac00\uc838\uc62c \uc218 \uc788\ub2e4.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\ud2b9\uc9d5<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\ub2e8\uc77c \uc5d4\ub4dc\ud3ec\uc778\ud2b8(\/graphql)<\/li>\n\n\n\n<li>\ud544\uc694\ud55c \ub370\uc774\ud130\ub9cc \uc694\uccad(over-fetching \ubc29\uc9c0)<\/li>\n\n\n\n<li>\ud558\ub098\uc758 \uc694\uccad\uc73c\ub85c \uc5ec\ub7ec \ub9ac\uc18c\uc2a4 \uacb0\ud569(under-fetching \ud574\uacb0)<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Over-Fetching \/ Under-Fetching \ub450 \ubb38\uc81c\ub97c \ubaa8\ub450 \ud574\uacb0\ud560 \uc218 \uc788\ub294 GraphQL<\/h3>\n\n\n\n<p>\uae30\uc874 REST\ub294 \ub370\uc774\ud130\uac00 \uacfc\ud558\uac8c \uc624\uac70\ub098 \ubd80\uc871\ud558\uac8c \uc624\ub294 \uc0c1\ud669\uc774 \uc7a6\ub2e4\ub294 \ud55c\uacc4\uc810\uc744 \uac16\uace0 \uc788\ub2e4. \uc774\ub97c \ud574\uacb0\ud558\ub824\uba74 \ubcc4\ub3c4\uc758 API \uc5d4\ub4dc\ud3ec\uc778\ud2b8\ub97c \uc0c8\ub85c \ub9cc\ub4e4\uc5b4\uc57c \ud588\ub2e4.<\/p>\n\n\n\n<p>GraphQL\uc744 \ud1b5\ud574 \ud544\uc694\ud55c \ud544\ub4dc\ub9cc \uc120\ud0dd\uc801\uc73c\ub85c \uc694\uccad, \ub530\ub77c\uc11c \ub124\ud2b8\uc6cc\ud06c\uc758 \ud6a8\uc728\uc744 \ud5a5\uc0c1\uc2dc\ud0ac \uc218 \uc788\uace0 \uc5ec\ub7ec \ub9ac\uc18c\uc2a4\ub97c \ud55c \ubc88\uc758 \uc694\uccad\uc73c\ub85c \uacb0\ud569\ud560 \uc218 \uc788\uac8c \ub418\uc5c8\ub2e4.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code># REST\uc5d0\uc11c\ub294 \ub450 \ubc88 \uc694\uccad\ud574\uc57c \ud558\ub294 \uac78 \ud55c \ubc88\uc5d0 \ucc98\ub9ac\nquery {\n  user(id: 1) {\n    name\n    posts {\n      title\n    }\n  }\n}\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\uc751\ub2f5 \uad6c\uc870 \ube44\uad50<\/h2>\n\n\n\n<p>GraphQL\uc740 \ud074\ub77c\uc774\uc5b8\ud2b8\uac00 \uc694\uccad\ud55c \ud544\ub4dc\ub9cc \uc815\ud655\ud788 \ubc18\ud658\ud55c\ub2e4.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">REST<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>{\n  \"id\": 1,\n  \"name\": \"Jihyun\",\n  \"email\": \"jihyun@example.com\",\n  \"phone\": \"010-1234-5678\"\n}\n<\/code><\/pre>\n\n\n\n<p>GraphQL<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>{\n  \"data\": {\n    \"user\": {\n      \"name\": \"Jihyun\"\n    }\n  }\n}\n<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\uce90\uc2f1\uacfc \ub124\ud2b8\uc6cc\ud06c \ud6a8\uc728\uc131\uc5d0\uc11c<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>REST<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>HTTP\uc758 \uae30\ubcf8 \uce90\uc2f1(ETag, Cache-Control)\uc744 \ud65c\uc6a9\ud558\uae30 \uc26c\uc6c0.<\/li>\n\n\n\n<li>URL\uc774 \uba85\ud655\ud558\ubbc0\ub85c \ube0c\ub77c\uc6b0\uc800 \uce90\uc2dc, CDN \uce90\uc2dc\uc5d0\ub3c4 \uc720\ub9ac.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>GraphQL<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\uc694\uccad\uc774 POST \uae30\ubc18\uc774\ub77c \uce90\uc2f1\uc774 \uc5b4\ub835\ub2e4.<\/li>\n\n\n\n<li>\uce90\uc2dc\ub294 \ub300\ubd80\ubd84 <strong>\ud074\ub77c\uc774\uc5b8\ud2b8 \ub2e8\uc5d0\uc11c \uc218\ub3d9 \uad00\ub9ac<\/strong> (\uc608: Apollo Client, Relay).<\/li>\n\n\n\n<li>\ub300\uc2e0 GraphQL\uc740 \ubd80\ubd84 \uc5c5\ub370\uc774\ud2b8(Partial Cache Update)\uac00 \uac00\ub2a5\ud574, \uc138\ubc00\ud55c \uce90\uc2dc \uc81c\uc5b4\uc5d4 \uc624\ud788\ub824 \uac15\uc810\uc744 \uac00\uc9c4\ub2e4.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>\uc5d0\ub7ec \ucc98\ub9ac \ubc0f \ud0c0\uc785 \uc548\uc815\uc131\uc5d0\uc11c\ub294?<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>REST<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\uc8fc\ub85c HTTP \uc0c1\ud0dc \ucf54\ub4dc(200, 404, 500) \uae30\ubc18.<\/li>\n\n\n\n<li>\ub2e8\uc21c\ud558\uc9c0\ub9cc \uc138\ubc00\ud55c \uc5d0\ub7ec \uad6c\ubd84\uc774 \uc5b4\ub824\uc6c0.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>GraphQL<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\uc751\ub2f5 \ubcf8\ubb38\uc5d0 errors \ud544\ub4dc\uac00 \ud3ec\ud568\ub418\uc5b4, \ubd80\ubd84 \uc131\uacf5\/\ubd80\ubd84 \uc2e4\ud328\ub97c \uba85\ud655\ud788 \ud45c\ud604 \uac00\ub2a5.<\/li>\n\n\n\n<li>\uc2a4\ud0a4\ub9c8 \uae30\ubc18(Type System)\uc774\ub77c \ucef4\ud30c\uc77c \ud0c0\uc784\uc5d0\uc11c \ud0c0\uc785 \uac80\uc99d \uac00\ub2a5.<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\uc5b8\uc81c\ub098 GraphQL \uc0ac\uc6a9\uc774 \uc88b\uc740\uac78\uae4c?<\/h2>\n\n\n\n<p>API \uc548\uc815\uc131\uc774 \uc911\uc694\ud558\uac70\ub098, \ub2e8\uc21c CRUD \ud658\uacbd\uc5d0\uc5d0\uc11c\ub294 REST\uac00 \ud6a8\uc728\uacfc \ud3b8\ub9ac\uc131\uc744 \ub354 \uac16\ucd98 \uc120\ud0dd\uc9c0\uac00 \ub41c\ub2e4.<\/p>\n\n\n\n<p>\ub2e8, \ubaa8\ubc14\uc77c \ud658\uacbd\uc774\ub098 \ub300\ud654\ud615 \ub370\uc774\ud130, \ubcf5\uc7a1\ud55c UI\ub97c \uc694\ud558\ub294 \ud658\uacbd\uc5d0\uc11c\ub294 GraphQL\uc744 \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \uc801\ud569\ud558\ub2e4.<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>\ud56d\ubaa9<\/th><th>REST<\/th><th>GraphQL<\/th><\/tr><\/thead><tbody><tr><td>\uc124\uacc4 \ucca0\ud559<\/td><td>\uc790\uc6d0(Resource) \uc911\uc2ec<\/td><td>\ub370\uc774\ud130(Query) \uc911\uc2ec<\/td><\/tr><tr><td>\uc5d4\ub4dc\ud3ec\uc778\ud2b8<\/td><td>\uc5ec\ub7ec \uac1c<\/td><td>\ub2e8\uc77c \/graphql<\/td><\/tr><tr><td>\uc694\uccad \ub370\uc774\ud130 \uc81c\uc5b4<\/td><td>\uc11c\ubc84 \uacb0\uc815<\/td><td>\ud074\ub77c\uc774\uc5b8\ud2b8 \uacb0\uc815<\/td><\/tr><tr><td>\uce90\uc2f1<\/td><td>\ube0c\ub77c\uc6b0\uc800\/CDN \uce5c\ud654\uc801<\/td><td>\uc218\ub3d9 \uad00\ub9ac \ud544\uc694<\/td><\/tr><tr><td>\uc694\uccad \ud6a8\uc728\uc131<\/td><td>Over\/Under-fetch \uac00\ub2a5\uc131 \uc788\uc74c<\/td><td>\ud544\uc694\ud55c \ub370\uc774\ud130\ub9cc \uc815\ud655\ud788<\/td><\/tr><tr><td>\ubcf5\uc7a1\ud55c \uad00\uacc4 \ub370\uc774\ud130<\/td><td>\ubcc4\ub3c4 \uc5d4\ub4dc\ud3ec\uc778\ud2b8 \ud544\uc694<\/td><td>\ud55c \ucffc\ub9ac\ub85c \uacb0\ud569 \uac00\ub2a5<\/td><\/tr><tr><td>\ud559\uc2b5 \ub09c\uc774\ub3c4<\/td><td>\ub0ae\uc74c<\/td><td>\uc911\uac04 \uc774\uc0c1<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>\uc989, \uc2e4\ubb34\uc801\uc73c\ub85c\ub294 REST, GraphQL \uc744 \uc801\uc808\ud55c \uc0c1\ud669\uc5d0 \ub9de\uac8c \ud63c\uc6a9\ud574\uc11c \uc0ac\uc6a9\ud55c\ub2e4.<\/p>\n\n\n\n<p>\uc608\ub97c \ub4e4\uc5b4, REST\ub97c \uae30\ubcf8 API\ub85c \uc0ac\uc6a9\ud558\ub418 GraphQL\uc744 \uace0\uc815\ub418\uc9c0 \uc54a\uc740 \ub370\uc774\ud130 \uc694\uccad(\ub300\uc2dc\ubcf4\ub4dc, \uac80\uc0c9 \uacb0\uacfc, \ud544\ud130)\uc6a9\uc73c\ub85c \uc0ac\uc6a9\ud558\ub294 \uc2dd\uc774\ub2e4.<\/p>\n\n\n\n<p>\u2192 GraphQL\uc740 \ube60\ub978 UI \ubc18\uc751\uc131\uacfc \uc720\uc5f0\ud55c \ub370\uc774\ud130 \uc870\ud569\uc774 \ud544\uc694\ud560 \ub54c \uc0ac\uc6a9\ud558\uba74 \ub41c\ub2e4.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>API\ub780 API(Application Programming Interface)\ub294 \ud074\ub77c\uc774\uc5b8\ud2b8(\ud504\ub860\ud2b8\uc5d4\ub4dc)\uc640 \uc11c\ubc84(\ubc31\uc5d4\ub4dc)\uac00 \ub370\uc774\ud130\ub97c \uc8fc\uace0\ubc1b\ub294 \uc57d\uc18d\uc774\ub2e4. \ub370\uc774\ud130\ub97c \uc5b4\ub5bb\uac8c \uc694\uccad\ud558\uace0, \uc5b4\ub5a4 \ud615\ud0dc\ub85c \ubc1b\uc744 \uac83\uc778\uc9c0\ub97c \uc815\uc758\ud558\ub294 \uaddc\uce59\uc774\uba70, \uc774 \uc57d\uc18d\uc758 \uad6c\uc870\ub294 REST\uc640 GraphQL\ub85c \ub098\ub25c\ub2e4. REST API REST(Representational State Transfer)\ub294 2000\ub144\ub300 \ucd08\ubd80\ud130 \uc6f9\uc758 \ud45c\uc900\uc73c\ub85c \uc790\ub9ac\uc7a1\uc558\ub2e4. \uc790\uc6d0(Resource) \uc911\uc2ec\uc758 \uc124\uacc4\ub41c \uad6c\uc870. \ud2b9\uc9d5 \uac01 \uc790\uc6d0\uc740 \uace0\uc720\ud55c URL\ub85c \ud45c\ud604\ub41c\ub2e4. HTTP \uba54\uc11c\ub4dc(GET, POST, \u2026)\ub85c \ub3d9\uc791\uc744 \uad6c\ubd84\ud558\uba70, \ub3d9\uc791\uc740 \ub2e4\uc74c\uacfc \uac19\ub2e4. REST\ub294 \uc9c1\uad00\uc801\uc774\uace0 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[44],"tags":[179,194,180,181],"class_list":["post-274","post","type-post","status-publish","format-standard","hentry","category-frontend","tag-api","tag-graphql","tag-rest-api","tag-181"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/posts\/274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hed-g.me\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=274"}],"version-history":[{"count":1,"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/posts\/274\/revisions"}],"predecessor-version":[{"id":275,"href":"https:\/\/hed-g.me\/index.php?rest_route=\/wp\/v2\/posts\/274\/revisions\/275"}],"wp:attachment":[{"href":"https:\/\/hed-g.me\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=274"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hed-g.me\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=274"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hed-g.me\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}