About this project
I created this profile to present myself as a Computer Science engineer: my experience, projects, and way of thinking. Instead of a PDF résumé or a platform profile, I wanted a page I fully own — where I can write about what I build and share it with others.
In this article I will show you how to build a similar page for yourself. By the end you will have a live personal site with your own domain, deployed automatically on every push.
Architecture
Stack: Astro 4 · Static output · Vercel
Astro was chosen over Next.js and Hugo because it ships near-zero JavaScript by default (good for SEO and first impression), has first-class Markdown/MDX support for project pages, and includes native RSS and sitemap integrations. The site compiles to a fully static bundle — no server, no hydration overhead.
Content model: each project is a Markdown file under src/content/projects/. The frontmatter carries metadata (title, description, tags, status, repo URL); the body is the article. Routes are /<slug> at the root — clean, shareable URLs.
Design: JetBrains Mono throughout. Monospace fonts signal the engineering audience without requiring any visual tricks. The amber accent (#cf7e1f) provides the only color. Everything else is near-neutral grays.
How to build your own
1. Create a project and init Astro
Create a repository on GitLab or GitHub, then initialize an Astro project:
npm create astro@latest
Add your personal data: name, role, experience, links. Astro’s file-based routing means src/pages/index.astro becomes your homepage.
In other way, you can fork my project or look at Tips and Trics section to init project in AI-agentic way.
2. Deploy to Vercel
Sign up at vercel.com, connect your GitLab or GitHub account, and import your repository. Vercel detects Astro automatically and configures the build.
After the first deploy, Vercel gives you a free domain like your-project.vercel.app. The site is live immediately.
3. Register a domain (optional)
Pick a short domain that matches your name, like almazmelnikov.ru. I registered mine at reg.ru for about $2 per year. Any registrar works — the important thing is to own a URL you control long-term.
4. Connect your domain (optional)
In your Vercel project settings, go to Domains and add the domain you registered. Then point the domain’s DNS to Vercel following the instructions shown — usually it takes a few minutes to propagate.
This step is optional: the Vercel-generated domain works fine, but your own domain looks more intentional and is easier to share.
5. Iterate and publish
From this point the workflow is simple: edit locally, test with npm run dev, then push to the main branch. Vercel picks up every push and redeploys automatically — usually within a minute.
npm run dev # open http://localhost:4321 to preview
git push # Vercel redeploys automatically
Improve the site gradually: add projects, refine the design, write articles. Every push goes live without any manual deployment step.
Tips and tricks
Use Claude to generate the design and the code. I did not write this site from scratch by hand. The workflow was:
- Open claude.ai/design and describe the page you want — layout, sections, color palette, font. Claude generates a visual design and exports it as a single HTML file.
- Take that HTML file as the starting point and copy it to your local repo. Use Claude Code — an AI coding assistant that works directly in your terminal.
- Ask Claude Code to convert the static HTML into an Astro project, wire up the content collections, add the sitemap, and implement everything else described in this article.
The entire project — structure, styles, content model, build pipeline — was generated and refined through conversation with Claude Code. As a backend engineer I did not need to learn frontend tooling from scratch; I described what I wanted and iterated on the result.
This is a practical shortcut for anyone who is not a frontend specialist but wants a clean, intentional-looking site without spending weeks on it.