YT-TechDev logoYT-TechDevPortfolio & Blog
HomeAboutProjectsLabBlogContact
YT-TechDev logoYT Tech DevBlog Portfolio

A personal portfolio and engineering blog focused on frontend development, interactive UI, React Three Fiber, and practical product building.

Next.jsTypeScriptR3FSupabaseCloudFlarevercel

Site

  • Home
  • About
  • Projects
  • Blog

Explore

  • Lab
  • Portfolio
  • Contact

Focus

  • Frontend
  • React Three Fiber
  • Design Notes

© 2026 YT Tech Dev. All rights reserved.

Built withNext.js, Tailwind CSS, and Supabase.

ENOriginalJA日本語

Lab

Experiments & Notes

The Lab is a place for experiments, prototypes, visual systems, and development notes that may not be full products yet, but still help build better frontend systems.

Asset Delivery

Active

Cloudflare R2 Asset Delivery

An asset delivery setup for managing blog images, 3D files, and visual resources through Cloudflare R2 and referencing them from the portfolio site.

Cloudflare R2AssetsCORSImage Delivery

Motion Design

Built

Framer Motion Hover Glow

A cyber-inspired hover effect that moves a dark cyan glow across cards using easing and motion-based visual feedback.

Framer MotionTailwind CSSHoverEasing

Page Transition

Built

Route Transition Overlay

A loading and transition overlay that smooths page navigation and helps connect the interactive homepage with standard supporting pages.

Next.jsTransitionOverlayUX

Architecture

Built

Static Page Architecture

A static data and Server Component approach for low-update pages such as About, Projects, and Lab, avoiding unnecessary database complexity.

Next.jsServer ComponentStatic DataArchitecture

Layout Design

Built

Portfolio Header Responsibility

A layout responsibility split where the homepage remains a headerless interactive experience while About, Projects, Lab, and Blog use standard navigation.

LayoutNavigationApp RouterUX

3D Scene Concept

Concept

GLB Desk Scene Concept

A concept for combining PC, desk, chair, and character assets into a small nighttime work scene rendered on the web with React Three Fiber.

BlenderGLBR3FScene Design

Automation / AI

Concept

LINE Assistant Replacement Lab

A lab item for exploring how a long-running LINE Messaging API and Google Apps Script app could be redesigned for the AI era.

LINE Messaging APIGASAIAutomation

API Automation

Existing

Weather Automation Prototype

An automation feature that retrieves weather information from external APIs and integrates it into scheduled messages or daily notifications.

OpenWeatherAPIGASSchedulerAPI

Lightweight Backend

Existing

Spreadsheet-Backed Content

A lightweight backend approach that uses Google Sheets as a simple data store for anniversary content, conversation logs, and configuration values.

Google SheetsGASData StoreAutomation

Migration Notes

Concept

Legacy Automation Migration Notes

A migration note for gradually replacing existing GAS-based automation while keeping the working system stable during transition.

MigrationLegacyArchitecturePlanning

Page 2 / 2

← Previous
12
Next →

Direction

From experiments to projects

Some experiments start as visual ideas, technical tests, small utilities, or architecture notes. When they become stable enough to explain as a complete system, they can move into Projects or become detailed Blog articles.