Feature: Blog Page

[faiq-naufal]

What is the issue about?

Building a layout and template for Inlive blog page.

How urgent this issue?

Moderately, we need a blog to write a post and update about our product.

Describe the issue

A blog page is a good way to keep track of the latest news and information related with our product and development updates. We already have the design from Figma here which has two layouts design:

1. List of blog post layout: a layout to display a collection of created post and each of them is a link to single blog page layout.
2. Single blog post layout: a layout to display a detail information about the specific post. The content will be rendered from Markdown format.

What is the possible solution we have?

In order to create a list layout and single layout, we will use Hugo list and single layout features. We will create a layout directory called blog and put the list and single layout inside it. This directory will be used with blog-related layouts. We will create the UI template inside this blog layout directory.

For the content, there is already blog directory inside the content directory in our Hugo project. We will create the dummy content inside it and ensure the content in Markdown format can be parsed and rendered in our list and single layouts blog.

The blog must be responsive because sometimes our viewer will read in mobile devices.

Tasks:

• [x] Create UI for list layout blog page
• [x] Create UI for single layout blog page
• [x] Make the list layout responsive in mobile view
• [x] Make the single layout responsive in mobile view

References:

https://tailwindcss.com/blog https://gohugo.io/templates/lists https://gohugo.io/templates/single-page-templates/

[faiq-naufal]

Close this issue as this is already done by this PR https://github.com/asumsi/inlive-website/pull/13 and can be seen on https://dev.inlive.app/blog/