Click to Enter

A Sample Blog Website Demonstrating Masonry Layouts with Vanilla JS in a Next.js Environment

This website, primarily built with Next.js, showcases how to achieve masonry layouts using vanilla JavaScript. The index page dynamically adds blocks for each post, automatically adjusting the layout based on the content of each post. All posts are server-rendered static pages, optimized for SEO.

Just drop your Markdown files into the /posts folder, and this magical website will automatically transform them into stunning, static web pages. No complex coding required!

For posts, you can add:

  1. Normal Blocks: Posts with tags, images, and text content.
  2. Pure Image Blocks: Posts consisting only of images.
  3. Action Blocks: Posts with buttons or other custom interactive content.