The way I build things is pretty consistent: start from one concrete annoyance — mine or someone around me — and carry it alone from requirements and architecture through implementation and deployment until it is actually usable.
So far I have independently built 9 projects spanning full-stack web, desktop, mobile and LLM applications. I care less about chasing new frameworks than about two things: whether anyone really uses what I ship, and where their data lives.
What I’m good at
Making LLMs work in production
Most of the work is outside the model. MangaTL keeps names stable by feeding a per-series glossary and whole-chapter context; AI_Resume screens out irrelevant mail with three rule layers before any LLM call, and a LangGraph ReAct agent queries the database on its own.
Turning messy material into data
JLPTsimu's question bank comes from PDF past papers and textbooks: split into 217 atomic tasks worked in parallel with an auto-aggregated dashboard, falling back to 300 DPI OCR when CIDFontType0 text extraction turns into mojibake.
Privacy-first design
PeriodLog keeps data on the device by default; cloud sync is opt-in and pairs with a 6-character code, no account. The rule: run locally when you can, and don't collect what you don't need.
Shipping to non-technical users
MangaTL ships as a double-click installer (Electron + PyInstaller), SkillsPaste as an offline Tauri exe, and this site moved from a Django server to a zero-maintenance static site on Cloudflare Pages.
Frontend
React (Next.js 16 / App Router)
JavaScript / TypeScript
Tailwind CSS / shadcn/ui
React Native (Expo)
Browser extensions (WXT)
Backend
Python (FastAPI / Django)
Node.js / Bun (Elysia)
REST / WebSocket
Mail ingestion (IMAP)
AI / LLM
LLM API integration (GLM / MiniMax / Claude / DeepL)
Manga translation & typesetting: OCR + LLM + adaptive layout
A semi-automatic translation and typesetting tool for Japanese manga: feed it a full chapter, get back Chinese / English pages with the translation typeset back into the original speech bubbles, plus an EPUB.
The pipeline detects bubbles for coordinates, reads the Japanese with manga-ocr, translates via an LLM carrying a per-series glossary and whole-chapter context, then re-renders text fitted to each bubble.
Output is not fire-and-forget: a review UI sits in the middle, where the AI pre-fills and a human edits line by line before rendering.
Main Features & Content
Bubble detection (YOLO, auto-fallback to OpenCV contours on failure)
manga-ocr Japanese recognition, for text both inside and outside bubbles
Per-series glossary keeping names and proper nouns consistent across chapters
Already-translated chapter text fed back as context, so forms of address and running gags stay consistent
Review UI: line-by-line edits, plus drag-a-box to recover missed bubbles
Adaptive font sizing — text never gets truncated to an ellipsis to make it fit
Exports typeset images, RTL-paging EPUB, and LabelPlus scripts
Design Notes
The quality bottleneck is context, not the model: requests carry the series glossary and already-translated chapter text instead of translating lines in isolation
Human in the loop: the AI pre-fills, a person reviews line by line, and only then is anything rendered
Detection has a fallback chain: if YOLO fails, OpenCV contours take over, so one bad page never blocks a chapter
Swappable translation engines (GLM / Claude / DeepL) — no lock-in to a single vendor
Tech Stack
Frontend: React + TypeScript
Backend: Python (FastAPI)
Models: comic-text-detector + manga-ocr
Desktop: Electron + PyInstaller
Deployment: Docker Compose / Windows installer
Recent Updates
[v3] Review UI + glossary + whole-chapter context
v3 replaced one-shot machine translation with an "AI pre-fill + human line-by-line review" flow.
Added a per-series glossary and a context mechanism that feeds already-translated chapter text back into the prompt — cross-chapter names and forms of address finally stay stable.
[v5] Desktop build: double-click to run, no setup
v3 required Docker, a terminal, and a Python environment — collaborators simply could not get it running.
v5 wraps it in Electron, with the FastAPI backend frozen by PyInstaller and spawned as a child process; models, database and fonts all live in the user data directory.
Ships as a Windows NSIS installer — install, double-click the icon, done.
[Workflow] Turning translation experience into a reusable process
After enough chapters it became clear that quality is decided less by the model than by how context is fed to it.
So the series glossary, the character-voice document, and switching fonts by emotion were all frozen into a standard procedure that a new series can just follow.
JLPTsimu
Web
JLPT mock exams with learning analytics
An online JLPT mock-exam system with answer-data analysis and personalised study advice.
Built for Chinese colleagues working at Japanese IT companies — both long-time employees and new hires. A finished exam does not just produce a score: every attempt is retained for time-series analysis that surfaces weak areas and recommends matching study material.
The bulk of the work is not the site itself but the question bank: structuring years of past papers and vocabulary / grammar books into data.
Main Features & Content
Full mock exams by level (N1 / N2 / N3), listening included
Rich per-question explanations: how to solve it, why each choice is right or wrong, and the knowledge points involved
Answer data retained across sessions for time-series trend analysis
Weak-area visualisation and study recommendations
Vocabulary / grammar knowledge base cross-linked with questions
Invite-only accounts plus an admin console
Design Notes
Data ownership first: building instead of using a closed mock-exam site is what makes cross-session time-series analysis possible
Access control lives in the database layer: Supabase RLS plus invite-only accounts
The heaviest lift is the question bank: atomic tasks entered in parallel, with an OCR fallback when text extraction fails
Tech Stack
Frontend: Next.js 16 (App Router) + React 19
Backend: Next.js Route Handlers (Node runtime)
Database: Supabase (PostgreSQL + Auth + RLS)
Explanations: batch-generated offline with an LLM, then imported
Deployment: Vercel
Recent Updates
[Kickoff] From "find an existing one" to "build our own"
The plan was to just use an existing mock-exam site, but the data was unreachable — no API, closed source, and no way to keep learners' answer history.
Since the whole point was following each learner's progress over time, the data had to stay under our own control. So: build it.
Data entry is grunt work that a single thread cannot finish, so I built a dispatch board: split it into 217 atomic tasks that multiple sessions claim, work independently, and roll up into an auto-generated progress dashboard.
N2 / N3 past papers, the vocabulary and grammar books, and the business-Japanese-for-IT material are all in — 211 tasks complete.
The traps got written down too — e.g. some PDFs use CIDFontType0, where extracting text directly returns mojibake and you have to fall back to 300 DPI OCR.
MangaNotifier
Bot
Daily anime / TV / manga update push
A bot that pushes update news to a QQ group every morning at 7:00: which anime updated today, which TV series dropped a new episode, which manga has a new chapter.
The reason it exists is mundane — I follow too many things to keep track of, so the bot keeps track instead.
Main Features & Content
Scheduled daily push covering three categories (anime / TV series / manga)
Anime data from Bangumi, series from TVMaze + TMDb, manga from MangaDex
Talks to QQ over WebSocket via NapCat
Plugin-style fetchers — adding a source means writing one file
Tech Stack
Backend: Python
Sources: Bangumi / TVMaze / TMDb / MangaDex
Bridge: NapCat (WebSocket)
Deployment: long-running process + scheduler
Recent Updates
[Live] The 7:00 daily push is running
Three fetchers (anime / series / manga) plus QQ delivery wired up, running as a resident scheduled job.
Only after finishing did it click that the value of a small tool like this is not technical depth — it is that it genuinely saves you that one moment, every day.
PeriodLog
Mobile
Local-first period tracking and prediction
A lightweight period tracking and prediction app.
Log start dates, pain level and notes for the day; predict the next window from history using mean ± standard deviation; get a local reminder if it runs late.
One design principle runs through all of it: data stays on the phone by default. Cloud sync is opt-in, and even then it pairs with a single 6-character code — no account, no identity collected.
Main Features & Content
Quick logging: date, time of day, pain level, notes
Predicts the next window (mean ± standard deviation)
Late reminder via local notification — never round-trips a server
Mood-phase reference, collapsed by default and shown only on tap
Optional cloud sync: pair with a 6-character code, no sign-up
Trilingual UI (zh / ja / en) plus dark mode
Design Notes
Sensitive data stays on the device by default; sync is opt-in, paired with a 6-character code, no account
Predictions use explainable statistics (mean ± standard deviation) rather than a black box
Reminders are local notifications that never touch a server
Tech Stack
Frontend: React Native + Expo
Language: TypeScript
Local storage: expo-sqlite
Cloud sync: Cloudflare Workers KV (optional)
Deployment: Android APK / Web
Recent Updates
[Cloud sync] Pair with a 6-character code, no account
Losing everything when you change phones is the unavoidable price of purely local storage.
So: optional sync on Cloudflare Workers KV — push on write, pull on app open, paired by a single 6-character code.
It is designed that way because this kind of data is simply too sensitive; better a weaker feature than asking users to hand over an identity.
[i18n] Trilingual + dark mode + settings panel
Filled in the Chinese / Japanese / English UI, dark mode, and a settings panel for the reminder threshold and the sync toggle.
MyBlogLife
Web
This site: a trilingual static personal site
A personal website project for consolidating personal articles, creative works, resources, and friend interactions.
The site includes multiple sub-modules such as an article system (Ink), image gallery (Gallery), friend card system (Friend_z), and a resource sharing section. The project focuses on structured content management, dynamic content uploading, and a personal showcase platform with a pixel-art UI.
The project also serves as a personal tech experimentation platform for practicing web development, database design, and cloud deployment.
Main Features & Content
Article publishing system (Ink)
Image & creative showcase (Gallery)
RPG-style friend cards (Friend_z)
Resource sharing module
Chinese / English / Japanese + hreflang
Fully static — no server to babysit
Design Notes
A read-only site shouldn't need a server: Django → static export + Cloudflare Pages, zero ops
Three languages via path prefixes (/en/, /ja/) plus hreflang, not query strings or subdomains
Design-system tokens unify type and colour; pa11y handles accessibility checks
CJK fonts subset per page — each page ships only the glyphs it uses, cutting first load from ~5 MB to under 300 KB
Fonts: per-page subsetting at build time (Noto Serif SC / JP)
Deployment: Cloudflare Pages
Previously: Django + SQLite on AWS Lightsail
Recent Updates
[Rebuild] Moving to Astro: content separated from layout
The static site no longer needed a server, but its header was copied into 60 of 63 HTML files and every copy edit meant touching three language files.
So it is being rewritten in Astro: page logic written once, projects and articles moved into data files — plus light / dark themes, page-transition motion, and per-page CJK font subsetting.
[Rebuild] From a dynamic Django site to fully static on Cloudflare Pages
Keeping a server running year-round for an essentially read-only personal site was a bad trade — Gunicorn, systemd and certificate renewals all needed babysitting.
So the whole Django-rendered site was exported to static HTML (63 pages across Chinese / English / Japanese) and deployed to Cloudflare Pages.
A design system landed alongside it: shared type scale and colour tokens, a language switcher, hreflang, and accessibility fixes.
【Deployed】Now live on AWS Lightsail ($5 tier)
Now deployed on AWS Lightsail ($5 tier).
Currently planning to try it for 1 month, then plan to deploy to free Oracle.
Dev logAll 4 entries
【Deploy】Lightsail Initial Launch
Deployed Django + Gunicorn + Nginx to AWS Lightsail (Tokyo region, $5 tier).
Configured systemd for auto-start on boot; one-command deployment via rsync script deploy.sh.
[i18n] Trilingual Support (CN / JP / EN)
Implemented Django i18n internationalization, supporting Simplified Chinese, Japanese, and English language switching.
Added locale/ directory and .po translation files; all page text is translatable.
[Fix] Gunicorn Worker Deadlock Issue
Discovered intermittent Gunicorn worker freezes on the Lightsail instance (gevent compatibility issue).
Switched to sync worker and added timeout/max-requests configuration, resolving the issue.
Planning to migrate the server from paid AWS Lightsail to Oracle Cloud Always Free (ARM A1, 4 cores / 24 GB).
Cloudflare taking over the domain www.mybloglife.com for automated CDN / DDoS protection / HTTPS.
Installed oci CLI (v3.76.2) and flarectl CLI for automated configuration.
Generated a full migration plan document and synced to the Obsidian vault.
MangaRe
Web
Manga resource database
A website for organizing manga resource information, used to manage manga works, authors, and different resource types (TV anime, manga collections, films, etc.).
The project goal is to build a lightweight manga resource database website.
Main Features & Content
Manga entry logging
Tag & category management
CSV / JSON data import/export
Auto-update manga info (planned)
Manga resource search
Tech Stack
Frontend: React + TypeScript
Backend: Node.js
Database: Supabase
Deployment: Vercel
Recent Updates
[Speed] Static export, sidestepping cold starts and cross-region latency
The slow first paint traced back to two things stacking: Next.js function cold starts plus the round-trip latency of cross-region Supabase queries.
The resource catalogue changes rarely, so rendering it dynamically on every request bought nothing — switching to a static export plus image-component optimisation cut first paint substantially.
【Network Access Issue】Discovered that Vercel-deployed sites are inaccessible from mainland China
Testing by friends in mainland China has confirmed that websites deployed on Vercel are inaccessible from within China.
Going forward, I will first explore other services that offer free low-traffic deployment to find a solution to this issue.
[MangaRe_Log] 2026.3.5~
2026.3.5: Added image viewer, updated multiple pages including carousel/nav/sidebar, and added platform link migration & SQL.
2026.3.6: Completed a 'successful run' commit (project runs normally).
2026.3.7: Pre-Vercel deployment wrap-up: book download site & tool management, RLS/storage policies, migration scripts & docs.
2026.3.8: Built import pipeline (JSON conversion page & import page), plus resource history, title management & front-end page redesign.
2026.3.9: Unified language/platform options, updated Vercel & migration docs, added backup notes, import templates, anti-crawl & middleware (none committed).
2026.3.18: Did some work the past few days but forgot what exactly =w=. Yesterday bought a domain on Namecheap 【www.manga-re.com】 — come check it out if you're looking for manga resources~!
Dev logAll 5 entries
【Pre-Deploy】Vercel Initial Deployment
MangaRe first deployed to Vercel (2026-03-07).
44 files total, +1,763 lines of code.
Next.js 13 App Router + Supabase database configuration complete.
[Data Import] CSV/JSON Bulk Import Workflow
Implemented batch import for manga / anime / e-books / doujinshi across multiple types (2026-03-08).
10 iterative commits, refining the JSON conversion page, import validation, and error prompts.
[Standardization] Language/Tag Field Normalization
Standardized language fields and category tag fields (2026-03-09).
Fixed pinyin / wanakana compatibility issues with Chinese and Japanese text processing.
[New Feature] Japanese Learning Page
Added 【Japanese Learning】 page (2026-03-29).
JLPT / BJT / Listening & Speaking three sections + ⭐ pinned content tab.
Pinned tab added an 'Official Websites' banner group (JLPT / BJT / NHK official sites).
[Performance] Page Load Speed Analysis
Analyzed the root cause of slow Vercel deployments (Next.js cold starts + Supabase cross-region latency).
Evaluated three approaches: Next/Image component optimization, SSR/ISR, and one-click static export.
Implemented option three: Image component optimization + static export, significantly improving initial load speed.
MyProfile
Web
Character profiles with timeline visualisation
A data management website for organizing and showcasing character profiles.
The project supports structured storage of character information (timelines, relationship networks, event records, images, etc.) and displays characters' experiences and relationships through visual pages.
The project is also used to test large-scale JSON data rendering, complex UI layouts, and timeline component design.
Main Features & Content
Timeline event display
Character relationship network
Character profile modular display
JSON data import/export
Admin panel for editing character profiles
Tech Stack
Frontend: React (Next.js) + TypeScript
Backend: Node.js
Database: Supabase
Deployment: Not yet deployed
Recent Updates
【MyProfile_Log】2026.3.5~2026.3.9
2026-03-05: Initial project commit — set up backend skeleton (entities, controllers, services, security, docs).
2026-03-06: Integrated frontend, implemented import/export, timeline phases, attachment uploads, and event/hero photo management; refactored timeline UI.
2026-03-07: Enhanced timeline (hover cards, year/month API, left-side phase & event panels); added relationship editing and startup scripts.
2026-03-08: Implemented character simulation chat (character cards, DeepSeek/Mock replies, frontend chat panel).
2026-03-09: Added character photo panel; integrated event/hero/character photo management into timeline and edit pages.
Dev logAll 3 entries
[Lore Integration] Made in Abyss Asset Scan & Archive Site
Scanned local Made in Abyss art books (85 character design sheets + 100+ background illustrations + BDBOX character art).
Built a Made in Abyss archive site (local prototype): three pages — Home / World·Abyss / Character Gallery.
Character card grid, search filtering, and modal detail interactions all fully implemented.
[MIA RPG] Character & Story Settings Integration
Deeply integrated original MIA characters (MIA, Zhen, Zoe, etc.) with the Made in Abyss universe.
Generated character profile MDs, storyline documents, and detailed Worm-Cast Babel Tower worldbuilding settings.
Synced to the Obsidian vault.
[Pixel Art] RPG Character Pixel Sprite Creation
Created pixel sprite art for the MIA character using Pixellab (16×16 / 32×32 sizes).
Organized sprite import spec documents for RPG Maker / GDevelop.
Synced pixel art creation guide to the Obsidian knowledge graph.
AI_Resume
Web + extension
LLM-driven résumé screening (ATS)
An AI-driven resume screening system (ATS) for HR and recruiting teams.
Resumes arrive automatically from a corporate mailbox → get parsed → scored across multiple dimensions by an LLM against the role's requirements → then move through a kanban board.
By v6 it has grown from a single frontend into three pieces: a backend service, a dashboard frontend, and a Chrome extension for everyday HR work.
The biggest lesson from building it: if rules can settle it, don't call the model. Three layers of rule-based pre-filtering drop most irrelevant mail, so the LLM is spent only where judgement is actually needed.
Main Features & Content
Automatic mail intake: IMAP polls a corporate mailbox for resumes, on a two-stage concurrent architecture
Three layers of rule-based pre-filtering (sender domain → subject keywords → attachment fallback) at zero LLM cost
Resume parsing: plain text extracted from PDF / DOCX
Multi-dimensional AI scoring against role requirements, 10 requests in parallel
University tier quantified: domestic 985 / 211 / Double First-Class plus overseas QS Top 300 → an educationScore dimension
JLPT level extraction: recognises N1–N5 from the resume, candidates filterable by level
LangGraph university-advisor agent: a ReAct loop that calls database tools on its own and returns analysis an HR reader can use directly
Scoring output in Chinese or Japanese, switched by the role's locale field
WebSocket push: the dashboard is notified the moment a resume finishes processing
Candidate management: multi-criteria filtering, sorting, status flow, CSV export
Chrome extension: select a university name on any page for an instant lookup, with AI deep-dive in the side panel
Design Notes
Tiered cost: whatever rules can filter never reaches the model — the three-layer pre-filter costs zero LLM calls
Runtime chosen by workload: long-lived connections, concurrent scoring and a resident WebSocket moved it from Edge Functions to a resident Bun service
Output shaped for the user: internal tiers are for sorting only; HR sees labels they already understand
Tech Stack
Frontend: React 19 + TypeScript + Tailwind CSS
Backend: Bun + Elysia (TypeScript ESM)
Database: PostgreSQL + Drizzle ORM
AI: Vercel AI SDK + MiniMax M2.7 / LangGraph.js
Extension: WXT + React 19
Mail / parsing: ImapFlow + pdf-parse + mammoth
Recent Updates
[Rebuild] Backend moved off Edge Functions to a self-hosted Bun + Elysia service
The first version stuffed the logic into Supabase Edge Functions, and it stopped holding up fast: mail polling wants a long-lived connection, batch scoring wants concurrency, WebSockets want a resident process — none of which the edge runtime is good at.
So the backend moved wholesale to a resident Bun + Elysia service, with Drizzle as the ORM and a self-hosted PostgreSQL behind it.
Scoring was upgraded from a rule engine to multi-dimensional LLM scoring running 10-way parallel, and university tier and JLPT level became quantified, filterable scoring dimensions.
[Agent] A LangGraph university advisor that queries the database itself
When HR hits a university they have not heard of, the usual next step is a browser tab and a lot of digging.
So: a ReAct-style agent that decides for itself whether to call database tools for tier, domestic ranking and QS ranking, then writes it up as university analysis an HR reader can use as-is.
One deliberate detail — the output never exposes the S/A/B/C/D tiers stored in the database, only labels HR already understands (985 / 211 / Double First-Class / QS). The internal grading exists for sorting, not for people to read.
[Extension] Chrome extension v0.8.0: select a name, get the university
Putting the lookup into a browser extension means HR stops bouncing between the job site and the system: select a name on the page → an icon appears → click for the tooltip.
Fault tolerance took more work than expected: select too much (punctuation and badges swept in) and it has to pull the name back out of the text; select too little and it offers a candidate list with a "try another" button. Japanese, Korean, Hong Kong and Taiwan institutions show their original CJK names first.
The side panel hooks into the agent for deep analysis, and switching universities cancels the previous stream automatically. 259 tests.
Dev logAll 2 entries
[MVP Complete] Core Features Implemented
Built complete React 18 + TypeScript + Vite + Supabase architecture.
Implemented job management + bulk resume upload + PDF text extraction (Python Flask microservice).
Supabase Edge Function for automatic structured candidate information extraction.
Rule-engine scoring (A/B/C/D) + kanban drag-and-drop workflow management complete.
[Pending] LLM Integration Planning
Email auto-import is a mock implementation; the interface is ready and awaiting integration with a real email service.
LLM scoring enhancement scaffold is ready, awaiting Claude API integration for intelligent analysis.
PDF microservice deployed to AWS Lightsail; frontend deployment references Vercel/Netlify.
SkillsPaste
Desktop
Always-on-top one-click copy tool
A one-click copy floating desktop tool for Claude Code Skills.
Always on top, displays all skill trigger words by category — click to copy. Supports multiple workspaces and works as a general quick-paste clipboard.
Main Features & Content
Floating window (Always on Top) + frosted-glass UI
Drag position memory + 📌 pin mode
One-click copy trigger words (click highlight + Toast feedback)
Real-time search filter (highlight matched words)
EN / CN trigger word bilingual toggle
Multi-workspace support (built-in Skills + custom clipboard)
🌙 Dark / ☀️ Light theme toggle
Ctrl+E edit mode (add / delete / reorder)
System tray (close → minimize to tray)
Fully offline .exe, no browser needed
Tech Stack
Frontend: HTML / CSS / JS (Tauri WebView)
Backend: Tauri 2.x (Rust)
Database: JSON file (skills-data.json local storage)
Deployment: Windows .exe (cargo tauri build)
Recent Updates
No recent updates.
Dev logAll 4 entries
[Phase 1] MVP — Floating Window + One-Click Copy
Tauri 2.x project scaffold setup (frameless + always-on-top window).
Read skills-data.json, render categories × skills, click to copy to clipboard + highlight feedback.
Dark frosted-glass UI + title bar drag + 📌 pin button.
Fix: PowerShell script errors caused by Chinese characters, icon path issues.
[Phase 2-3] Experience Polish + Edit Mode
Phase 2: Position memory (restore last coordinates on launch), search filtering (real-time highlight matching), Toast feedback optimization, EN/CN bilingual trigger word switching.
Phase 3: Ctrl+E edit mode (add/delete/reorder categories and skills), system tray (close → hide), skill description + use-case expand.
Phase 6: Batch install multiple skills (sync-obsidian, viral-writer, etc.), generate draft skills guide website.
Phase 7: Complete Skills categories (new categories: social media / office / audio-video / desktop tools, etc.), optimize feature description text.
Phase 8: Align Skills list with Claude Code official directory, standardize category logic, full Obsidian sync.
Add 【Comments · Guestbook】 page
Hope to receive messages, ideas, suggestions, bad jokes (?), what you had for dinner (?) … from all visitors.
Especially messages from friends who are also listed in 【Friend_z】!
Future updates I'd love to make include 【personalized message boxes】 tailored to each friend recorded in 【Friend_z】 — if my skills get there (or I find a suitable animation library, and my little site's specs and traffic can hold up), I'd also love to add 【personalized animations】.
Letting a daydream sit here for now — don't go anywhere, I'll be right back.
[Pie in the Sky · Friend_z Character RPG Interactive Mini-Game]
Just an idea — no clue how to start implementing it yet.
Let me think about it first.