Building a Section Component with Leaflet Maps for Metalsmith Discover how to integrate interactive maps into your Metalsmith projects using the Leaflet JS library. From setting up the frontmatter to rendering the map with markers, our guide walks you through every step.Website Development in 2023 In this blog post, we'll explore how to build a website using the Metalsmith static site generator, aligning with the 'Use the platform' philosophy to streamline web developmentIntroducing Metalsmith First and ms-start Metalsmith First is a website starter and ms-start is a command-line interface (CLI) tool designed to streamline the process of setting up a Metalsmith First project, an innovative and modular approach to crafting static websitesUtilizing Nunjucks in the Browser Integrating Nunjucks into a browser-based app requires pre-compilation and path adjustments. Learn from my experience for a smooth development process. Visit the GitHub repository for the complete code.Making a Metalsmith Website Behave Like a Single-Page App Discover how to elevate your Metalsmith website with single-page app behavior using Swup. Enhance user engagement with smooth page transitions.A simple link web component A versatile web component I value: seamlessly blends text links, buttons, color schemes, and link types (external/internal) into a single, efficient component.What I Learned Building Web Components Web components are a blend of specifications, not a rigid framework. By seeking community wisdom I have learned a lot about the best practices and pitfalls of web components.Truncated APTitle - a Custom Web Component Explore TruncatedAPTitle, a custom web component handling attribute changes with MutationObserver. Learn how it truncates and title-cases text, all inside a span.Creating a Cloudinary Image Web Component In this blog post, we will build a custom web component called CloudinaryImage that allows us to lazy load images from Cloudinary.Exploring Web Components Unlock the true potential of web development with Web Components. Embrace reusability, efficiency, and elevate your projects to new heights!The Ever-Changing Landscape of Front-End JavaScript Frameworks and Build Tools In 2017, I started building static websites using Metalsmith. A client's request led me to switch to Gatsby, but the transition posed challenges. This made me reflect on framework fatigue in web development.Simplifying Responsive Font Sizing with a Clamp Calculator The blog discusses a widget, the 'Clamp Calculator', used for calculating CSS clamp functions for responsive font sizing, padding, and margins. The widget ensures fonts smoothly adjust with viewport width changes.