smrprprpCertified Developer

My skills

Skill list with every tool fully explained.

Every icon in the sidebar is clickable. Tap a skill to jump to it, open it, and automatically close the previous skill card.

JavaScript is my core language for turning static pages into real interactive products. I use it for UI state, menus, accordions, search, filters, local storage, animations, API requests, and full client-side app behavior.

  • Builds app-like interactions directly in the browser without heavy setup.
  • Used for dynamic project cards, skill accordions, splash screens, smooth menus, and dashboard logic.
  • Comfortable with DOM APIs, events, async functions, modules, JSON, localStorage, and reusable functions.
  • Strong focus on mobile-first behavior because most of my projects are created and tested on iPhone.

Projects using JavaScript

SMR Bio SiteTheme toggle, animated menu, skill search, one-open accordion system.
SMNewsArticle rendering, admin interactions, newsletter forms, and client-side UI logic.

Experience using JavaScript

Used across almost every web project I build, especially portfolio pages, tools, dashboards, and iPhone-friendly web apps.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

TypeScript helps me structure bigger projects with safer data models and fewer mistakes. I use it when a project needs cleaner architecture, typed API responses, reusable components, and predictable Firebase or Next.js data.

  • Uses interfaces, types, unions, arrays, objects, and typed function parameters.
  • Best for Next.js projects, Firebase schemas, app state, and API routes.
  • Makes large projects easier to debug and maintain.
  • Good for moving from quick prototypes to cleaner production-ready builds.

Projects using TypeScript

NEXUS ArenaTyped game rooms, matchmaking state, user profiles, and chat models.
SMSignerCertificate, app metadata, file upload, and signing workflow structures.

Experience using TypeScript

Useful when a project grows beyond a simple HTML file and needs safer structure.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

HTML is the structure layer of my websites. I use it to create clean pages, semantic sections, app-like layouts, cards, forms, navigation, splash screens, and content pages that are easy to style and improve.

  • Creates the structure for Home, About, Skills, Projects, Links, and Contact pages.
  • Uses semantic tags, accessible buttons, forms, headings, cards, and navigation landmarks.
  • Supports PWA metadata, icons, splash screens, SEO tags, and mobile viewport setup.
  • Keeps projects deployable on Vercel, Netlify, GitHub Pages, or simple static hosting.

Projects using HTML

Portfolio PagesFull multi-page layout with app-style cards and mobile-friendly structure.
Shortcut ToolsClean pages made to connect with iPhone Shortcuts and APIs.

Experience using HTML

One of my strongest skills because most of my projects start as full HTML pages before becoming larger apps.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

CSS is how I make my projects feel premium. I use it for responsive layouts, dark/light themes, neon glow, glass panels, animations, gradients, parallax-like cards, mobile spacing, and polished visual identity.

  • Builds the Swift-style glow, metallic highlights, dark panels, and clean app-like spacing.
  • Uses variables, media queries, grid, flexbox, backdrop blur, transitions, shadows, and keyframes.
  • Creates mobile-first screens that still look strong on desktop.
  • Controls the custom menu, skill cards, progress bars, theme switch, and splash screen.

Projects using CSS

SMR Bio ThemeNeon Swift-inspired visual system with clean panels and animated cards.
Game/Tool UIsDark gaming style interfaces, dashboards, and creator tools.

Experience using CSS

One of my main creative skills, especially for making simple projects look professional and unique.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

React is a component-based library I use for building bigger interactive apps where many UI parts need to share state, update live, or become reusable across pages.

  • Great for dashboards, chats, profiles, modals, game rooms, and reusable UI components.
  • Used with Next.js, Firebase, and real-time data flows.
  • Helps organize complex projects instead of putting every interaction in one long script.
  • Strong direction for future web apps, multiplayer projects, and creator platforms.

Projects using React

NEXUS ArenaReal-time multiplayer interface, chats, profile panels, rooms, and game UI.
SMSignerUpload flows, app metadata panels, certificate screens, and premium UI.

Experience using React

Used for more advanced apps where the interface needs to update often and stay organized.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Electron allows web technologies to become desktop applications. I use it as a direction for projects that need a PC app feeling while still using HTML, CSS, and JavaScript.

  • Useful for local tools, launchers, app managers, dashboards, and desktop utilities.
  • Combines web UI with desktop capabilities through Node.js.
  • Good option when a project outgrows the browser but should keep a web-style interface.
  • Works well with GitHub releases and cross-platform packaging.

Projects using Electron

Desktop Tool ConceptsApp-style utilities, project managers, and repo tools.
Creator DashboardsInterfaces that can later become desktop clients.

Experience using Electron

