DEV Community

Patrick Hannah
Patrick Hannah

Posted on • Originally published at ronin48llc.github.io

Creating a Personal Landing Page: Oops I created a CMS

Well, that got out of control.

I ended up building more of a landing page than a blog (perhaps what LinkedIn could be? Or a really powerful LinkTree-like site). My initial goal was to create a simple showcase of my work and achievements, but as I delved deeper into the project, it evolved into something much more comprehensive and robust.

Delving into the Scraping Process

Gathering Data from Various Sources

To create a landing page that truly represents me, I had to gather a significant amount of information from various sources. This process involved dealing with both public and non-public APIs, which presented its own set of challenges. While Kiro's warnings about the risks of using non-public APIs were very much valid, the data I scraped was essential in creating a comprehensive and personalized landing page.

Scraping data from APIs was relatively straightforward and provided the foundation for my landing page, ensuring that it was both informative and reflective of my professional journey.

Building a Custom CMS

The Need for a Content Management System

As I started aggregating data, I quickly realized that I needed a way to manage and edit these pages effectively. While WordPress is a popular and powerful option, I chose to create a custom content management system (CMS) to avoid the usual security and operational concerns associated with WordPress. This decision allowed me to have full control over the development process and to tailor the CMS to my specific needs.

Creating a Local Client

The custom CMS I built is designed to run locally on my machine. This local client ensures that all the code is executed in a controlled environment, providing a seamless development experience. Once the code is ready, it is versioned and pushed to GitHub. However, the CMS is flexible enough to work with any static hosting site solution, giving me the freedom to choose the platform that best suits my needs.

Enhancing Visual Appeal with Jekyll

To handle the visual aspects of my landing page, I used Jekyll, a popular static site generator, combined with a well-crafted template. Jekyll's simplicity and flexibility made it an ideal choice for this project, allowing me to create a visually appealing and professional-looking website without the need for complex server-side scripting.

Enhancing the Project with Additional Features

To further enhance my landing page, I created several additional features that improve both the functionality and user experience.

Media Library Manager

Organizing and Managing Media Files

One of the key features I added was a media library manager. This tool is essential for organizing and managing all the media files I use on my site, such as images, videos, and presentations. It also deploys and manages the content delivery network (CDN), ensuring that my media content is efficiently distributed and accessible to users worldwide.

Keeping Content Up-to-Date

In addition to managing media files, the media library manager extracts and re-tags common tags from YouTube and SlideShare content I have previously authored. This ensures that my landing page always showcases the most relevant and up-to-date information. With nearly 200 references, having a well-organized media library is crucial to avoid overwhelming visitors with too much information.

URL Shortener

Simplifying Long URLs

Another crucial addition to my landing page is a URL shortener. This feature simplifies long URLs, making them more user-friendly and easier to share. It also helps with tracking and analytics, providing insights into how users interact with my content. By shortening URLs, I can monitor which links are most popular and adjust my content strategy accordingly.

YouTube Synchronization

Keeping Content Fresh and Engaging

To keep my content fresh and engaging, I implemented YouTube synchronization. This feature automatically updates my landing page with the latest videos from my YouTube channel, ensuring that visitors always have access to the most recent content.

Editorial Assistance with Bedrock

Maintaining High-Quality Content

To maintain high-quality content, I integrated Bedrock, as an editorial assistance tool. Using basic prompts, Bedrock helps with spelling and grammar checks, as well as elaboration and generation of titles, descriptions, and tags. This feature ensures that my content is polished and professional, while still remaining authentic to my voice and style. By leveraging AI-driven editorial assistance, I can focus on creating high-quality content without worrying about minor errors or inconsistencies.

Balancing Efficiency and Effectiveness

While this project isn't 'agentic' in the sense of being fully autonomous, it strikes a balance between efficiency and effectiveness. By building a custom CMS and adding these additional features, I created a landing page that is not only functional but also serves as my portfolio. This balance ensures that I meet my needs while keeping costs and resources in check.

Conclusion

Creating a personal landing page turned out to be more than a 24-hour project, but (and the same can be said about nearly any AI project), it came down to data quality. I found this to be a great exercise in using Kiro to build something that sees the light of day (versus the other dozen or two projects I've not yet deployed). The journey of creating this landing page has been a valuable learning experience, providing insights into the intricacies of scraping APIs, building a custom CMS with Jekyll, and the balance between efficiency and effectiveness in personal projects.

Top comments (0)