🕊️ Flycran (Flying Crane / 飞鹤) — Derived from "Flying Crane", embodying freedom and high-flying engineering.

🌐 Wings — my personal homepage: flycran.xyz

Hello! I am Flycran, a Frontend Architect Engineer passionate about building modern web applications and developer tooling ecosystems. Beyond product delivery, I focus deeply on Frontend Infrastructure & DX (Developer Experience).

• 🏗️ Core Stack: Modern Web Engineering with React, Next.js, TypeScript, and Tailwind CSS.
• ⚙️ Tooling & Infrastructure: Hands-on experience architecting high-performance toolchains with Vite, Biome, and Bun.
• 🛠️ Developer Experience & Automation:
  • Built custom CLI Generators for interactive scaffolding (similar to create-vite).
  • Authored custom Vite Plugins, TS Server Plugins, and VS Code Extensions.
  • Advanced AST & Type-System driven Codemods for automated refactoring and migrations.

• 🪐 github-gravity — Gravity-Driven Animated SVG for the GitHub Contribution Graph

  • 💡 Core Value: Turns a GitHub contribution graph into a physics animation — every contribution block falls under gravity and collides with custom text, exporting a self-contained animated SVG ready for a profile README.
  • 🛠️ Key Features: Rapier2D rigid-body simulation | Any .ttf/.otf triangulated into a collision mesh | Trajectory compression (DP / RDP / Greedy, ~30x smaller with timing preserved) | Browser playground with live playback & font upload.
  • 📖 Docs & Demo: https://flycran.github.io/github-gravity/

• ⚡ rtk-to-endpoints & VS Code Extension — IDE Navigation & DX Enhancer for RTK Query

  • 💡 Core Value: Solves the seamless navigation pain point in RTK Query by allowing developers to direct Go to Definition from RTK Hooks straight to their Endpoint definitions.
  • 🛠️ Developer Experience (DX): Enriches inline code perception by displaying API JSDoc, URL endpoints, and HTTP Methods directly inside the RTK Hook's JSDoc hover tooltips.
  • 🛠️ Tech: TypeScript | RTK Query | VS Code Extension