Best for future desktop builds based on the web apps I already create.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Java is useful for object-oriented programming, desktop software, Android concepts, and structured coding practice. It is not my main stack, but it helps with understanding typed programming and application logic.

  • Object-oriented programming with classes, methods, and reusable structures.
  • Useful for Android foundations and desktop app concepts.
  • Helps understand strict syntax and larger code organization.
  • Good for school, backend concepts, and classic programming practice.

Projects using Java

Learning ProjectsSmall utilities, logic exercises, and object-oriented practice.
Android FoundationUseful background for mobile development concepts.

Experience using Java

Useful as a structured language for learning stronger programming patterns.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

C# is useful for Windows apps, Unity game development, and typed application logic. I use it mainly as a game and desktop development direction.

  • Works well with Unity and game scripting.
  • Strong typed language for desktop and app logic.
  • Useful for understanding classes, objects, methods, and events.
  • Good for tools that need clean structured logic.

Projects using C#

Unity ConceptsGameplay logic, menu systems, and simple prototypes.
Tool ConceptsTyped logic for future Windows utilities.

Experience using C#

A useful language for game development and Windows-style app ideas.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Python is my flexible automation and backend helper language. I use it for scripts, file processing, small APIs, data cleanup, image tasks, project generation, and quick tooling.

  • Great for automation, file tools, generators, API helpers, and simple backend logic.
  • Useful for working with JSON, folders, images, text files, and generated project files.
  • Fast to write, test, and adjust when building creator tools.
  • Strong for scripts that support larger web projects.

Projects using Python

Project GeneratorsCreating files, folders, manifests, and ZIP packages automatically.
Automation ToolsScripts that clean data, generate assets, and prepare deployments.

Experience using Python

One of my strongest utility skills because it makes building and fixing projects faster.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Node.js lets me run JavaScript on the server. I use it for API routes, build tooling, server logic, package scripts, and projects that need a backend without switching languages.

  • Used for Next.js API routes, server actions, build scripts, and web tool backends.
  • Works with npm packages, file processing, authentication flows, and Firebase admin logic.
  • Good for connecting frontend pages to real APIs.
  • Keeps the full stack close to JavaScript and TypeScript.

Projects using Node.js

API ToolsServer endpoints for chats, posts, signing, and project actions.
Vercel AppsBackend logic running inside serverless functions.

Experience using Node.js

Important for building full-stack web apps beyond simple static pages.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

PostgreSQL is a strong relational database for projects that need structured data, users, posts, projects, logs, and reliable querying.

  • Stores structured data with tables, relations, and indexes.
  • Good for accounts, posts, comments, analytics, and project metadata.
  • Works well with Prisma and full-stack frameworks.
  • Useful when a project needs more control than a simple realtime JSON database.

Projects using PostgreSQL

Future DashboardsUser data, project libraries, and analytics storage.
Content PlatformsPosts, comments, authors, and status information.

Experience using PostgreSQL

Useful for larger apps that need real database structure and long-term scaling.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

SQL is the query language used to read, filter, join, and organize relational data. It helps me understand how real apps store and retrieve information.

  • Select, insert, update, delete, filter, sort, and join data.
  • Useful for dashboards, admin panels, analytics, and user systems.
  • Works with PostgreSQL, MySQL-style systems, and database tools.
  • Helps plan better schemas before building a backend.

Projects using SQL

Admin PanelsFiltering users, projects, posts, and events.
Analytics TablesReading clean stats from structured records.

Experience using SQL

Important foundation for database-backed apps and full-stack projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Prisma is an ORM that makes database access cleaner in TypeScript and JavaScript apps. It is useful for defining models and writing safer database queries.

  • Defines database models in a clean schema file.
  • Generates typed database clients for safer queries.
  • Works well with Next.js, PostgreSQL, and TypeScript.
  • Good for user profiles, projects, posts, and settings.

Projects using Prisma

Full-Stack ConceptsTyped database models for apps and dashboards.
Portfolio CMS IdeasStructured data for projects, posts, and contacts.

Experience using Prisma

Useful when a project needs a real database but still wants clean TypeScript code.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Bun is a fast JavaScript runtime and package manager. I use it as a modern tool option for faster installs, scripts, and experimental web workflows.

  • Runs JavaScript and TypeScript scripts quickly.
  • Can replace parts of npm/node workflows in some projects.
  • Useful for quick tools, experiments, and package management.
  • Fits modern JavaScript project setups.

Projects using Bun

Build ExperimentsFast installs and scripts for web app projects.
Tooling ConceptsTesting package workflows and project setup speed.

Experience using Bun

