mayari 🌙✨ | projects

2024

radical 📅

a visual calendar app where you can see your time differently. making calendars more fun, less overwhelming + escaping the traditional calendar grid interfaces.
Svelte | Tailwind | TypeScript

adhd.directory 💊

a tool to help ADHD folks find medication + independent pharmacies amongst the medication shortage (100-200 users p/day)
Svelte | Tailwind | TypeScript | Supabase

alphabet superset - A to Z of coding curiosities

the Alphabet Superset challenge: for each letter of the alphabet, creating a small project in svelte. it’s a way for me to get used to building quickly, getting creative and just getting something out in the world!

A is for ADHD: Svelte Fidget
a variety of virtual fidget toys
Svelte | Tailwind

B is for Bebo: BeHere Social App
a revival of the Y2K social media site Bebo
Svelte | Tailwind | Firebase

C is for Cats: Slack Cats
a collection of the best cat emojis to spice up your Slack emoji directory
Svelte | Tailwind

D is for Dimension: 3D CozyTimer
a pomodoro timer app with cozy 3D scenes
Svelte | Tailwind | Threlte

E is for Escape: Aurasphere 3D Space with Threlte
a calming 3D environment to help you ground yourself. entry for the first Threlte hackathon, winning 3rd place
Svelte | Tailwind | Threlte

F is for Finder: ADHD Directory - Medication Stock Checker and Pharmacy Finder
a tool to help ADHD folks find medication + independent pharmacies amongst the medication shortage (100-200 users p/day)
Svelte | Tailwind | TypeScript | Supabase

G is for Gym: WhatWeights Barbell Calculator
a barbell weight calculator to help you easily figure out what plates you need on the bar. it accompanies me every gym session!
Svelte | Tailwind

2023

mayari.io 🌱

this website! built with Svelte & SvelteKit ❤️
Svelte | Tailwind | Markdown

outverse 🪐

working full-time frontend with the team at Outverse 💫
Svelte | TypeScript | Tailwind | Storybook

2022

the win jar 🏆

nicoleisxyz v1 🌱

my old portfolio site, originally build with Gatsby (and featured in the Gatsby newsletter!), then migrated to Astro ~ live
Gatsby > Astro | Tailwind | Ghost CMS > Markdown

2021

hipeople 👋

my first role in web development; worked full-time frontend with the team at HiPeople - building a product in the HRTech sphere 💫
React | TypeScript | Storybook

iMage the Photo Wizard 🪄

my first technical challenge for a job - a single-page React app where you can search Unsplash API for images ~ github | live
React | API

2020

the year I started learning web development

gradient generator

a customisable linear gradient generator built with HTML, CSS & JS - pick your own colour, linear direction and copy the CSS straight to your clipboard ooo ~ github | live
HTML | CSS | JavaScript

huddle landing page

a responsive landing page to flex my styling muscles, no pun intended 🤪 ~ github | live
HTML | CSS | Sass

price grid component

a frontend mentor challenge with a slightly more complex layout ~ github | live
HTML | CSS (using flex/grid)

profile card component

my very first frontend mentor challenge! a small, static card component ~ github | live
HTML | CSS

assembler

a Nand to Tetris course assignment - translates programs written in the N2T Hack assembly language into machine code ~ github
C#

projects 🫧