How to create a fully functional blog with Alpas, Kotlin, and Tailwind — part 1: setup project…
Tags: framework, alpas, blog, kotlin
Published: 2020-03-11 19:44:11

---
title: How to create a fully functional blog with Alpas, Kotlin, and Tailwind — part 1: setup project…
published: true
date: 2020-03-11 19:39:59 UTC
tags: framework,alpas,blog,kotlin
canonical_url: 
---

### How to create a fully functional blog with Alpas, Kotlin, and Tailwind — part 1: setup project, database, and routes

![](https://cdn-images-1.medium.com/max/1024/1*mn5RkNDtzvmpOPv3BwYAqw.png)

In this multi-part series, I’ll walk you through, step-by-step, on how to create your very own, fully functional blog using [Alpas](https://alpas.dev), [Kotlin](https://kotlinlang.org/), and [Tailwind CSS](https://tailwindcss.com/).

> In this part 1 guide, we will setup an Alpas project, database, and routes.

With just a little added TLC and a dash of personal flair, you will be in the position to deploy your very own blog with its own lightweight Content Management System (CMS) - all built by you! 📰

#### The main features of the blog that you will create are

- Ability to create a new blog post
- Ability to manage (edit/delete) blog posts
- Validation that proper metadata and content exists before post submission
- Ability to page and navigate between blog posts

#### The main Alpas features you will use and learn are

- Connecting to and working with a database
- Create custom validation rules
- Convert markdown to HTML
- Persisting inputted content on failed form validations
- Page blog posts, including previous/next navigation

### Step 1: Start your project

Head over to the [Alpas Starter project](https://github.com/alpas/starter) on GitHub and setup your new blog using the stater template. Perform the initial steps required to successfully run your starter template.

💡 If you need help on getting started, review the Alpas [Installation Doc](https://alpas.dev/docs/installation) and the first couple steps of the [Quick Start Guide](https://alpas.dev/docs/quick-start-guide-todo-list) to get rolling on setting up an Alpas project.

### Step 2: Setup your database and blogs table

1. Setup a new local database and connect to it from within your project.
2. Create a new blog entity using `./alpas make:entity` blog command
3. Update the **Blog.kt** entity file to include id, content, created\_at, and updated\_at fields
4. Create a blogs table using `./alpas make:migration create\_blogs\_table --create=blogs` command
5. Migrate your blogs table to your database using `./alpas db:migrate` command

**Perfecto! We have completed the database portion. Now, let’s get into creating routes.**

💡 Check your progress against [blog.kt](https://github.com/armgitaar/blogify/blob/master/src/main/kotlin/entities/Blog.kt) and don’t forget to uncomment `addConnections(env)` in the DatabaseConfig file

#### 📄 **Related Documentation**

- [Entity Relationship](https://alpas.dev/docs/entity-relationship#main)
- [Migrations](https://alpas.dev/docs/migrations/)

### Step 3: Setup your database and blogs table

Routes. It’s where routing happens! 😂

Open the **routes.kt** file and add the following:

```
private fun RouteGroup.webRoutesGroup() {
    get("/", BlogController::index).name("welcome")
    get("/<page>", BlogController::pages).name("pages")
    get("blog/<id>/<page>", BlogController::show).name("blog.show")
    get("blog/new", BlogController::new).name("blog.new")
    post("blog/submit", BlogController::submit).name("blog.submit")
    get("blog/edit/<id>", BlogController::edit).name("blog.edit")
    patch("blog/edit/<id>", BlogController::update).name("blog.update")
    delete("blog/<id>", BlogController::delete).name("blog.delete")
}
```

Notice, we removed the WelcomeController route as we will only use BlogController. You can update the WelcomeController import to be BlogController as well. We will create the BlogController in future post within this series.

**Browsing through the different routes, you can easily gather what the main front-end user interactions will be:**

- Main index / welcome page
- Paging for when your blog has multiple posts — in this exercise we will display 9 posts per page
- Showing the blog post detail page
- Submitting a new blog post
- Enter an Edit mode for blog posts where you update the post’s content
- Remove a blog post

💡 Check your progress against [routes.kt](https://github.com/armgitaar/blogify/blob/master/src/main/kotlin/routes.kt)

#### 📄 Related Documentation

- [Routing](https://alpas.dev/docs/routing)

That’s it for part 1 of this series. You can always jump ahead and [look at the finished project on GitHub](https://github.com/armgitaar/blogify).

**In part 2 of this series, we will work on creating a service provider, a markdown to HTML convertor, and a controller.**

[Read part 2](https://dev.to/armiedema/how-to-create-a-fully-functional-blog-with-alpas-kotlin-and-tailwind-part-2-setup-service-38b2)
[Read part 3](https://dev.to/armiedema/how-to-create-a-fully-functional-blog-with-alpas-kotlin-and-tailwind-part-3-validation-rule-4bin)

* * *