https://graphql.org/_next/static/chunks/pages/learn-0b31626f53fadad2.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3128],{71378:function(e,r,t){(window.__NEXT_P=window.__NEXT_P||[]).push(["/learn",function(){return t(20950)}])},56955:function(e,r,t){"use strict";t.d(r,{z:function(){return i}});var a=t(52676),s=t(4814),n=t(47198);function i(e){let r=(0,s.W)("relative flex items-center justify-center gap-2.5 font-normal text-base/none text-neu-0 bg-neu-900 hover:bg-neu-800 active:bg-neu-700 font-sans h-14 px-8 data-[size=md]:h-12 data-[variant=secondary]:bg-neu-100 dark:data-[variant=secondary]:bg-neu-100/80 dark:data-[variant=secondary]:hover:bg-neu-200/50 data-[variant=secondary]:text-neu-900 data-[variant=secondary]:hover:bg-neu-200/75 data-[variant=secondary]:active:bg-neu-200/90 data-[variant=tertiary]:bg-neu-100 data-[variant=tertiary]:text-neu-900 data-[variant=tertiary]:hover:bg-neu-200 data-[variant=tertiary]:active:bg-neu-300 gql-focus-visible [aria-disabled]:bg-neu-800 aria-disabled:pointer-events-none dark:data-[variant=tertiary]:bg-neu-900/10 dark:data-[variant=tertiary]:text-neu-900 dark:data-[variant=tertiary]:hover:bg-neu-900/[.125] dark:data-[variant=tertiary]:active:bg-neu-800/20 dark:data-[variant=tertiary]:ring-1 dark:data-[variant=tertiary]:ring-inset dark:data-[variant=tertiary]:ring-neu-900/20",e.isIconButton&&"!p-2 h-min",e.className),t={"data-size":e.size,"data-variant":e.variant};if("href"in e&&"string"==typeof e.href){let{className:s,size:i,isIconButton:l,disabled:o,children:c,...d}=e;return o&&(d.href=void 0),(0,a.jsx)(n.e,{className:r,"aria-disabled":o,...t,...d,children:c})}if(e.as){let{className:s,size:n,isIconButton:i,children:l,as:o,...c}=e;return(0,a.jsx)(o,{className:r,...t,...c,children:l})}let{className:i,size:l,isIconButton:o,children:c,...d}=e;return(0,a.jsx)("button",{className:r,...t,...d,children:c})}},17538:function(e,r,t){"use strict";t.d(r,{_:function(){return s}});var a=t(52676);function s(e){return(0,a.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",...e,children:(0,a.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6.66666 13.3332H5.33333V2.6665H6.66666V3.99984H7.99999V5.99984H9.33333V7.33317H10.6667V8.6665H9.33333V9.99984H7.99999V11.9998H6.66666V13.3332Z"})})}},20961:function(e,r,t){"use strict";t.d(r,{T:function(){return s}});var a=t(52676);function s(){return(0,a.jsx)("style",{children:".nextra-nav-container.sticky { position: fixed }"})}},20950:function(e,r,t){"use strict";t.r(r),t.d(r,{default:function(){return T},useTOC:function(){return B}});var a,s,n=t(52676),i=t(92937),l=t(45043),o=t(79428),c=t(56955),d=t(20961),h=t(4814),g=t(17538);function p(e){return e.toLowerCase().replace(/ & /g,"-and-").replace(/ /g,"-")}function u({sections:e,className:r,...t}){return(0,n.jsxs)("div",{...t,className:(0,h.W)("mt-2 w-full border border-neu-300 bg-neu-0/[.64] dark:border-neu-100 lg:mt-4",r),children:[(0,n.jsx)("h2",{className:"typography-body-lg px-4 py-2.5 text-center md:py-4",children:"What will you find here?"}),(0,n.jsx)("ul",{className:(0,h.W)("grid grid-flow-row-dense gap-px border-t border-inherit bg-neu-300 dark:bg-neu-100",e.length%3==0?"grid-cols-2 lg:grid-cols-[repeat(3,1fr)]":e.length>2?"grid-cols-2":"grid-cols-1",e.length>3&&"grid-rows-2"),children:e.map((r,t)=>{let{name:a,href:s}="string"==typeof r?{name:r,href:`#${p(r)}`}:r,i=e.length>2&&e.length%2==1&&t===e.length-1;return(0,n.jsx)("li",{className:i?e.length%3==0?"col-span-2 lg:col-span-1":"col-span-2":void 0,children:(0,n.jsxs)("a",{className:"flex h-full items-center gap-2 bg-neu-0 p-2 text-left hover:bg-neu-50 max-sm:text-sm sm:gap-2 sm:p-3 lg:py-5",href:s,children:[(0,n.jsx)(g._,{className:"size-4 shrink-0 translate-x-[0.5px]"}),a]})},t)})})]})}function x({heading:e,text:r,children:t,decoration:a,className:s}){return(0,n.jsxs)("section",{className:(0,h.W)("relative overflow-visible bg-neu-0 pt-[calc(var(--nextra-navbar-height)+24px)]",s),children:[a,(0,n.jsxs)("div",{className:"gql-section gql-container relative flex !max-w-screen-lg flex-col items-center gap-6 text-center lg:gap-8 xl:!max-w-screen-xl",children:[(0,n.jsx)("h1",{className:"typography-h1",children:e}),(0,n.jsx)("p",{className:"typography-body-md max-w-[80vw] text-pretty",children:r}),t]})]})}Object.fromEntries(Object.entries({video:"Featured videos",blog:"GraphQL Blog","tools-and-libraries":"Tools & Libraries",guide:"Guides",book:"Books","blog-or-newsletter":"Blogs & Newsletters",docs:"Documentation",event:"Events",post:"Community posts",list:"Community lists"}).map(([e,r])=>[e,p(r)]));var m=t(75271);function f({children:e,className:r,as:t="span",...a}){return(0,n.jsxs)(t,{className:(0,h.W)("typography-menu flex items-center gap-1 text-pri-base dark:text-pri-light",r),...a,children:[(0,n.jsx)(g._,{className:"size-4 translate-x-[0.5px]"}),e]})}var b=t(85454);

