Space Jelly
Posts
How to Add Custom Fields in Headless WordPress with ACF & WPGraphQL
By Colby Fayock
WordPress is King CMS for a reason. It provides a great editing experience and is well known for those who consider themselves technical or not. But with a default installation, the content you can manage is a bit limited. How can we extend that with custom fields via ACF and use that data when querying WPGraphQL in our apps?
How to Authenticate Next.js Apps with Twitter & NextAuth.js
Part of what makes the web a great place is the ability for developers to personalize content and app experiences to the person using it. How can we add authentication to a Next.js app to tailor those experiences for our visitors?
How to Send Emails with SendGrid and Next.js Serverless Functions for a Contact Form
Being able to communicate with others is a critical component of what makes people and businesses collaborate on the web. That usually starts with having some kind of form or interaction that triggers a notification or email. How can we use SendGrid to make sure those emails get delivered?
How to Source MDX Content in Next.js to Dynamically Create Pages for a Blog
Markdown is a popular format for authoring. MDX takes that up a notch giving authors more tools to create interactive experiences. How can we take advantage of MDX in frameworks like Next.js to build projects with content sourced from MDX?
How to Manage SEO in Headless WordPress with Yoast SEO and WPGraphQL
SEO is a critical part of any website or application. Without it, Google might not be able to find your page or it might not look right in search results or social platforms. How can we leverage popular WordPress plugin Yoast SEO using a headless WordPress instance with Next.js and WPGraphQL?
How to Create a Headless WordPress Blog with Next.js WordPress Starter
Blogs are a great way to get down your thoughts to help others learn, keep track of progress, or even to help reinforce an idea to help yourself learn. WordPress is a popular blog platform that’s been around for a while and Next.js is a modern popular web framework for building React apps. How can we use them together to build a fast and reliable blog?
How to Use Cloudinary Images in Next.js with Blurred Placeholders
Images are a large part of how the web is made. It creates beautiful and interesting things that makes our experiences dynamic. But too much of that, especially when not optimized, can create bad experiences, with slow loading pages. That’s where Next.js and Cloudinary step in to provide powerful optimizations and rich dynamic images.
How to Create a Twitch Chat Bot with Node.js, TMI.js, & Heroku
What is a Twitch chat bot? If you’ve spent some time watching some Twitch streams, you may have noticed users posting with the word “bot” in their name or some sort of automated system that could be used for anything from ads to custom commands. That chat bot is essentially a server that’s hosted somewhere...
How to Use Cloudflare Pages to Host & Deploy a Next.js App
Building dynamic web apps that can be statically hosted, commonly known as the Jamstack, is a powerful way to help provide a fast and reliable experience to your website visitors. There are a lot of options for how you can do this, such as AWS S3, Azure Static Web Apps, Netlify, and Vercel, but there’s a new kid on the block, coming from a dominant force on the web: Cloudflare Pages.
How to Create a Custom GitHub Action with Node & JavaScript
GitHub Actions are a powerful tool to automate all kinds of tasks in your workflow. While there are a ton of options available on the Marketplace, those existing Actions might not fit your use case or infrastructure. How can we write our own GitHub Action to automate our project’s tasks?
How to run Visual Regression Testing on a Next.js App with Cypress and Applitools
A critical component of any development project is the tests that make sure that project is always doing exactly what it’s supposed to be doing. There are a ton of testing tools available to us, but not all of them test what someone actually experiences. How can we use Applitools to visually test our project and make sure it’s actually working right?
How to Fetch GraphQL Data in Next.js with Apollo GraphQL
Next.js has been steadily growing as a must-have tool for developers creating React apps. Part of what makes it great is its data fetching APIs to request data for each page. But how can we use that API to make GraphQL queries for our app?
How to Use Github Actions to Automate Tests and Slack Notifications
Automation is a powerful tool. It both saves us time and can help reduce human error. But automation can be tough and can sometimes prove to be costly. How can Github Actions help harden our code and give us more time to work on features instead of bugs?