# Pisitkorn Bootchada (Korn) · Frontend Developer

> Frontend developer with two years of building and running a production e-commerce platform end to end: Figma prototypes, Next.js and React, a 3D PC builder in Three.js, payments, deployment and the monitoring after it ships.

Location: Pathum Thani, Thailand. Languages: Thai (native), English (basic–intermediate). Pronouns: she/her.
Contact: see the Contact section of https://cv.rosekorn.com/ (the e-mail is shown to visitors only). GitHub: https://github.com/rose-korn

## Pages
- [Home](https://cv.rosekorn.com/): the full CV with projects, skills and the 3D hero
- [Printable CV](https://cv.rosekorn.com/cv/): one-page A4 version
- [CV as JSON](https://cv.rosekorn.com/cv.json): structured data for parsers
- [Case study: 3D PC Builder](https://cv.rosekorn.com/projects/pc-builder/): An interactive 3D builder where customers watch the parts they pick come together into a full PC build, with compatibility checks built in.
- [Case study: Checkout & Payments](https://cv.rosekorn.com/projects/saved-cards/): The store's checkout, from coupons and instalments to tax invoices and saved cards on Omise, built to be safe with real customers' money and data.
- [Case study: Site-wide Dark Mode](https://cv.rosekorn.com/projects/dark-mode/): Dark mode across the whole store, without changing a single colour of the existing light theme.
- [Case study: Storefront UX](https://cv.rosekorn.com/projects/storefront/): The parts of the store customers touch every day: finding the right product, comparing it, zooming in and getting drivers after they buy.
- [Case study: Ship & Watch](https://cv.rosekorn.com/projects/ship-it/): Running the production Next.js site: deployment, a safe UAT server, SEO and performance monitoring, and the docs that help other teams.
- [Case study: Talai Tracker](https://cv.rosekorn.com/projects/talai/): A tracking app for the campus songthaew (talai), so students know where the ride is and how full it is.

## Experience and education
- Nov 2024 – now: Frontend Developer, iHAVECPU. Building and maintaining the e-commerce frontend end to end: a 3D PC builder, Omise saved-card payments, AWS deployment, SEO monitoring and the ERP Prototype V1 frontend, all wired to REST APIs for product data and the cart. Started alongside a senior backend developer and moved into a dedicated frontend role after showing strength in web development.
- Sep – Nov: .NET Developer, CCP Concrete · Chonburi. Developed a “Ship To” shipping submission page with ASP.NET Core MVC and an e-mail notification triggered on save.
- 2 months: IT Intern, Charoen Pokphand Foods PCL · Chonburi. Built a weather forecast website and an air quality index monitor for the factory: React front end, Node.js back end and Arduino sensor hardware.
- 2020 – 2024: B.Eng. Computer Engineering, Kasetsart University, Sriracha Campus. Senior project: Talai, a campus car tracking app shipped on Web, iOS and Android with a team of three.
- 2018 – 2020: High school, Sriracha School. Where the trail starts.

## Projects
### 3D PC Builder (iHAVECPU)
An interactive 3D builder where customers watch the parts they pick come together into a full PC build, with compatibility checks built in.
Role: Frontend and 3D: scene, interaction, compatibility logic and performance.
Stack: Three.js, React Three Fiber, drei, GSAP, Next.js, TypeScript, WebGL
- Real-time 3D scene that colours each part from the selected product, with selection effects and spec callouts
- A 7-slot bar for the main parts, plus a dock and product panel for picking
- Filters products by socket and slot; RAM, M.2 and GPU picks auto-adjust when the motherboard changes, with an undo notice
- Same slot-limit and stock warnings across every category; the list refreshes in the background without the page jumping
- Kept it smooth with lazy loading, adaptive resolution and pausing the render when idle; fixed race conditions when switching categories
- Opt-in device check (CPU threads, RAM, GPU and a tiny benchmark) that runs only in the browser and shows how well 3D mode will run, designed with Thailand's PDPA in mind

### Checkout & Payments (iHAVECPU)
The store's checkout, from coupons and instalments to tax invoices and saved cards on Omise, built to be safe with real customers' money and data.
Role: Owned the checkout frontend, working with backend developers on the API.
Stack: Next.js, React, TypeScript, Formik, Omise, AES-256
- Coupon and monthly-instalment calculations at checkout
- Address and tax-invoice validation so orders go out right the first time
- Saved cards on Omise: looks up an existing customer by e-mail first, so no duplicates
- Retries safely on network failures, since card tokens are single-use
- Customer IDs and tokens encrypted with AES-256

### Site-wide Dark Mode (iHAVECPU)
Dark mode across the whole store, without changing a single colour of the existing light theme.
Role: Designed the token system and rolled it out across the site.
Stack: next-themes, CSS variables, View Transitions API, styled-components, Emotion
- Design tokens in CSS variables so both themes come from one source
- Light theme kept pixel-identical while dark mode was added
- Theme toggle animated with the View Transitions API
- Fixed third-party components such as react-select so they follow the theme

### Storefront UX (iHAVECPU)
The parts of the store customers touch every day: finding the right product, comparing it, zooming in and getting drivers after they buy.
Role: Built and maintained these storefront features from Figma to production.
Stack: Next.js, React, TypeScript, styled-components, MUI, Ant Design
- Product Journey: recommends products by what you'll use them for, with purpose selection, a guideline and an interview overlay, plus a mobile journey
- Benchmark product cards that show expected game performance for the spec, with skeleton loading
- Redesigned image zoom: a rotary dial outside the image on wide screens and a zoom bar on tablets, applying transforms directly while dragging to cut re-renders
- Driver download centre with progress bars, skeletons and driver lists
- Header, mobile navigation, category menus and homepage promotion sections
- Small things that matter: scroll lock without layout shift, 16px inputs so iOS doesn't zoom, notifications above modals, support for older Chrome

### Ship & Watch (iHAVECPU)
Running the production Next.js site: deployment, a safe UAT server, SEO and performance monitoring, and the docs that help other teams.
Role: Owner of deployment and post-release monitoring for the frontend.
Stack: AWS EC2, PM2, nginx, Cloudflare, GA4, Search Console, Figma, TablePlus
- Set up and maintain production on AWS EC2 with PM2, nginx and Cloudflare
- Stood up a UAT server that blocks bots and search-engine crawling; test every release before and after deploy
- Figma prototypes for Product Manager approval, then built in Next.js, React and TypeScript
- Monitor SEO with GA4 and Search Console, report to the Managing Director and fix drops with the SEO team
- Trace issues through the database in TablePlus and report root causes to the department head
- Write and maintain internal guidebooks on modules and known issues; built the ERP Prototype V1 frontend

### Talai Tracker (University project · team of 3)
A tracking app for the campus songthaew (talai), so students know where the ride is and how full it is.
Role: Built the whole application myself: UI/UX, admin panel and the Firebase back end.
Stack: Flutter, Firebase, YOLOv9 (team), GPS (team)
- University-verified registration
- Lost-and-found board for items found around campus
- News feed with likes and comments
- Teammates handled passenger counting with YOLOv9 and GPS location capture

### Factory Air Meter (CP Foods internship)
An air quality index monitor for the factory, plus a weather forecast website.
Role: Front end, back end and hardware integration.
Stack: React, Node.js, Arduino
- Arduino sensor box collecting air readings on site
- Node.js back end serving the results
- React dashboard showing the quality index

### valorant-list (Side project)
A fan web app for friends in the Valorant community that browses game data from the public valorant-api.com.
Role: Solo: data fetching, structure and UI.
Stack: Next.js, React, TypeScript, Tailwind CSS
- Consumes and structures the public valorant-api.com REST API
- Built for the community, non-commercial

## Skills
- Languages: JavaScript, TypeScript, C#, HTML & CSS
- Frameworks: Next.js, React, ASP.NET Core MVC
- Data & APIs: REST APIs, JSON, Fetch API
- UI & styling: styled-components, Emotion, MUI, Ant Design, Formik, next-themes, Tailwind CSS
- 3D / WebGL: Three.js, React Three Fiber, drei, GSAP
- Payments & analytics: Omise, GA4, Google Search Console
- Deployment: AWS EC2, PM2, nginx, Cloudflare
- Tools: GitHub, TablePlus, Figma, VS Code, Postman
- AI tools: Claude, Gemini, ChatGPT, GitHub Copilot
- Also used: Flutter, Firebase, Node.js, Arduino