Cabinet of experiments

Inspired by Igor, Mariana, Emil, Rauno and many others.

  • ComCord

    The project was built while I was sufferring the pain from remote collaboration for not knowing what happened within the team when I make other products. It's a Discord bot combined with web application for configuration. I eventually turned it into a start up and applied for Y-Combinator. Where I learnt the most for developing in Next.js, Tailwind, Javascript, user experience, support engineer and working in a team. The project had to fold but you can see the product demo on Youtube

    Depth based blur image
  • Open source LinkTree alternative - zmzlois


    Written in Golang. I was curious about how overengineered a Todo list (everyone's loved and hated) can be? I guess it's something similar to LinkTree. The idea started with "why do you need to pay LinkTree for analytics and fancy features" it's an overbloated next.js app + gatsby site (it has gotten much slower over the years) and the project itself its a 1 person product can be built in 3 days (I meant about 72 hours). This is one of my speed build challenges to see how fast I can build with Golang - a new languages I learnt in one month. WIP (sorry Go I have Rust to do).

  • K3s the sane way

    K3s the sane way

    Deploy k3s on 4 globally distributed VPS instance with Ansible, Prometheus, Grafana and Traefik.

  • Docksible, a clean docker template to test ansible playbook - zmzlois


    A clean docker container to generate ssh keys on the fly for testing ansible playbook.

  • Global Business IT Approach logo

    7-hour speed build challenge - GBITA

    This is one my speed building challenges. Done for one of my clients. Email functionality provided by Resend. Frontend finished in 7 hours. Assets are hosted on Object Storage via AWS S3 and served via AWS' global CDN Cloudfront. Built with Next.js, TailwindCSS, TypeScript, and deployed Vercel.

  • Find any npm package for monorepo

    One of the speed building challenges - done in 8 hours. I was tired of typing out hundreds of commands to install packages I always know in a monorepo. This project uses Zustand as session storage to store the selected package manager, flag and labels for custom installation commands. It changes every npm packages' installation commands from npm install package to pnpm add package --filter web to help with monorepo's package based installation. Later on I also added a small shell script to accomplish the same functionality (I might to turn it into a CLI project as Starship plugin (maybe)).

    Depth based blur image
  • Depth based blur glass with scroll control video - zmzlois

    Frosting glass in the forest

    Make sure you scroll and hover mouse around! An experiment to create a frosted glass effect using CSS properties, backdrop-filter, mask and blur filter with video playback control on scroll. The glass would transform and rotate on X axis and Y axis based on mouse position. Same as the 8 layers of masks -- it changes the linear gradient transparency based on mouse position. Video is hosted on Object Storage via AWS S3 and served via AWS' global CDN Cloudfront. Built with Next.js, TailwindCSS, TypeScript, and deployed Vercel.

  • Dynamic Islands

    Inspired by Emil Kowalski. This project built with Framer Motion to create a dynamic island on the web simulating iOS notification. Noticed how Spring effect plays an interesting role when the component is smaller, but when it is bigger - spring animation will disturb user experience.

    Dynamic Island - zmzlois
  • Painting a ball with one div - zmzlois

    Painting a ball on the web

    Painting a ball on the web with only one div and css. An experiment playing with complex shadows.

  • Tap into the world of Emil -- Your toast component will never be the same again.