Useful for faster project experiments and modern JavaScript tooling.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Svelte is a UI framework that compiles components into efficient JavaScript. I like it for clean interfaces, fast pages, and less boilerplate.

  • Creates reactive components with a simple syntax.
  • Good for lightweight web apps and smooth UI.
  • Can produce fast static or app-like pages.
  • Useful alternative to React for smaller interactive projects.

Projects using Svelte

UI ExperimentsFast components, animated panels, and clean page structures.
Creator ToolsLightweight web tools with simple state.

Experience using Svelte

A clean option for building interactive pages with less setup.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Vue is a progressive UI framework that makes it easy to build reactive pages and reusable components.

  • Good for simple components, dashboards, forms, and stateful UI.
  • Uses templates, data, computed values, and events.
  • Can scale from a small widget to a full app.
  • Useful to understand different component frameworks.

Projects using Vue

Component ExperimentsReactive forms, menus, and dashboards.
Learning UI PatternsComparing state and components with React and Svelte.

Experience using Vue

Useful framework knowledge for understanding multiple frontend ecosystems.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

TanStack Start is a modern full-stack React framework direction connected to the TanStack ecosystem. I use it as a future option for app routing and data-first React projects.

  • Designed around modern React app architecture.
  • Pairs well with TanStack Router and Query.
  • Good for future projects that need routes, loaders, and server/client coordination.
  • Useful for learning modern React ecosystem structure.

Projects using TanStack Start

Future App ConceptsDashboard-style apps with modern routing and data loading.
React Architecture TestsExperiments with cleaner full-stack patterns.

Experience using TanStack Start

A future-facing skill for advanced React projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

TanStack Router is a routing library for React apps. It helps make multi-page app navigation typed, organized, and more scalable.

  • Manages routes, nested layouts, parameters, and navigation.
  • Works well with TypeScript and larger React apps.
  • Useful when an app needs real page structure instead of only sections.
  • Pairs strongly with TanStack Query for data-driven pages.

Projects using TanStack Router

Multi-Page React AppsTyped navigation, nested pages, and app dashboards.
Creator Platform ConceptsProfiles, projects, settings, and admin routes.

Experience using TanStack Router

Useful for bigger React apps that need cleaner navigation.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

TanStack Query helps React apps fetch, cache, refresh, and manage server data without messy manual state.

  • Handles API requests, loading states, errors, refetching, and caching.
  • Great for dashboards, chats, profiles, project lists, and admin panels.
  • Reduces repeated fetch logic across components.
  • Pairs well with Firebase alternatives and REST APIs.

Projects using TanStack Query

Dashboard ConceptsProject lists, statuses, and user data fetching.
API UI ConceptsCleaner loading and refresh behavior.

Experience using TanStack Query

Useful for projects where the UI depends on live or repeated server data.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

React Native uses React concepts to build mobile apps. It is useful for turning app ideas into iOS and Android interfaces with a shared codebase.

  • Uses components and state like React, but targets mobile UI.
  • Useful for app concepts, dashboards, chat screens, and tool interfaces.
  • Pairs well with Expo for easier testing and building.
  • Good direction for projects that start as websites and later become apps.

Projects using React Native

Mobile Tool ConceptsApp-style pages for creators, shortcuts, and project dashboards.
Chat/App IdeasScreens for profiles, private chats, and realtime rooms.

Experience using React Native

A good bridge between my web projects and real mobile app ideas.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Kotlin is a modern language for Android development. It is useful for native Android apps and understanding mobile architecture outside the web stack.

  • Used for native Android app development.
  • Supports concise typed code and modern app patterns.
  • Useful for learning mobile screens, activities, and app logic.
  • Good foundation for Android-specific features.

Projects using Kotlin

Android ConceptsNative mobile screens and app structure practice.
Mobile Feature IdeasTesting ideas that need native Android access.

Experience using Kotlin

Useful mobile language knowledge, especially for Android-focused apps.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Swift is the Apple ecosystem language used for iOS apps and native Apple features. It is important for my iPhone-first workflow, app ideas, and future iOS projects.

  • Strong direction for iOS apps, widgets, and Apple-style interfaces.
  • Useful for projects that need real native iPhone capabilities.
  • Connects well with my interest in iPhone Shortcuts and mobile-first tools.
  • Good for building polished apps that match the Apple ecosystem.

Projects using Swift

iOS App ConceptsNative screens, Apple-style UI, and mobile tool ideas.
Shortcut Companion IdeasApps that work alongside iPhone automation workflows.

Experience using Swift

