Mio-haimiya

Mio-haimiya is a personal portfolio website template built with Next.js 15 and React 19, styled with Tailwind CSS 4 and deployed on Vercel, created by a student developer named Anya to house her bot and small web app projects alongside her Haimiya-senpai fandom.

What is Mio-haimiya?

Mio-haimiya is a cute, animated portfolio site that presents a student developer's work in a soft pink and lavender visual theme. It takes the developer's project content as input and produces a single-page personal portfolio with smooth scrolling, falling petal animations, and a light/dark theme toggle. The site is built on the Next.js 15 App Router with React 19 and TypeScript, and is deployed on Vercel. It is described as the second version of the author's portfolio and is made by Anya.

Key Features

• Next.js 15 with React 19 — the App Router framework and React version powering the portfolio, written in TypeScript for type-checked components.
• Tailwind CSS 4 styling — the utility-first styling system behind the site's soft pink and lavender palette.
• Light/dark theme toggle — visitors can switch between a light and a dark appearance of the portfolio.
• Animated visuals — falling petals and smooth scrolling give the page its soft, animated feel.
• TypeScript type checking — a dedicated npm run typecheck command validates types across the codebase.
• No environment variables required — the project runs locally with just npm install and npm run dev, with no secrets or config to set up.
• One-click Vercel deployment — importing the repository into Vercel deploys it with the default Next.js settings, no extra configuration.

Who is it for?

• Student and hobbyist developers: use it as a starting point for a personal portfolio that shows off bot and small web app projects without needing to configure environment variables or a backend.
• Developers who want a themed personal site: the pastel pink/lavender palette, falling petals, and light/dark toggle suit creators who want an animated, character-themed portfolio rather than a plain corporate one.
• Next.js learners: the project is a small, self-contained reference for a Next.js 15, React 19, TypeScript, and Tailwind CSS 4 setup that builds and runs with standard npm scripts.

What can you do with Mio-haimiya?

• Student developers: clone the repo, run npm install and npm run dev, and replace the sample content with your own projects to get a running portfolio at localhost:3000 in minutes.
• Vercel users: import the repository into Vercel and it deploys with default Next.js settings, giving you a live portfolio URL with no build configuration.
• Fans and creators: the Haimiya-senpai-themed design shows how to build a character-fandom personal site with a themed color palette and animations.

How does Mio-haimiya work?

Install dependencies with npm install, start the dev server with npm run dev, then open localhost:3000. For production, run npm run build followed by npm start; a npm run typecheck command validates TypeScript types along the way.

FAQ

Is Mio-haimiya free to use?

The repository is publicly available with 77 stars and is described as a portfolio template, so it can be used as a starting point for your own portfolio. No pricing or license terms beyond that are stated on the page.

Does Mio-haimiya need any environment variables?

No. The project explicitly requires no environment variables — npm install and npm run dev are enough to run it locally, and Vercel deploys it with default Next.js settings.