1function v({number:e,title:r,description:t,icon:a,section:s,href:i,className:l,...o}){return(0,n.jsx)("li",{className:(0,h.W)("flex text-neu-900",l),...o,children:(0,n.jsxs)("a",{href:i,className:"gql-focus-visible grid w-full border border-neu-200 bg-neu-0 transition-colors [grid-template-areas:'icon_header''desc_desc'] [grid-template-columns:72px_1fr] [grid-template-rows:auto_1fr] hover:ring hover:ring-neu-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 dark:border-neu-100 dark:hover:ring-neu-50 lg:[grid-template-areas:'icon_header_header''icon_desc_arrow'] lg:[grid-template-columns:190px_1fr_64px]",children:[(0,n.jsx)("span",{className:(0,h.W)("flex aspect-square h-full w-[72px] items-center justify-center border-neu-200 p-2 [grid-area:icon] dark:border-neu-100 lg:min-w-[190px]","getting-started"===s&&"bg-pri-lighter/10 dark:bg-pri-lighter/5","best-practices"===s&&"bg-sec-lighter dark:bg-sec-lighter/5"),children:a}),(0,n.jsxs)("span",{className:(0,h.W)("flex flex-col gap-1 px-2 [grid-area:header] lg:px-4",void 0===e?"pt-4 lg:pt-6":"pt-2 lg:pt-4"),children:[void 0!==e&&(0,n.jsxs)("span",{className:"typography-body-sm text-neu-700 max-lg:typography-body-md",children:["Lesson ",e]}),(0,n.jsx)("span",{className:"typography-h3 font-normal text-neu-900",children:r})]}),(0,n.jsx)("p",{className:"typography-body-sm text-pretty p-4 text-neu-900 [grid-area:desc] max-lg:typography-body-md max-lg:border-t max-lg:border-neu-200 dark:max-lg:border-neu-100",children:t}),(0,n.jsx)("span",{className:"hidden items-center justify-center place-self-end border-l border-t border-neu-200 p-4 [grid-area:arrow] dark:border-neu-100 lg:flex",children:(0,n.jsx)(b.Z,{className:"size-8 shrink-0 -rotate-90"})})]})})}function j({eyebrow:e,title:r,description:t,cta:a,items:s,firstIconsEager:i,className:l,...o}){let[d,g]=(0,m.useState)(!1);return(0,n.jsxs)("section",{className:(0,h.W)("gql-container gql-section flex items-start gap-8 max-lg:flex-col max-lg:pt-6 lg:gap-12 lg:pb-24 xl:gap-16",l),...o,children:[(0,n.jsx)("header",{className:"flex max-w-[720px] flex-col gap-6 text-left lg:max-w-[540px]",children:(0,n.jsxs)("div",{className:"flex flex-col gap-6",children:[(0,n.jsx)(f,{children:e}),(0,n.jsx)("h2",{className:"typography-h2 text-pretty text-neu-900",children:r}),(0,n.jsx)("p",{className:"typography-body-md text-pretty text-neu-800",children:t}),a]})}),(0,n.jsxs)("div",{children:[(0,n.jsx)("ul",{className:"grid grid-cols-1 justify-stretch gap-4 sm:max-lg:grid-cols-2 lg:gap-8",children:s.map((e,r)=>(0,n.jsx)(v,{number:r+1,title:e.title,description:e.description,href:e.href,section:e.section,className:(0,h.W)(!d&&"lg:[&:nth-child(n+4)]:hidden [&:nth-child(n+5)]:hidden"),icon:(0,n.jsx)("img",{src:e.icon,width:72,height:72,className:"aspect-square lg:size-[138px]",loading:r<2&&i?"eager":"lazy",alt:""})},r))}),!d&&(0,n.jsx)(c.z,{className:"mt-4 w-full lg:mt-8",variant:"secondary",onClick:()=>g(!0),children:"Show more"})]})]})}var y=t(48074),w="/_next/static/media/learn-blur-bean.58ffd7dd.webp";function L({className:e,style:r,...t}){return(0,n.jsx)("div",{role:"presentation",className:(0,h.W)("pointer-events-none absolute inset-0 bg-neu-50 [--end-1:#FFF] [--end-2:rgb(255_204_239/.2)] [--start-1:#FFEAF8] [--start-2:hsl(var(--color-sec-lighter))] dark:[--end-1:hsl(75,15%,5%)] dark:[--end-2:hsl(319,100%,10%)] dark:[--start-1:hsl(319,100%,14%)] dark:[--start-2:hsl(319,100%,30%)] sm:h-[360px] lg:h-[calc(100%-163px)]",e),style:{maskImage:`url(${w})`,WebkitMaskImage:`url(${w})`,maskSize:"2200px",WebkitMaskSize:"2200px",maskPosition:"50% 60%",WebkitMaskPosition:"50% 60%",maskRepeat:"no-repeat",WebkitMaskRepeat:"no-repeat",...r},...t,children:(0,n.jsx)(y.y,{evenClassName:"bg-[linear-gradient(180deg,var(--start-1)_-80%,var(--end-1)_102%)]",oddClassName:"bg-[linear-gradient(180deg,var(--start-2)_-80%,var(--end-2)_102%)]"})})}var N=t(17676),C=t(47198);function k(e){return(0,n.jsxs)("section",{...e,className:(0,h.W)("gql-section gql-container grid-rows-[auto_auto_1fr] *:[grid-column:1] lg:grid lg:grid-cols-[1fr_auto]",e.className),children:[(0,n.jsx)(f,{children:"FAQ"}),(0,n.jsx)("h2",{className:"typography-h2 mt-6",children:"Common questions"}),(0,n.jsx)("p",{className:"typography-body-md mt-6",children:"Find answers to the most common questions about GraphQL — from getting started to advanced use cases. This also covers frontend concerns and info about the official specification."}),(0,n.jsxs)("ul",{className:"row-span-full mt-6 ![grid-column:2] *:border-b *:border-neu-200 dark:*:border-neu-100 lg:w-[380px] xl:w-[496px]",children:[(0,n.jsx)(_,{title:"Getting started",href:"/faq#getting-started"}),(0,n.jsx)(_,{title:"General",href:"/faq#general"}),(0,n.jsx)(_,{title:"Best practices",href:"/faq#best-practices"}),(0,n.jsx)(_,{title:"Specification",href:"/faq#specification"}),(0,n.jsx)(_,{title:"Frontend",href:"/faq#frontend"}),(0,n.jsx)(_,{title:"Foundation",href:"/faq#foundation"})]})]})}function _({title:e,href:r}){return(0,n.jsx)("li",{className:"hover:!border-current",children:(0,n.jsxs)(C.e,{href:r,className:"typography-body-lg -mx-4 flex items-center justify-between p-4 text-neu-800 hover:text-neu-900 dark:text-neu-700",children:[e,(0,n.jsx)(b.Z,{className:"size-6 shrink-0 -rotate-90"})]})})}function q(e){return(0,n.jsxs)("svg",{viewBox:"0 0 100 100",fill:"currentColor",...e,children:[(0,n.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M50 6.90308L87.323 28.4515V71.5484L50 93.0968L12.677 71.5484V28.4515L50 6.90308ZM16.8647 30.8693V62.5251L44.2795 15.0414L16.8647 30.8693ZM50 13.5086L18.3975 68.2457H81.6025L50 13.5086ZM77.4148 72.4334H22.5852L50 88.2613L77.4148 72.4334ZM83.1353 62.5251L55.7205 15.0414L83.1353 30.8693V62.5251Z"}),(0,n.jsx)("circle",{cx:"50",cy:"9.3209",r:"8.82"}),(0,n.jsx)("circle",{cx:"85.2292",cy:"29.6605",r:"8.82"}),(0,n.jsx)("circle",{cx:"85.2292",cy:"70.3396",r:"8.82"}),(0,n.jsx)("circle",{cx:"50",cy:"90.6791",r:"8.82"}),(0,n.jsx)("circle",{cx:"14.7659",cy:"70.3396",r:"8.82"}),(0,n.jsx)("circle",{cx:"14.7659",cy:"29.6605",r:"8.82"})]})}function G(){return(G=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var a in t)({}).hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(null,arguments)}t(40769);var z=e=>m.createElement("svg",G({xmlns:"http://www.w3.org/2000/svg",fill:"

1currentColor",viewBox:"0 0 117 117"},e),a||(a=m.createElement("path",{d:"m83.727 74.571-2.669-7.583-3.514-9.986-2.542-7.226-3.328-9.457-3.866-10.985h-18.75l-2.994 8.506-2.668 7.583-13.253 37.662H42.51l3.88-10.993h18.753l-3.327-9.457H49.703l2.542-7.227 5.31-15.09.878-2.497.877 2.498 15.042 42.758.004.008h12.367z"})),s||(s=m.createElement("path",{d:"M109.409 29.796a2.387 2.387 0 0 0-3.25-.906 2.384 2.384 0 0 0-.905 3.25 53.685 53.685 0 0 1-49.852 79.916A53.688 53.688 0 0 1 46.162 6.198a53.7 53.7 0 0 1 37.196 4.694 7.3 7.3 0 0 0 .686 4.972 7.3 7.3 0 0 0 3.735 3.354 7.3 7.3 0 0 0 8.943-2.978 7.3 7.3 0 0 0 .98-4.923 7.3 7.3 0 0 0-7.123-6.174 7.3 7.3 0 0 0-4.734 1.668 58.459 58.459 0 1 0 23.565 22.985"})));function Q(e){return(0,n.jsx)("section",{...e,className:(0,h.W)("gql-section gql-container lg:pb-24",e.className),children:(0,n.jsxs)("div",{className:"mx-auto flex max-w-[960px] flex-col items-center",children:[(0,n.jsx)(f,{children:"Tutorials"}),(0,n.jsx)("h2",{className:"typography-h2 mt-6",children:"Training Courses"}),(0,n.jsx)("p",{className:"typography-body-md mt-6",children:"Get started or level up your GraphQL skills with these trusted tutorials."}),(0,n.jsxs)("ul",{className:"mt-4 flex flex-col gap-4 md:gap-8 lg:mt-8 lg:gap-12",children:[(0,n.jsx)("li",{children:(0,n.jsx)(W,{title:"GraphQL-JS tutorial",description:"Step-by-step guide to building schemas and executing queries with GraphQL.js.",icon:(0,n.jsx)(q,{}),href:"https://www.graphql-js.org/docs/"})}),(0,n.jsx)("li",{children:(0,n.jsx)(W,{title:"Apollo Odyssey",description:"Interactive courses for building GraphQL applications with Apollo's toolset.",icon:(0,n.jsx)(z,{}),href:"https://www.apollographql.com/tutorials/"})}),(0,n.jsx)("li",{children:(0,n.jsx)(W,{title:"Yoga GraphQL Server Tutorial",description:"Open source tutorial for creating modern GraphQL Servers in Node, CF Workers, Deno and others.",icon:(0,n.jsx)(H,{}),href:"https://the-guild.dev/graphql/yoga-server/tutorial/basic"})}),(0,n.jsx)("li",{children:(0,n.jsx)(W,{title:"GraphQL Tutorials",description:"Real World Fullstack GraphQL tutorials for developers by Hasura.",icon:(0,n.jsx)(M,{}),href:"https://hasura.io/learn/"})})]})]})})}function W({title:e,description:r,icon:t,href:a,...s}){return(0,n.jsxs)("a",{className:(0,h.W)("grid grid-cols-[1fr_auto] grid-rows-[auto_auto] flex-col border border-neu-200 bg-neu-50 [grid-template-areas:'title_icon''desc_arrow'] hover:ring hover:ring-neu-100 dark:border-neu-100 dark:bg-neu-50/50 dark:hover:ring-neu-50 lg:[grid-template-areas:'icon_title_.''icon_desc_arrow'] lg:[grid-template-columns:142px_1fr_

164px] lg:[grid-template-rows:1fr_auto]",s.className),href:a,target:"_blank",rel:"noreferrer",...s,children:[(0,n.jsx)("p",{className:"typography-h3 px-4 py-[18px] [grid-area:title] lg:px-4 lg:pb-2 lg:pt-6",children:e}),(0,n.jsx)("p",{className:"typography-body-md px-4 pb-4 [grid-area:desc] lg:pb-6 lg:pt-2",children:r}),(0,n.jsx)("span",{className:"flex items-center justify-center self-stretch border-inherit p-4 text-neu-600 [grid-area:icon] dark:text-neu-600 max-lg:border-l lg:border-r lg:p-10 [&>svg]:size-8 lg:[&>svg]:size-16",children:t}),(0,n.jsx)("span",{className:"flex place-content-center place-items-center place-self-stretch border-l border-t border-neu-200 p-4 [grid-area:arrow] dark:border-neu-100 lg:flex lg:place-self-end",children:(0,n.jsx)(b.Z,{className:"size-8 shrink-0 -rotate-90"})})]})}function H(){return(0,n.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32",fill:"currentColor",children:[(0,n.jsx)("path",{d:"M21.3619 6.38176H16.2964L19.3384 3.33972L15.9999 0L12.6602 3.33972L15.7022 6.38176H10.6367C9.98473 6.38176 9.35861 6.64131 8.89732 7.1026L0 15.9999L3.33972 19.3396L14.2606 8.41881C15.2213 7.4581 16.7786 7.4581 17.7393 8.41881L28.6601 19.3396L31.9998 15.9999L23.1013 7.10137C22.64 6.64008 22.0139 6.38053 21.3619 6.38053V6.38176Z"}),(0,n.jsx)("path",{d:"M16 25.3216L12.6607 28.6608L16 32L19.3392 28.6608L16 25.3216Z"}),(0,n.jsx)("path",{d:"M10.6378 19.042C9.98584 19.042 9.35972 19.3015 8.89843 19.7628L6.33121 22.33L9.67094 25.6698L14.2617 21.079C15.2224 20.1183 16.7797 20.1183 17.7404 21.079L22.3311 25.6698L25.6709 22.33L23.1036 19.7628C22.6423 19.3015 22.0162 19.042 21.3643 19.042H10.6378Z"})]})}function M(){return(0,n.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"30",height:"30",viewBox:"0 0 30 30",fill:"currentColor",children:(0,n.jsx)("path",{d:"M26.9074 0.23705C27.0924 -0.0477225 27.5073 -0.0844866 27.7301 0.173458C29.4047 2.10864 29.9427 7.29894 29.1215 10.007L29.0816 10.1341C28.7899 11.0215 28.7076 11.9592 28.8757 12.8702L28.9439 13.2408L29.0095 13.624C29.1263 14.3334 29.2185 15.0691 29.2185 15.6267C29.2185 23.4306 22.7405 29.7604 14.7466 29.7604C6.75605 29.7604 0.274442 23.4338 0.274442 15.6267C0.274442 15.0186 0.384138 14.1979 0.515892 13.4312L0.58326 13.0536C0.594521 12.9916 0.605915 12.9305 0.617441 12.8702C0.778805 12.0129 0.718393 11.1317 0.467801 10.2911L0.418517 10.1341C-0.459449 7.46805 0.0687614 2.14242 1.76985 0.17326C1.98069 -0.0677937 2.36423 -0.0505046 2.56157 0.194126L2.59257 0.23705L4.68792 3.44884C5.20918 4.08874 6.14199 4.23937 6.8415 3.79065C9.11551 2.33698 11.8317 1.49279 14.75 1.49279C17.6682 1.49279 20.3844 2.33678 22.658 3.79025C23.3377 4.22427 24.2319 4.10086 24.7587 3.51144L24.812 3.44864L26.9074 0.23705ZM14.7498 4.72167C13.0352 4.72167 11.4096 5.09667 9.9589 5.77333C6.34092 7.44778 3.78253 10.9612 3.55956 15.074C3.54872 15.2693 3.54302 15.4648 3.54247 15.6603C3.54247 21.6956 8.56664 26.6055 14.7464 26.6055C20.9261 26.6055 25.9535 21.6956 25.9571 15.6637C25.9571 15.4693 25.9503 15.2716 25.94 15.0774C25.717 10.9678 23.1586 7.45116 19.5406 5.77651C18.0866 5.09687 16.4644 4.72167 14.7498 4.72167ZM14.0055 10.8271C14.1045 10.8271 14.1983 10.8708 14.2593 10.9467L14.2832 10.9813L16.7392 15.0236L19.6026 19.8733C19.6314 19.9201 19.6466 19.9741 19.6466 20.0291C19.6466 20.0841 19.6314 20.138 19.6026 20.1849C19.5782 20.2271 19.5443 20.263 19.5036 20.2898C19.4629 20.3167 19.4165 20.3337 19.3681 20.3395L19.3248 20.3422H16.9961C16.897 20.3422 16.8034 20.2961 16.7424 20.2194L16.7183 20.1849L15.1887 17.5957L13.4845 20.1948C13.4588 20.2339 13.4249 20.2668 13.3851 20.2912C13.3453 20.3157 13.3006 20.3311 13.2542 20.3363L13.2134 20.3389H10.8506C10.7306 20.3389 10.6209 20.2753 10.566 20.1747C10.5421 20.1314 10.529 20.0831 10.5276 20.0337C10.5262 19.9843 10.5367 19.9353 10.5581 19.8907L10.5797 19.8532L13.7315 15.1575L11.3822 11.3026C11.3531 11.2554 11.3374 11.2011 11.3368 11.1456C11.3362 11.0901 11.3507 11.0355 11.3788 10.9877C11.4036 10.9448 11.438 10.9082 11.4793 10.8808C11.5206 10.8534 11.5677 10.8359 11.6169 10.8297L11.66 10.8269L14.0055 10.8271Z"})})}var F=t(43961);function B(e){return[]}var T=(0,i.c)(function(e){let r={br:"br",p:"p",...(0,o.a)(),...e.components};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(d.T,{}),"\n",(0,n.jsxs)(x,{className:"mb-4 lg:mb-8",heading:"Learn GraphQL",text:(0,n.jsxs)(n.Fragment,{children:["Get hands-on with the fundamentals of GraphQL. Start with the basics and see how it compares to other technologies.",(0,n.jsx)(r.br,{className:"max-lg:hidden"})," ","Then move on to best practices for designing better APIs."]}),decoration:(0,n.jsx)(L,{}),children:[(0,n.jsx)(c.z,{href:"/learn/introduction",className:"lg:w-fit",children:(0,n.jsx)(r.p,{children:"Start with the basics"})}),(0,n.jsx)(u,{sections:["Learn GraphQL","Tutorials","Best Practices","FAQ"],className:"max-w-[528px]"})]}),"\n",(0,n.jsx)(j,{id:"learn-graphql",eyebrow:"Learn GraphQL",title:"Getting started with GraphQL",description:"In this tutorial-style introduction to GraphQL, you'll learn the core concepts that power every GraphQL API. Follow a step-by-step path from basic queries to advanced features.",cta:(0,n.jsx)(c.z,{href:"/learn/introduction",className:"md:w-fit",children:"Start learning"}),firstIconsEager:!0,items:N.v["getting-started"]}),"\n",(0,n.jsx)(j,{id:"best-practices",eyebrow:"Best practices",title:"Practical guidelines",description:"Here you'll explore real-world strategies for designing and operating GraphQL APIs. These guides will help you build for scale and safety.",cta:(0,n.jsx)(c.z,{href:"/learn/best-practices",className:"md:w-fit",children:"Explore all best practices"}),items:N.v["best-practices"]}),"\n",(0,n.jsx)(j,{id:"schema-governance",eyebrow:"Schema governance",title:"Schema governance",description:"A healthy GraphQL API starts with a well-governed schema. Learn how to put review processes and automated checks in place so your schema stays consistent, safe, and easy to evolve as your team grows.",cta:(0,n.jsx)(c.z,{href:"/learn/schema-review",className:"md:w-fit",children:"Explore schema governance"}),items:N.v["schema-governance"]}),"\n",(0,n.jsx)(Q,{id:"tutorials"}),"\n",(0,n.jsx)(k,{id:"faq"}),"\n",(0,n.jsx)(F.h,{description:"Learning is just the beginning. Discover tools and other resources — or connect with the GraphQL community around the world.",links:[{href:"/resources",label:"Resources"},{href:"/community",label:"Community"}]})]})},"/learn",{filePath:"src/pages/learn/index.mdx",timestamp:1789481543e3,pageMap:l.v,frontMatter:{title:"Learn"},title:"Learn"},"undefined"==typeof RemoteContent?B:RemoteContent.useTOC)}},function(e){e.O(0,[3556,5043,2888,9774,179],function(){return e(e.s=71378)}),_N_E=e.O()}]);