A top skill direction because I build and think mobile-first on iPhone.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Android development knowledge helps me understand mobile platforms, app structure, permissions, screens, and native behaviors.

  • Useful for mobile UI patterns and app logic.
  • Connects with Kotlin, React Native, and app deployment ideas.
  • Helps understand device permissions, notifications, and native features.
  • Good for cross-platform project planning.

Projects using Android

Mobile App ConceptsPlanning apps that work on both iPhone and Android.
Tool InterfacesMobile dashboards and utility screens.

Experience using Android

Helpful for thinking beyond websites and into real mobile app behavior.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Expo makes React Native development easier by handling setup, testing, and mobile workflows. It is useful for quickly building mobile prototypes.

  • Speeds up React Native app testing and development.
  • Supports mobile previews and common device features.
  • Good for prototypes that later become full apps.
  • Works well for creator tools, dashboards, and chat interfaces.

Projects using Expo

Mobile PrototypesTesting app concepts without heavy native setup.
React Native WorkflowsQuick mobile UI experiments and demos.

Experience using Expo

Useful for turning web-style ideas into mobile app prototypes faster.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Express is a Node.js backend framework for creating APIs and server routes. It is useful for building simple custom backends fast.

  • Creates REST endpoints, middleware, and server logic.
  • Useful for APIs connected to web apps and shortcuts.
  • Good for prototypes before moving to larger platforms.
  • Works with JSON, auth flows, databases, and webhooks.

Projects using Express

API ConceptsEndpoints for messages, tools, and project data.
Shortcut APIsSimple routes that iPhone Shortcuts can call.

Experience using Express

Useful for quick backend APIs and custom server behavior.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Next.js is a React framework for full-stack websites and apps. I use it for bigger projects that need routing, API routes, deployment, auth, and server-side features.

  • Supports App Router, API routes, metadata, and optimized deployment.
  • Good for Vercel projects, dashboards, and full-stack apps.
  • Works well with Firebase, TypeScript, and serverless functions.
  • Useful when a static HTML site becomes too limited.

Projects using Next.js

NEXUS ArenaFull multiplayer platform structure with auth and realtime features.
SMSignerUpload flows, server routes, and app signing dashboard structure.

Experience using Next.js

Important for bigger production-style apps hosted on Vercel.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

SvelteKit is the app framework for Svelte. It is useful for fast sites, routing, server endpoints, and polished app-like pages.

  • Provides routing and server features for Svelte projects.
  • Good for static sites or dynamic apps.
  • Uses clean component structure and fast output.
  • Useful alternative to React and Next.js for certain projects.

Projects using SvelteKit

Svelte App ConceptsFast UI tools with routes and endpoints.
Portfolio ExperimentsClean component-based pages.

Experience using SvelteKit

Useful framework knowledge for understanding other modern web stacks.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Unreal Engine is a high-end game engine used for realistic games and interactive 3D experiences. It is useful for learning game logic, environments, and cinematic visuals.

  • Supports Blueprints, levels, materials, lighting, and gameplay systems.
  • Good for realistic game ideas and 3D experiments.
  • Useful for understanding game loops and interactive worlds.
  • Pairs with C++ for advanced systems.

Projects using Unreal Engine

Game ConceptsPrototype levels, menus, and gameplay ideas.
Visual ExperimentsCinematic scenes and interactive environments.

Experience using Unreal Engine

Good direction for advanced game development and 3D projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Unreal C++ is used to build deeper systems inside Unreal Engine. It gives more control than visual scripting for gameplay and engine logic.

  • Creates gameplay classes, components, and systems.
  • Useful for performance and deeper control.
  • Works with Unreal Blueprints for mixed workflows.
  • Good for learning real game architecture.

Projects using Unreal C++

Gameplay SystemsCore logic concepts for game mechanics.
Engine LearningUnderstanding how advanced Unreal projects are structured.

Experience using Unreal C++

A learning direction for more serious game development.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Unity is a game engine used for 2D, 3D, mobile, and indie game projects. It connects strongly with C# scripting.

  • Builds scenes, objects, scripts, UI, physics, and game loops.
  • Good for mobile games, prototypes, and small projects.
  • Uses C# for gameplay programming.
  • Useful for understanding game structure and interactive design.

Projects using Unity

Game PrototypesMenus, player logic, and small gameplay systems.
Mobile Game ConceptsSimple mobile-friendly game ideas.

Experience using Unity

Useful for building games faster and learning real game logic.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Godot is an open-source game engine with a clean workflow for 2D and 3D games. It is useful for lighter game projects and fast experiments.

  • Uses scenes, nodes, scripts, and signals.
  • Good for 2D games and lightweight prototypes.
  • Open-source and beginner-friendly while still powerful.
  • Useful for learning game architecture in a clean way.

