Projects.

Some things I made

Cloudfront viewer info

Various viewer request info generated at edge by this website’s CDN. While this overview page is a static route and is composed of several other page.tsx components, via @slots, the viewer request feature uses the Next.js dynamic headers()  API so it has to live on its own dedicated route. (See Next.js parallel routes docs).

→ Go to viewer info

Go in browser

This widget executes a WASM program, built from Go. The program itself interprets arbitrary JavaScript text input, and evaluates it as Go, using Yaegi.

Output

    CloudFlare turnstile

    A playground to familiarize myself with CloudFlare’s turnstile service. Again, this overview route is static, and the @turnstileslot/page component is an async server component. While parts of it can be statically rendered, it uses the Next.js dynamic cookies() API to power both the "Client" and "Server" results. You can still view the playground below,you'll need to go to the dedicated route for a full working example.

    → Go to working turnstile playground

    Turnstile Playground

    SiteKeyDescriptionVisibilityDemo
    1x00000000000000000000AAAlways passesvisible
    2x00000000000000000000ABAlways blocksvisible
    1x00000000000000000000BBAlways passesinvisible
    2x00000000000000000000BBAlways blocksinvisible
    3x00000000000000000000FFForces an interactive challengevisible

    https://developers.cloudflare.com/turnstile/troubleshooting/client-side-errors/error-codes/

    https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations

    Logs viewer

    Pulling logs from AWS CloudWatch logs and displaying them in a reasonably pretty format.

    Function URL Latency
    Latency in milliseconds
    Lambda
    Invocations
    Fetched at:
    9:00:00 AM
    CloudFront
    Requests
    Fetched at:
    9:00:00 AM
    Log Stream NameTimestampMessageIngestion TimeEvent ID
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]0984f03d4173448d9497be401dda3cc01744462917516INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446291915738902823031809659483861830762956168841106055054278131712
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]879bb6d1b7e24faf9a9eed2138ce94e21744463201044INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446320146538902829354695344132852349177584669431813962790103941120
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]879bb6d1b7e24faf9a9eed2138ce94e21744463201266START RequestId: 0834dcbc-afde-4326-93f3-1a55d3ddc3e2 Version: $LATEST 174446320146538902829359646109566926147515005598888341899044431593473
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]879bb6d1b7e24faf9a9eed2138ce94e21744463204702END RequestId: 0834dcbc-afde-4326-93f3-1a55d3ddc3e2 174446321371838902829436271470069077368644135335408451756286676893696
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]879bb6d1b7e24faf9a9eed2138ce94e21744463204702REPORT RequestId: 0834dcbc-afde-4326-93f3-1a55d3ddc3e2 Duration: 3435.95 ms Billed Duration: 3436 ms Memory Size: 1024 MB Max Memory Used: 195 MB Init Duration: 218.24 ms 174446321371838902829436271470069077368644135335408451756286676893697
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]879bb6d1b7e24faf9a9eed2138ce94e21744463470701START RequestId: edf4b783-f9c1-4355-a8fb-9f30566b6aeb Version: $LATEST 174446347971838902835368247392133024593991069141369163533983693537280
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]5acd30ee6f7040bea27fcfa9b935edb21744463470969INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446347148838902835374223991846230800983051566684331676937777643520
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]391adaca25324f278b631bcf7490a97f1744463470973INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446347420938902835374313194827024923478906832153775415706343702528
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]ac806cec27544d788f690caaef53a3fb1744463470976INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446347603938902835374380097062620515350543865062352928991420743680
    2025/04/12/web-production-MyWebDefaultFunction[$LATEST]f83b604717ae487db4842657df839e621744463470984INIT_START Runtime Version: nodejs:20.v57 Runtime Version ARN: arn:aws:lambda:us-east-1::runtime:9d084cce5cc7578c503eb8fe4bf7891c94c8f5f0ccb036f3f8c3a01cf5212db6 174446347165238902835374558503024208760330372885878081147847038533632
    575 ms ago

    nextjs-components

    React components that I transcribed from Vercel’s Design System, years ago. — See the code on GitHub

    OpenGraph image for the nextjs-components GitHub repository