Personal experience · LLM and web development
Building My Portfolio Website with LLMs
From no-code limitations to working with Cursor and Hermes Agent
I needed an up-to-date website for my work and résumé. This case follows my experience working with LLMs on the site: how I explored different tools and changed my process.
- FormatPersonal project
- My roleSet the direction and structure, review the result
- ToolsCursor, Hermes Agent, HTML/CSS, Figma, Lunacy
- StatusSite works; content and promotion are next
A portfolio site I needed
I did not have an up-to-date website with my work and résumé. I knew how to build pages by hand with HTML and CSS, and I had spent a lot of time with no-code platforms such as Weebly and Tilda. So I started with a website builder.
Where the builder fell short
I quickly ran into platform limits. Changing the site structure and experimenting with the design across multiple pages was cumbersome.
The homepage became my first experiment
Since the builder would not give me that flexibility, I started looking for another approach. First, I generated a homepage in several LLM-powered services. After a few iterations, I found a version I liked, saved the project, and continued in Cursor, an IDE I was learning at the time.
A workflow without finished mockups
From this point I had a new partner in development: the model itself. The next step was figuring out how to work with it, what to hand off and what to keep deciding myself.
I set the structure; the model wrote code
When I started working in Cursor, it only had a code assistant. I wrote prompts, the model generated files and code, and I reviewed and approved the result. I planned the page structure myself.
The design came together gradually and is still evolving. I described the style and elements I wanted, looked for references with ready-made code blocks, and combined them with my own decisions.
I checked the site in the browser
I opened the site on a laptop, desktop, tablet, and phone, watched how it behaved, and decided what to refine. Website builders offer previews at different sizes too, but getting from an idea to an edit took more steps.
In Figma and Lunacy, I prepared individual assets: screenshots of apps and websites for case studies, graphics, an avatar, and vector icons.
A design system and branches for experimenting
I started building a design system and shared components early on. That kept the pages consistent and made it easier to update an element in one place, instead of visiting every page by hand and changing each instance separately.
Git branches gave me similar freedom at the project level: I could try different directions for the site without mixing them into one line of development. I described what I wanted to the agent, reviewed the result, and either moved on or asked it to try again.
Moving to agent-driven development
A design system and branches solved problems inside the project. But the real shift in my process started when the development tool itself changed.
Cursor: from code assistant to agent
A few weeks after I started working on the site, Cursor added an agent window. I switched fully to the agent and did not return to the classic IDE workflow.
Hermes Agent: flexibility and cost
Later, I began exploring Hermes Agent. It was more flexible to configure and let me connect any LLM provider. There was no subscription for the tool itself, which made development cheaper. When my Cursor quota ran out, I had to wait until the next month. That got in the way of work.
CI/CD: from local preview to production
The agent writes the code, but the site still needs somewhere to live and ship from. I connected local development, version control, and publishing through three tools: Hermes Agent, Gitea, and Coolify.
To publish the site, I rented a VPS and installed Coolify on it, a platform for deploying web applications. My portfolio is built like any other web app, so it runs there the same way. For version control, I set up a separate Gitea repository that holds the full history of the project.
Local preview alongside Hermes Agent
Hermes Agent and the working copy of the site live on a separate VPS with a local preview server running. I do my work from a laptop and a phone: the laptop sits on the same virtual network as the agent's VPS, so I can open the local version of the site in a browser and see the result right away.
From main to production
When I am happy with the changes, the agent commits and pushes them to the main branch. Coolify watches that branch, and a push to it triggers a deployment: the new version of the site becomes available to visitors.
The working version is ready
The whole chain, from idea to production, now runs through the agent: setting the task, writing code, checking it on the local server, committing, and an automatic deploy. The site is fully functional. Next, I plan to work on its content and promotion.