Projects using Godot

2D Game IdeasPlatformer, menus, and simple mechanics.
Game UI TestsScreens, buttons, states, and interactions.

Experience using Godot

Good engine for quick game experiments and learning.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Git is the version control system I use to track code changes, manage repositories, and push projects to GitHub.

  • Commits, branches, pushes, pulls, and repository history.
  • Important for deploying projects through GitHub, Vercel, and Netlify.
  • Helps recover changes and organize updates.
  • Useful for collaboration and project backups.

Projects using Git

All GitHub ProjectsVersion control and deployment history.
Repo Manager IdeasTools for creating, editing, and managing repositories.

Experience using Git

Core tool for real project management and deployment.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

npm is used to install packages, manage scripts, and run JavaScript project workflows.

  • Handles package.json, dependencies, scripts, and build commands.
  • Used in Next.js, React, Vite, and other JavaScript projects.
  • Important for Vercel and Netlify builds.
  • Helps add libraries without manually copying code.

Projects using npm

Next.js AppsInstall dependencies and run build scripts.
Web ToolsUse packages for UI, APIs, and utilities.

Experience using npm

Important for any serious JavaScript project.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Windows is useful for testing desktop projects, browser behavior, app workflows, and development tools that are easier on PC.

  • Useful for desktop app testing and web compatibility.
  • Supports many developer tools, editors, and terminal workflows.
  • Good for checking how mobile-first projects scale to PC.
  • Helpful for GitHub, Vercel, and local testing when available.

Projects using Windows

PC TestingChecking responsive websites and desktop layouts.
Desktop ConceptsTesting app-style interfaces beyond mobile.

Experience using Windows

Useful as a testing and development platform.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Cloudflare is useful for DNS, performance, security, Workers, and routing traffic for web projects.

  • Manages DNS, domains, SSL, caching, and protection.
  • Workers can run lightweight serverless code at the edge.
  • Useful for APIs, redirects, and performance improvements.
  • Good for professional deployment setups.

Projects using Cloudflare

Custom DomainsDNS and security setup for websites.
Edge API ConceptsSmall serverless functions and routing logic.

Experience using Cloudflare

Useful for making web projects feel more professional and stable.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Vercel is one of my main deployment platforms for static sites, Next.js apps, previews, and serverless routes.

  • Deploys GitHub repos quickly with automatic builds.
  • Great for Next.js, React, and static HTML projects.
  • Supports environment variables, serverless functions, and preview deployments.
  • Good for sharing projects fast from mobile or GitHub workflows.

Projects using Vercel

SMNewsHosted website and deployment testing.
NEXUS/SMSigner ConceptsNext.js app deployments and serverless routes.

Experience using Vercel

One of my main hosting tools for real web projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Supabase is an open-source backend platform with database, auth, storage, and realtime features. It is useful when I want a SQL backend with app features.

  • Uses PostgreSQL as the main database.
  • Includes auth, storage, realtime, and API features.
  • Good alternative to Firebase for structured projects.
  • Useful for dashboards, user systems, and app backends.

Projects using Supabase

Backend ConceptsAuth, storage, and project data ideas.
Creator PlatformsUser profiles, content, and uploads.

Experience using Supabase

Useful for future projects that need relational data and backend services.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Firebase is a major part of my realtime app ideas. I use it for authentication, realtime database, storage concepts, and live multiplayer or chat features.

  • Useful for realtime chats, rooms, user profiles, status updates, and live dashboards.
  • Pairs well with React and Next.js for multiplayer and social features.
  • Supports Firebase Auth, Realtime Database, Firestore concepts, and hosting-related workflows.
  • Strong for fast prototypes that need live data without managing a custom server.

Projects using Firebase

NEXUS ArenaRealtime rooms, public/private chat, users, matchmaking, and profiles.
Realtime Project ManagerLive cursors, whiteboard, chat, and collaborative editing concepts.

Experience using Firebase

One of my strongest backend/cloud directions because many of my projects need realtime features.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Azure is Microsoft’s cloud platform. It is useful for understanding cloud hosting, app services, storage, databases, and enterprise-style deployments.

  • Covers hosting, serverless functions, databases, and cloud tools.
  • Useful for learning professional cloud infrastructure concepts.
  • Can support web apps, APIs, and storage workflows.
  • Good to know for wider cloud platform understanding.

Projects using Azure

Cloud LearningUnderstanding how larger deployment systems work.
Future API HostingExploring scalable backend options.

Experience using Azure

