Add GitHub Pinned Repositories to React & Next.js with the GitHub GraphQL API

Learn how to use the GitHub GraphQL API to fetch your pinned repositories to display in a Next.js React App. We'll walk through generating a GitHub Personal Access Token, setting up Apollo Client with authentication, and creating a graphQL query to get our repository data.
🗒️ Read More
spacejelly.dev...
💾 Code
github.com/col...
🔔 Subscribe for more tech and developer videos
www.youtube.co...
🐦 Get updates straight to your Twitter @colbyfayock
/ colbyfayock
📸 Catch the next stream live on Twitch @colbyfayock
/ colbyfayock
✉️ Or a newsletter right to your inbox!
www.colbyfayoc...
💝 Sponsor me for more free content like this!
GitHub: github.com/spo...
Other: [e-mail]
👨‍🚀 Brought to by colbyfayock.com
www.colbyfayoc...
🎥 Want to know what A/V equipment I use?
www.colbyfayoc...
🧰 More Resources
Get started with Apollo Client
www.apollograp...
Apollo Client Authentication
www.apollograp...
Forming calls with GraphQL
docs.github.co...
Create Next App
nextjs.org/doc...
🎼 Music
Music from Uppbeat (free for Creators!):
uppbeat.io/t/r...
License code: VH9M1NS5Q4SCNY0X
#colbyfayock #github #opensource #portfolio #graphql #nextjs #webdevelopment

[@colbyfayock]

Learn how to build a full stack Next.js app in my upcoming course: colbyfayock.com/course

[@sahildhanavade1191]

make a vedio on how to use github apps

[@colbyfayock]

adding it to my list!

[@louisphilip_s]

This is awesome and super helpful! Thank you 🤩 your way of explaining is so good! Keep up the good work.

[@colbyfayock]

No problem 🙌

[@colbyfayock]

Next learn how to dynamically manage SEO meta tags in Next.js ruclips.net/video/8BrZeaw3sLQ/видео.html
Make sure to subscribe for more! ruclips.net/user/colbyfayock

[@sahildhanavade1191]

make a vedio on how to use github apps

[@colbyfayock]

@@sahildhanavade1191 hey thanks for the idea, not sure ill get to it soon but i'll add it to my list!

[@colbyfayock]

Get fresh tutorials and other free content straight to your inbox! colbyfayock.com/news

[@tatemo_labs]

Very good tutorial and it helped me. Thank you!

[@colbyfayock]

no problem!

[@pensums]

As usual, straight to the point. Thanks for this video. 😁

[@colbyfayock]

no problem! :)

[@arielbetti]

Very good video, congratulations for the didactic

[@colbyfayock]

thank you!

[@mcconfigbladetm1252]

12:02 i have an ApolloError Only absolute URLs are supported
please help

[@colbyfayock]

from my experience, this usually means that the endpoint isn't a fully formed URL, such as myendpoint.com/whatever

[@lugare3]

When I run a console.log on the pinnedItems prop, it returns undefined. Can someone help me?

[@colbyfayock]

hey did you happen to check out my code? github.com/colbyfayock/my-pinned-repos i havent tried this for a while, also could be possible the API changed, but i'd first check there

[@syrine3935]

@@colbyfayock I have the same problem

[@colbyfayock]

@@syrine3935 i just spun up my sample project i linked above, upgraded the dependencies for everything, and it seemed to work. did you make sure to apply the appropriate permissions to the access token? try adding a try/catch around the request and see if its throwing an error or not working properly

[@mattoattacko]

Cool video, mate!

[@colbyfayock]

thank you!

[@ghost32bit]

awesome

[@colbyfayock]

Thanks! 🙌

[@MdTausifMuftasinAbid]

Thanks, bro the tutorial was awesome and it helped me a lot. I'm really happy that I found you on RUclips 💗💗💗

[@colbyfayock]

no problem, happy ot hear it helped! :)

[@bilalsharif487]

this wont work deployment some reason

[@colbyfayock]

Do You have your environment variables set?

[@colbyfayock]

Also check the deploy or console logs

[@bilalsharif487]

@@colbyfayock i am so dump thank you so much it never accured to me why was it working locally, thank for asking appreciate so so much. thank you much umade the day

[@colbyfayock]

@@bilalsharif487 no problem 😁

[@oguzdurmaz4893]

thank you very much. I'm really happy that I found this channel

[@colbyfayock]

no problem, glad to hear that!

[@javidking63]

4:08
thats pretty much same as my token . at least 4 first words. :P

[@colbyfayock]

👀

[@trenom]

Great tutorial!

[@colbyfayock]

thank you!