DEV Community

SimonAking
SimonAking

Posted on

Sharing Several Personal Blog-Related Projects: Homepage, About Page, and Photo Gallery

I'd like to share three open-source projects that can help you build a complete personal website: a creative homepage for navigation, an interactive about page, and a dynamic photo gallery.

[Open Source] TermFolio - A Terminal-Style Personal Information Display Component

https://github.com/SimonAKing/TermFolio

TermFolio is a terminal-style component designed for developers to showcase their personal information, project experience, and technical skills. Key features include:

Authentic Terminal Experience:

  • Supports common commands like ls, cd, pwd
  • Smart command completion with Tab
  • Command history navigation using arrow keys
  • Highly customizable: Define custom commands, prompts, and display content

Perfect for technical blog introduction pages and developer online resumes.

terminal-intro

Live Demo

[Open Source] Blog Homepage Template: WebGL Fluid Animation + Interactive Gaming Background

https://github.com/SimonAKing/HomePage

An elegant and user-friendly personal homepage template featuring fluid animation backgrounds and smooth page transitions. Ideal for developers, designers, or creative professionals looking to quickly build a personal showcase website. For beginners, it's an excellent opportunity to learn about WebGL animation implementation, page transition effects, and how to combine stunning visuals with practicality. The entire project is simple to configure - just modify the configuration file for complete personalization.

preview

Live Demo

[Open Source] Elegant Photo Gallery Template: Image Preview & Compression Ready

Project Repository:
https://github.com/SimonAKing/AnimatedGallery

Project Description:
This is an open-source photo gallery project that uses a masonry layout to display images, featuring responsive design that perfectly adapts to both mobile and desktop platforms.
The project implements BlurHash for elegant image loading, combined with lazy loading strategies to enhance performance. It uses Sharp for image compression, automatically balancing loading speed and display quality.
It's ready to use out of the box - simply place your photos in the designated directory to update the gallery.

preview

Live Demo

Top comments (0)