A broader cloud skill for understanding more than one hosting ecosystem.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Web Components allow reusable custom HTML elements without relying on a full framework.

  • Creates custom elements with encapsulated behavior.
  • Useful for reusable widgets and design system pieces.
  • Can work across plain HTML projects and frameworks.
  • Good for long-term reusable UI components.

Projects using Web Components

Widget ConceptsReusable buttons, cards, modals, and shortcut panels.
Design System IdeasCustom elements for repeated interface parts.

Experience using Web Components

Useful for making plain web projects more modular.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Accessibility makes websites easier to use with keyboards, screen readers, clear labels, good contrast, and proper HTML structure.

  • Uses semantic tags, labels, alt text, and focusable controls.
  • Important for real buttons, navigation, forms, and accordions.
  • Improves quality for every user, not only assistive tech users.
  • Pairs with responsive design and readable spacing.

Projects using Accessibility

Bio SiteReal buttons, labels, keyboard escape menu close, and semantic pages.
Form PagesBetter labels, inputs, and contact actions.

Experience using Accessibility

Important for making projects feel finished instead of just visually cool.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Markdown is a lightweight writing format I use for posts, documentation, README files, project notes, and content systems.

  • Good for GitHub README files, blog posts, and changelogs.
  • Easy to write from mobile and convert into HTML content.
  • Useful for project documentation and tutorials.
  • Pairs well with static sites and content platforms.

Projects using Markdown

SMNewsMarkdown-style posts and welcome articles.
GitHub ProjectsREADME files, setup guides, and documentation.

Experience using Markdown

A strong writing and project-documentation skill.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Automation is a key part of how I build tools. I use it for iPhone Shortcuts, GitHub Actions, API flows, generators, and systems that reduce manual work.

  • Creates flows that connect apps, APIs, files, and actions.
  • Useful for iPhone Shortcuts, RoutineHub-style tools, and web APIs.
  • Can trigger builds, generate files, and process data automatically.
  • Makes projects faster and more useful for real users.

Projects using Automation

iPhone ShortcutsAutomation workflows published or prepared for RoutineHub.
GitHub Actions ToolsBuild scripts, IPA workflows, and project generation.

Experience using Automation

One of my strongest creator skills because it connects coding with useful real-world workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Yarn is a package manager alternative for JavaScript projects. It is useful for installing dependencies and running project scripts.

  • Manages dependencies and scripts like npm.
  • Useful to understand different JavaScript workflows.
  • Can be used in React, Next.js, and other project setups.
  • Helpful when a project already uses yarn.lock.

Projects using Yarn

JS ToolingInstalling and running project dependencies.
Build WorkflowsTesting package manager compatibility.

Experience using Yarn

Useful secondary package manager knowledge.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Cursor is an AI-assisted code editor. It is useful for reviewing, editing, and improving project files faster.

  • Helps navigate and edit larger codebases.
  • Useful for refactors, debugging, and feature implementation.
  • Pairs well with GitHub projects and web app development.
  • Good for speeding up complex coding workflows.

Projects using Cursor

Code Review WorkflowsFixing bugs and improving structure.
Large Project EditingWorking across multiple files more quickly.

Experience using Cursor

Useful editor for bigger projects and faster iteration.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

VS Code is a flexible code editor for web, JavaScript, TypeScript, Python, and general project work.

  • Supports extensions, Git, terminals, formatting, and debugging.
  • Great for HTML, CSS, JS, TS, Python, and markdown.
  • Works well with GitHub and deployment workflows.
  • Useful when editing larger multi-file projects.

Projects using VS Code

Web ProjectsEditing full websites and app codebases.
Docs and ScriptsMarkdown, Python, and project configs.

Experience using VS Code

A main editor skill for standard development workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Visual Studio is a full IDE useful for C#, desktop development, game projects, and larger Windows workflows.

  • Useful for C#, .NET, and Unity-related workflows.
  • Supports debugging, project templates, and structured solutions.
  • Good for desktop app ideas and Windows development.
  • Complements VS Code for heavier projects.

Projects using Visual Studio

C# ConceptsTyped desktop and game scripting practice.
Windows App IdeasTesting IDE-based project structures.

Experience using Visual Studio

Useful for heavier desktop or C# workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

IntelliJ IDEA is a powerful IDE for Java and JVM development. It helps with structured projects, refactoring, and typed code navigation.

  • Strong for Java, Kotlin, and JVM ecosystems.
  • Provides smart autocomplete, project tools, and refactoring.
  • Useful for Android/Kotlin learning directions.
  • Good for more complex typed language projects.

Projects using IntelliJ IDEA

Java PracticeObject-oriented coding and structured applications.
Kotlin ConceptsMobile-focused typed language learning.

Experience using IntelliJ IDEA

