Repository navigation
Home
A fast, good-looking portfolio that you can make your own.
This is the source of umutbayraktar.vercel.app, the portfolio of Umut Bayraktar, founder of Codeshare. It is built with Next.js 16, the Once UI design system, TypeScript and MDX, and it is released under the MIT license. You can fork it, put in your own name, links and projects, and publish it as your own portfolio.
Note: The repository ships with Umut's own content (his bio, his projects, his links). This wiki shows you where each piece lives so you can swap it for yours. Start with Make It Yours once the site runs on your machine.
| What you get | |
|---|---|
| One place for your details | Your name, role, bio, social links, experience, skills, gallery and GitHub user live in one file: src/resources/site-data.tsx. |
| Projects as files | Each project is one .mdx file. Its front matter becomes a card on /work; the text below it becomes a full case study page. |
| Live project covers | Every project card can show a fresh screenshot of the project's own website. Chromium takes it during the build and again once a week. |
| Live numbers | Write %project.key% in your text and the number is filled in from a stats page at build time, then refreshed weekly. |
| GitHub page |
/github lists your public repositories, with the ones pinned on your GitHub profile at the top. |
| Polished by default | Dark and light mode, a floating navigation bar that moves to the bottom on phones, and subtle background effects. |
| Search and sharing | Page metadata, Schema.org data, generated Open Graph images, sitemap.xml and robots.txt come built in. |
| Optional password pages | Put any page behind a simple password with one line of config and one environment variable. |
| Theme from one file | Colours, borders, surfaces, fonts and effects are set in src/resources/once-ui.config.ts. |
You need Node.js 22.17 or newer (or Node.js 24+) and npm. See Installation for details on each operating system.
- Clone the repository:
git clone https://github.com/umutxyp/Personal-Website.git
- Go into the folder:
cd Personal-Website - Install the packages:
npm install
- Start the development server:
npm run dev
- Open http://localhost:3000 in your browser.
| Page | Address | What it shows |
|---|---|---|
| Home | / |
Headline, a short intro with live numbers, and a button to the About page |
| About | /about |
Avatar, role, languages, social links, intro, work experience, studies and skills |
| Work | /work |
One card per project, in the order you choose |
| Case study | /work/<slug> |
The full write-up for one project, plus related projects |
| Gallery | /gallery |
A two-column masonry grid of images |
| GitHub | /github |
Your pinned repositories, then all other public repositories by stars |
Every page can be switched on or off. The full tour is on Pages and Features.
You edit a handful of files on the left. Next.js turns them into pages. The server fetches the live parts (numbers, repositories, screenshots) and caches them, so visitors always get fast, pre-built pages.
Taken from package.json:
| Area | Package |
|---|---|
| Framework |
next ^16.2.6 (App Router), react / react-dom ^19.2.6 |
| UI |
@once-ui-system/core ^1.4.27, react-icons ^5.5.0, sass ^1.86.3 |
| Content |
@next/mdx, @mdx-js/loader, next-mdx-remote ^6.0.0, gray-matter
|
| Screenshots |
puppeteer-core 25.11.0, @sparticuz/chromium 153.0.0 |
| Other |
cookie (password pages), transliteration (heading links), recharts
|
| Tooling |
typescript ^5.8.3, @biomejs/biome ^1.9.4 |
| Page | Read it when you want to... |
|---|---|
| Installation | install Node.js and run the site on Windows, macOS or Linux |
| Configuration | look up any setting, environment variable or default value |
| Make It Yours | replace Umut's content with yours, step by step |
| Pages and Features | understand every page, live numbers, screenshots, SEO and the API routes |
| Adding Projects | add, order or remove projects and write case studies |
| Deployment | put the site online with Vercel or on your own server |
| Troubleshooting | fix an error or find a quick answer in the FAQ |
| Contributing | send a fix, report a bug or report a security problem |
- Designed, built and maintained by Umut Bayraktar, founder of Codeshare.
- Built on Next.js and the Once UI design system.
- Released under the MIT License. You are free to use it for your own portfolio; keep the license notice in your copy.
If this project helps you, a star on GitHub is a nice way to say thanks.