Coding Meet Kobweb

Coding Meet Kobweb is an open-source personal portfolio website built on the Kobweb framework, designed to display projects, services, blog articles, and achievement milestones from a single Kotlin-based codebase.

What is Coding Meet Kobweb?

Coding Meet Kobweb is a personal portfolio website created by Meet (under the Coding Meet brand) using the Kobweb framework, an opinionated Kotlin framework that runs on top of Compose HTML. The template takes content such as project descriptions, service listings, blog posts, and achievement data as input, and renders a live, animated portfolio site that can be exported as static files and deployed to Firebase Hosting. A live instance is available at codingmeet.com, and the full source code is publicly hosted on GitHub with 22 stars at the time of analysis.

Key Features

• Kobweb framework — Built on Kobweb, an opinionated Kotlin framework for creating web apps on top of Compose HTML, which brings reactive UI and SEO benefits to the Kotlin ecosystem.
• Portfolio sections — Displays projects, services, and blog articles in dedicated sections, giving visitors a single destination for all personal content.
• Achievement highlights — Showcases YouTube, GitHub, and Fiverr milestones so creators can surface their external platform growth.
• Interactive UI — Includes smooth animations and transitions across the interface, powered by Compose HTML's reactive rendering.
• Contact form with social links — Provides a contact form plus links to YouTube, LinkedIn, and Twitter for visitor outreach.
• Firebase Hosting deployment — Includes ready-to-run commands for static export via kobweb export --layout static and deploying through the Firebase CLI.
• Kotlin + Compose HTML stack — The entire UI is written in Kotlin using the Compose HTML library, keeping the codebase in one language.

Who is it for?

• Kotlin developers — Developers who want to build a portfolio site without leaving the Kotlin ecosystem can use this template as a reference for structuring UI with Compose HTML and Kobweb.
• Content creators — Creators with YouTube, GitHub, or Fiverr profiles can display those achievements and milestones prominently on a personal site.
• Freelancers — Freelancers offering services can present a services list, link to their blog, and capture leads through the contact form.
• Developers learning Kobweb — Those getting started with Kobweb can study a complete, working project that shows installation, local dev with kobweb run, and Firebase deployment steps.

What can you do with Coding Meet Kobweb?

• Showcase a personal portfolio — Design a homepage that pulls together projects, blog articles, and service offerings into one animated, Kotlin-driven site.
• Highlight third-party achievements — Display YouTube, GitHub, and Fiverr milestones to build credibility with site visitors.
• Collect visitor inquiries — Use the embedded contact form and social links to let potential clients reach out directly.
• Deploy a static site quickly — Follow the documented Firebase Hosting flow: run kobweb export --layout static, then firebase deploy, to publish the exported static files.

How does Coding Meet Kobweb work?

The project is split into a site folder that runs the development server when you execute kobweb run; the server serves the app at localhost:8080. For production, kobweb export --layout static generates a static export, and a Gradle task (:site:applyBlogLinkPreviews) enriches blog links before Firebase Hosting deployment via the Firebase CLI.