Useful IDE knowledge for Java and Kotlin workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Xcode is Apple’s IDE for iOS, Swift, SwiftUI, and Apple platform apps.

  • Used for Swift and Apple ecosystem projects.
  • Supports iOS app screens, assets, signing, simulators, and build settings.
  • Important for native iPhone apps and Apple-style tools.
  • Good future direction for iPhone-first projects.

Projects using Xcode

iOS ConceptsSwift screens, app structure, and Apple platform ideas.
Shortcut Companion AppsNative iPhone utilities connected to automation.

Experience using Xcode

Important for turning iPhone-first ideas into real native apps.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

GCC is a compiler collection used for C and C++ projects. It is useful for understanding compiled languages and low-level build workflows.

  • Compiles C and C++ programs.
  • Useful for learning how source code becomes executables.
  • Important for understanding toolchains and compiler errors.
  • Connects to C++ and some game development concepts.

Projects using GCC

C/C++ PracticeSmall compiled programs and learning exercises.
Toolchain LearningUnderstanding compiler-based workflows.

Experience using GCC

A foundational compiler skill for lower-level programming knowledge.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Vite is a fast frontend build tool for modern web apps. It is great for React, Vue, Svelte, and quick project setups.

  • Fast development server and optimized production builds.
  • Useful for component-based web apps and static deployments.
  • Pairs with React, TypeScript, and modern tooling.
  • Good for projects that need more structure than a single HTML file.

Projects using Vite

Frontend AppsFast setup for modern UI projects.
Portfolio ExperimentsComponent-based interfaces and builds.

Experience using Vite

Useful for fast web app development and cleaner build workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Webpack is a classic JavaScript bundler used to package assets and code for the browser.

  • Bundles JavaScript, CSS, and assets.
  • Useful to understand older or larger project setups.
  • Supports loaders, plugins, and optimized builds.
  • Good background knowledge for many existing codebases.

Projects using Webpack

Legacy Build ConceptsUnderstanding how older frontend projects are assembled.
Tooling KnowledgeComparing bundlers and build systems.

Experience using Webpack

Useful for reading and maintaining older frontend setups.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Rollup is a bundler often used for libraries and optimized JavaScript packages.

  • Creates clean bundles for libraries and reusable packages.
  • Good for understanding tree-shaking and module output.
  • Useful for package authoring concepts.
  • Alternative to Vite and Webpack depending on the project.

Projects using Rollup

Library ConceptsBundling reusable UI or utility code.
Build ExperimentsTesting optimized JavaScript outputs.

Experience using Rollup

Useful for understanding how reusable JavaScript packages are built.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

ESLint catches JavaScript and TypeScript mistakes before they become bugs.

  • Finds code quality issues and common mistakes.
  • Useful in React, Next.js, and TypeScript projects.
  • Helps keep code consistent across files.
  • Can be combined with Prettier for a cleaner workflow.

Projects using ESLint

Next.js AppsPreventing common JS/TS mistakes.
Team-Style CodeMaking projects cleaner and easier to maintain.

Experience using ESLint

Useful for cleaner and safer code in bigger projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Prettier formats code automatically so files stay clean and readable.

  • Formats HTML, CSS, JavaScript, TypeScript, JSON, and more.
  • Useful for consistent code style across projects.
  • Saves time when working with large files.
  • Works well with VS Code and build workflows.

Projects using Prettier

All CodebasesCleaner formatting and readable files.
DocumentationConsistent markdown and config formatting.

Experience using Prettier

Useful for keeping projects clean without manual formatting.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Biome is a fast formatter and linter for modern web projects.

  • Can format and lint JavaScript and TypeScript projects.
  • Fast alternative to separate formatting/linting tools.
  • Useful for experimenting with modern tooling.
  • Good for clean project workflows.

Projects using Biome

Tooling ExperimentsTesting faster format and lint setups.
Modern JS ProjectsCleaner development workflow options.

Experience using Biome

Useful modern tooling knowledge for web projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Stylelint helps catch CSS problems and enforce consistent styling rules.

  • Checks CSS for errors and style consistency.
  • Useful for bigger design systems and complex themes.
  • Helps keep animations, variables, and selectors cleaner.
  • Good option when CSS grows across many files.

Projects using Stylelint

Theme SystemsKeeping large CSS files cleaner.
Portfolio UIMaintaining consistent visual rules.

Experience using Stylelint

Useful for larger CSS-heavy projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

JSON is a core data format I use for APIs, configs, shortcut dictionaries, project lists, and saved app data.

  • Used in web APIs, localStorage, Firebase, and iPhone Shortcuts.
  • Stores objects, arrays, settings, messages, and project data.
  • Easy to read, generate, and send between apps.
  • Important for automation and web app communication.

