Hello World!
Hi, I'm Joël Kuijper, a fullstack developer from the Netherlands. I'm currently working at De Indruk as a Full-Stack Developer.
This website is a place for me to write about stuff I make and learn about. If you are curious
about the tools and apps I use, you can find a list of my favorites here .
08-04-25, 08:38 * Creates a Zod schema for an array that filters out invalid elements during preprocessing.
* @ template T - Type extending ZodSchema
* @ param { T } schema - The Zod schema to validate individual array elements
* @ returns { ZodEffects<ZodArray<T>> } A new Zod schema that:
* 1. Converts non-array inputs into single-element arrays
* 2. Filters out elements that don't match the provided schema
* 3. Validates the resulting array against the schema
* const numberSchema = makeFilteredArraySchema(z.number());
* numberSchema.parse(['1', 2, '3', 4]); // Returns [2, 4]
function makeFilteredArraySchema < T extends ZodSchema >( schema : T ) {
return z . preprocess (( val ) => {
const array = Array . isArray ( val ) ? val : [ val ];
return array . filter (( item : unknown ) => schema . safeParse ( item ). success );
30-01-25, 23:17 export function objectEntries < T extends object >(
) : [ keyof T , T [ keyof T ]][] {
return Object . entries ( obj ) as [ keyof T , T [ keyof T ]][];
28-01-25, 18:07 Code snippet to easily setup offline caching for TanStack Query in a React Native app.
import { persister } from " @/lib/mmkv " ;
import { QueryClient , onlineManager } from " @tanstack/react-query " ;
import { PersistQueryClientProvider } from " @tanstack/react-query-persist-client " ;
import { useEffect , type PropsWithChildren } from " react " ;
import { useReactQueryDevTools } from " @dev-plugins/react-query " ;
import NetInfo from " @react-native-community/netinfo " ;
const queryClient = new QueryClient ({
staleTime: Number .POSITIVE_INFINITY,
gcTime: Number .POSITIVE_INFINITY,
export function QueryProvider ({ children } : PropsWithChildren ) {
useReactQueryDevTools ( queryClient );
return NetInfo . addEventListener (( state ) => {
const status = !! state . isConnected ;
onlineManager . setOnline ( status );
< PersistQueryClientProvider
. then (() => queryClient . invalidateQueries ())
persistOptions = {{ persister , maxAge: Number .POSITIVE_INFINITY }}
</ PersistQueryClientProvider >