KINDERAS.COM

This short article describes how to deploy a SvelteKit app inside a monorepo (using Turborepo) to Cloudflare pages.

In this article we'll describe how to use AWS Cognito for auth in a SvelteKit project. We will not be using any library such as AWS Amplify. The reason for this is that we want to understand all the steps required, and because external libraries can cause problems when running in Edge environments that doesn't support all of Node.js.

A Visual Studio Code (VSCode) launch config for SvelteKit that allows you to set breakpoints and debug your code inside VSCode. This works for both server side and client side debugging.

This post describes a way to use groq to search Sanity for content. This includes searching simple strings and portable text fields, then sorting the results by using the score and boost functions in groq.

This article is a complete guide to implementing document preview in Sanity Studio targeting a SvelteKit site. We'll take a look at the setup for Sanity in brief, and we will focus mainly on the SvelteKit part, since there are plenty of resources for the Sanity config.

A short post presenting an alternative to the official Sanity js client when querying data from a website running on Netlify Edge Functions.

Have you ever had the need to trigger a webhook on a schedule, like every hour? In this short article we'll take a look at how you can trigger a Vercel webhook every hour using Github workflows.

When using federated auth, such a Google or a custom oAuth & OpenId Connect setup, a user will in some cases expect to be signed out from the original provider as well as your Next application. In this post I'll go into detail on how this can be achieved using next-auth v4.

This article demos how to compare two array using groq queries in Sanity. This might be useful if you for example need to fetch articles with tags that overlap with a user specified list of tags.

This post demonstrates how to do validation on child fields of an image with alt text in Sanity. This is very useful when you want to all your images to feature not only an image, but also fields like alt text and maybe a caption.

This post presents a solution to the notorious «Invalid Hook Call» which can occur in projects using React. Especially when using monorepos. The solution explains in detail how to configure the «next.config.js» file to make sure that only one instance of React (and react-dom) is in use at the same time.

This is a step by step guide for debugging a Next.js project both for the server side and the client side using Visual Studio Code. This post describes the needed changes for the next config file, package.json and configuring launch configurations for VSCode.

Sometimes Gatsby will generate large html files. You can shed some of this size by not inlining the css in the HTML files. This post describes one approach to reduce the file size of the html files generated by Gatsby by removing inline styles from HTML pages.

This post describes how to set up Visual Studio Code (VSCode) to debug Parcel and Gatsby (build time and runtime) projects. A full launch configuration is provided in the post.

Tool tips can sometimes be useful to display things like help texts and similar. This post demonstrates how to create a tool tip without any JavaScript, only using HTML and CSS.

A quick tip showing how to use the «line-clamp» property of css to truncate the lines of text in a HTML element.

When using AWS Amplify and Hugo to build a static website, having different versions of Hugo locally and on Amplify can cause problems like syntax highlighting not working. This post explains how to fix that problem.

A discussion and guide on using Hugo and Sanity to create a JAMStack website powered by a CMS.

A step by step guide on hosting a static web-site on AWS S3 and serving it through AWS Cloudfront over https

A guide to optimizing the size of the AWS Lambda deploy package for Node.js

A step by step guide on hosting a static web-app on Amazon S3 and exposing it using a custom (https) domain through Cloudflare.

This quick-guide intends to explain the basics of configuring a private backend/service utilizing an Elastic Beanstalk app (EBS) residing within a VPC. The methods of the EBS will be made available through the API Gateway using a VPC Link.

A step by step guide to using the HTML Canvas element to create a simple free hand drawing application

A step by step guide to using HTML «contentEditable» attribute on an HTML element to create a simple rich text editor