Projects using JSON

Shortcut APIsSending and receiving dictionaries and arrays.
Project DataSkills, cards, settings, and content structures.

Experience using JSON

One of the most important data formats for my projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

YAML is a readable config format often used in GitHub Actions, deployment settings, and project configuration.

  • Used for GitHub Actions workflow files.
  • Good for build pipelines and automation settings.
  • More readable for nested config than JSON in some cases.
  • Important for CI/CD and repo automation.

Projects using YAML

GitHub ActionsBuild workflows, automation, and deployment steps.
Project ConfigsReadable settings for tooling and pipelines.

Experience using YAML

Important because many automated build systems use it.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

TOML is a configuration format used by some tools because it is readable and strict.

  • Used in some package and tool config files.
  • Readable structure with sections and values.
  • Useful to recognize when working with different ecosystems.
  • Good for app settings and build configs.

Projects using TOML

Config ReadingUnderstanding tool configuration files.
Build WorkflowsWorking with different project ecosystems.

Experience using TOML

Useful secondary config format knowledge.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

XML is a markup/data format used in many app configs, old APIs, Android files, and structured documents.

  • Uses nested tags and attributes to represent data.
  • Important for Android-related files and some legacy systems.
  • Useful for parsing structured content.
  • Good to understand when working with app packages or config files.

Projects using XML

App Config ConceptsReading structured mobile and platform files.
Legacy API ConceptsUnderstanding older data formats.

Experience using XML

Useful for app and platform configuration knowledge.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

PLIST files are Apple property lists used in iOS and macOS apps for settings, metadata, and app configuration.

  • Important for iOS app metadata and bundle settings.
  • Useful when working with IPA-related workflows.
  • Can represent dictionaries, arrays, strings, booleans, and numbers.
  • Connects strongly with Apple app tooling.

Projects using PLIST

IPA ToolingReading and understanding iOS app metadata.
Apple ConfigsWorking with app settings and bundle information.

Experience using PLIST

Useful for Apple-focused tools and iOS project workflows.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Blender is 3D creation software useful for logos, renders, models, and visual assets.

  • Creates 3D objects, lighting, materials, and renders.
  • Useful for logos, posters, thumbnails, and app visuals.
  • Good for custom branding and product-style images.
  • Can support game assets and visual experiments.

Projects using Blender

3D Logo ConceptsMetallic and glowing logo-style visuals.
Poster/Thumbnail IdeasCustom visuals for projects and content.

Experience using Blender

Useful for improving the visual identity of projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Figma is a design tool for planning interfaces, layouts, components, and visual systems before coding.

  • Useful for UI mockups, spacing, colors, cards, and components.
  • Helps plan mobile and desktop layouts before coding.
  • Good for design systems and app screens.
  • Makes projects look more professional and consistent.

Projects using Figma

Portfolio PlanningLayout ideas, colors, sections, and component systems.
App ConceptsMobile screens, dashboards, and flow planning.

Experience using Figma

Strong design planning tool for cleaner web and app projects.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Android Studio is the official IDE for Android apps. It is useful for Kotlin, Android project files, emulators, and native mobile workflows.

  • Builds and tests Android apps.
  • Works with Kotlin, Gradle, manifests, and emulators.
  • Useful for native mobile app concepts.
  • Helps understand Android-specific app structure.

Projects using Android Studio

Android ConceptsNative mobile screens and app setups.
Mobile TestingUnderstanding Android project files and builds.

Experience using Android Studio

Useful for native Android development knowledge.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Audacity is audio editing software useful for basic sound cleanup, effects, and project media.

  • Edits, trims, and exports audio files.
  • Useful for video projects, game sounds, and presentation audio.
  • Can clean up recordings and prepare simple effects.
  • Good support tool for creator projects.

Projects using Audacity

Video/Content ConceptsAudio cleanup and simple sound edits.
Game Media IdeasSmall audio assets and effects.

Experience using Audacity

Useful as a creative support tool.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.

Photoshop is useful for image editing, thumbnails, logos, mockups, and visual polish.

  • Edits images, creates compositions, and adjusts colors.
  • Useful for logos, banners, icons, and website assets.
  • Helps create polished visuals for projects.
  • Good for combining design with coding projects.

Projects using Photoshop

Brand AssetsLogo cleanup, icons, and visual mockups.
Website MediaBanners, thumbnails, and image edits.

Experience using Photoshop

Useful for making project visuals look more polished.

Current focus

Keep improving this skill by connecting it to real projects, cleaner UI, better mobile behavior, and deployable production-style workflows.