Matia

🌸 Joy of Code is a digital garden growing curious minds

🔥 The development setup I use

🔥 Svelte remote functions example

🧪 Interactive Svelte code sandbox

An npm component library for Svelte 5 that embeds live, editable code playgrounds in a web page, supporting HTML/CSS/JavaScript and full multi-file Svelte apps running inside a sandboxed iframe with automatic package resolution.

🍬 p5.js Svelte wrapper

💪 Full stack web development with SvelteKit

:seedling: Digital garden using Next.js and MDX

🪄 Create beautiful presentations using Markdown in Svelte

🔥 SvelteKit blog

🪄 Animated code blocks using Shiki

:test_tube: JavaScript code playground

🔥 Template for Svelte demos

🐞 Reproduction

🔥 Animotion SvelteKit template

🔥 Svelte Markdoc renderer

📷️ Social share images for Joy of Code

🔥 SvelteKit + Drizzle ORM

:fox_face: Generate a tiny Google font to self-host

Dark night blue theme for VS Code

🔥 API for retrieving your GitHub contributions data

✍️ GitHub as a CMS

🔥 Learn Svelte animations

:lotus_position: How to ask questions

🍪 Authentication for SvelteKit

GitHub profile

🧑‍🎨 Playground for learning the Canvas API

✍️ Joy of Code editor

🪄 Animated code blocks using Shiki

🔥 Svelte for React developers

🔥 Learn Svelte state management

🔥 Shared state problem

🔥 Svelte implementation of 7GUIs

:writing_hand: Markdown editor

:camera_flash: Social share image and front matter for posts

🔥 Signals exploration in JavaScript frameworks

The Modern GraphQL Bootcamp course

:test_tube: Testing JavaScript

Start using view transitions without any hassle!

🔥 Typing speed game made with Svelte

🍿 Track the watch progress of your favorite shows

Minimal CSS Framework for semantic HTML

🍎 Spotify inspired audio player

:camera_flash: Thumbnail creator for Joy of Code

Types for Dominos API

:electric_plug: Rehype plugin for image sizes and placeholders

:rocket: React Tutorial inspired by Svelte Tutorial

React, TypeScript and Tailwind starter

🎨 Poimandres Zed theme

web development, streamlined

🔥 Full-stack project example using SvelteKit and Prisma

🐞 Reproduction

:test_tube: SvelteKit example

:test_tube: Svelte example

Utility library for CSS

Sandbox for learning CSS

Animation using GSAP

Quick JavaScript demos that show a concept or theory

Gists but worse

Exploring ways to do layout animations

Higher-order functions materials/exercises

🔥 Svelte wrapper around Tweakpane

My personal portfolio

📝 Handling SvelteKit form errors

Bistro — Simple Meals in a Modest Setting

React app starter using webpack

Simple Gatsby blog for learning purposes

Sick Kicks is a fictional e-commerce shop for buying fresh kicks!

🐞 Bug reproduction

🍿 Svelte IMDb scraper

🔥 State machines

🔥 Intro video for Joy of Code made with Remotion

HeadlessUI components for Svelte

Build Better Websites. Create modern, resilient user experiences with web fundamentals.

Exercise in pixel perfect design, mobile first and accessibility

🔥 Breaking out of layouts in SvelteKit

An automatic Sveltekit form data parser middleware

Image feed that uses the undocumented Reddit API

🐞 Bug reproduction

Cybernetically enhanced web apps

listd is a Full Stack App that will allow users to create, share and watch lists of YouTube channels. This app is being built LIVE every Friday https://twitch.tv/codinggarden

🔥 Shiki code examples

🪄 Animotion presentation

Smoothly animated code blocks with Shiki

🧪 Experiment

This is my website

🎬️ Learn problem solving slides

✍️ Notes on using state machines

🥁 Playing around with state machines

🔥 Joy of Code redesign

🕵️ Study of HTTP caching in SvelteKit

:artist: Easily create social share images for your site

:heavy_check_mark: TodoMVC Svelte example

:cd: Remix blog example

:woman_scientist: Next.js and Prisma example

A site for discovering recipes

Books API

Example site powered by Sanity.io CMS, and Next.js

Lesson files for https://masteringnextjs.com/

Movie ranking app using D3.js

TypeScript drag and drop

Hacking away at Next.js!

Code solutions for https://www.codewars.com

Retro theme for VS Code

🗃️ Config files

Plan a surf trip for friends and family

Minimal starter for React using Parcel

A starter 💼 kit for any 🕸 web development project

Tasty aggregator made with React

Building the same landing page w/ Bootstrap and CSS comparing the two

Babel & Webpack boilerplate

The hottest blog on earth.

Landing page for Chatr

CRUD client and API server using React, PostSQL and Knex

Responsive illustration style website

Simple speed typing game

Using node and cheerio for web scraping

A simple chat app using Socket.IO

A React store that sells fish

Responsive portfolio website

es6.io reference materials

A simple React To-Do app