DEV Community: Gilles Vauvarin

The terminal rises from the ashes ...

Gilles Vauvarin — Wed, 12 Mar 2025 13:29:55 +0000

The computer terminal, long seen as a relic of the past, is enjoying a remarkable renaissance. Modernized interfaces bring significant improvements: intelligent auto-completion, customizable interface and seamless integration with cloud environments.

I'm going to introduce you to a few of these new tools. It won't make you leave Vim, but you'll probably want to try one or two of them out ;-) 👩‍💻

1. Hyper

Hyper is an Electron-based terminal built on HTML/CSS/JS and fully extensible. With Hyper, you can install themes and plugins from the command line. The goal of the project is to create a beautiful and extensible experience for command-line interface users, built on open web standards.

2. Rio

Rio Terminal focuses on being a fast and feature-rich terminal emulator with modern capabilities like true color support and image display, while also being cross-platform and customizable with features like splits and shaders. It has garnered positive feedback for its performance and user experience.

3. Warp

Warp aims to enhance the terminal experience by integrating AI, providing a modern and customizable interface, and enabling team collaboration and knowledge sharing through Warp Drive, all while prioritizing privacy and security.

4. Cogno

Cogno Terminal aims to provide a highly customizable, intelligent, and user-friendly terminal experience while prioritizing user privacy and control across various operating systems and shells.

5. Alacritty

Alacritty focuses on being a high-performance and configurable terminal emulator with useful features for users who spend significant time in the terminal, while also being available across various operating systems.

6. Wave

Wave Terminal is an open-source application that enhances the traditional terminal by integrating graphical capabilities.

7. Superfile

This one is not really a generic terminal but I find it interesting. Superfile is a pretty fancy and modern terminal file manager. It focuses on providing a visually appealing and fully functional terminal-based file management experience with a high degree of customization and the convenience of multi-panel views.

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,400 tools. 🚀

See you ... 🖖

Static Site Generators: Returning to a Simpler Web 🪷

Gilles Vauvarin — Wed, 12 Feb 2025 13:10:18 +0000

The web has evolved into increasingly complex platforms, with sites relying on databases, dynamic frameworks, and numerous scripts. However, for a simple content-based website, this approach is counterproductive.

Static site generators offer a simpler, faster, and more efficient alternative. Instead of dynamically loading content with each visit, these tools pre-generate static HTML pages. The result?

Increased performance – Static sites are ultra-fast since they don’t require database access or server-side code execution.

Enhanced security – Less reliance on databases and dynamic CMS platforms means fewer hacking risks.

Reduced maintenance – No need for constant plugin updates or security patches.

Simple and cost-effective hosting – A static site can be hosted for free on platforms like GitHub Pages, Netlify, or Vercel, eliminating the need for a complex server setup.

For a content-based website (blog, portfolio, documentation), returning to a simpler web with a static site generator allows you to focus on what really matters: content and user experience, without unnecessary technical constraints.

Why make things complicated when they can be simple?

The problem with static site generators is that they require a build phase, and the process is not always accessible to non-technical users. Therefore, I will suggest 6 solutions that simplify this process of generating static files, either through a CMS or a graphical interface

Disclaimer: the links below do not open directly onto the resources cited but on a summary with more details than here, so you don't have to read all the tool's documentation to understand what it is and what its main features are. If you're interested by the resource, there's a button to go directly to the relevant site. See "Visit this tool's website" blue button, top right on desktop view

1. Quiqr

Quirq is a blazingly fast Hugo CMS App to generate static site. If you want to publish your site with a ready made template or you want to create your Hugo website from scratch Quiqr has everything you need to get you started.

2. Primo

Primo is a visual CMS that makes it a blast to build pages, manage content, and edit code - one block at a time.

3. Publii

Publii is a new Static CMS with GUI to build an extremely safe, fast and stylish HTML website. It is a desktop-based CMS for Windows, Mac and Linux that makes creating static websites fast and hassle-free, even for beginners.

4. Stapy

Stapy is a Static Site Generator. It works with Python on any operating system without additional packages.

5. Lektor

Lektor is a flexible and powerful static content management system for building complex and beautiful websites out of flat files — for people who do not want to make a compromise between a CMS and a static blog engine.

6. Kirby & Staticache plugin

Kirby is a flatfile CMS writen in PHP and Staticache is a plugin for Kirby CMS. It gives you the performance of a static site generator for your regular Kirby CMS installations.

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,430 tools. 🚀

See you ... 🖖

Why hosting your own analytics solution has never been so essential? 🤔

Gilles Vauvarin — Wed, 05 Feb 2025 15:57:32 +0000

In a digital ecosystem dominated by tech giants, every visit to a website, every interaction, and every click are tracked, analyzed, and exploited for commercial purposes and increasingly for political reasons. Analytics solutions from major corporations like Google Analytics capture valuable data-not only about your visitors but also about your own activity.

Hosting your own analytics solution on your own server means regaining control over your data, your privacy and that of your users. It ensures complete confidentiality, prevents the resale of information to third parties, and allows you to fully manage your audience analysis without being subject to the arbitrary rules of multinational corporations. Open-source alternatives like the ones I'm going to suggest below provide precise statistics while respecting visitor privacy.

Choosing a self-hosted solution is not only about protecting your business and your users but also about supporting a freer, more ethical internet that is less reliant on digital monopolies.

Disclaimer: the links below do not open directly onto the resources cited but on a summary with more details than here, so you don't have to read all the tool's documentation to understand what it is and what its main features are. If you're interested by the resource, there's a button to go directly to the relevant site. See "Visit this tool's website" blue button, top right on desktop view

1. Plausible

Plausible is intuitive, lightweight and open source web analytics. No cookies and fully compliant with GDPR, CCPA and PECR.

2. Fathom Lite

Fathom Lite. Simple, privacy-focused website analytics. Built with Golang & Preact.

3. Ackee

Self-hosted, Node.js based analytics tool for those who care about privacy. Ackee runs on your own server, analyzes the traffic of your websites and provides useful statistics in a minimal interface.

4. Matomo

Google Analytics alternative that protects your data and your customers' privacy. Take back control with Matomo – a powerful web analytics platform that gives you 100% data ownership.

5. Vince

Vince is a self-hosted web analytics application that serves as a privacy-friendly alternative to Google Analytics. It helps users be compliant with GDPR, CCPA, and PECR, respect user privacy, eliminate cookie notices, and save money and engineering resources, while gaining actionable website insights

6. Umami

Umami is a simple, easy to use, self-hosted web analytics solution. The goal is to provide you with a friendlier, privacy-focused alternative to Google Analytics and a free, open-sourced alternative to paid solutions. Umami collects only the metrics you care about and everything fits on a single page..

7. GoAccess

GoAccess is an open source real-time web log analyzer and interactive viewer that runs in a terminal in *nix systems or through your browser. It provides fast and valuable HTTP statistics for system administrators that require a visual server report on the fly.

8. UWwizz

UXwizz is a self-hosted website analytics prioritizing user privacy and data control. Not open-source, but I think it's worth a look.

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,419 tools. 🚀

See you ... 🖖

Icons everywhere !!! 🤪

Gilles Vauvarin — Tue, 28 Jan 2025 15:55:57 +0000

Icons, those tiny visual symbols that fill our screens are more than just decorations. They’re the cornerstones of user interfaces, the shortcuts that turn complex actions into a simple click. Whether you’re a gamer, developer, or passionate tinkerer, icons are here to make your life easier.

Picture your desktop without the trash bin icon: how would you delete that 40GB file you regret downloading? Or your game launcher without the icons of your favorite titles finding Elden Ring in a text-only list? Unthinkable.

Icons are also a playground for customization. You can skin your OS with cyberpunk, retro, or minimalist packs. Well-chosen icon is a love letter to your setup.

In short, icons are like Easter eggs in a game: once you realize their importance, you can’t live without them.

If you're looking for icons, I've got a few resources for you:

Disclaimer: the links below do not open directly onto the resources cited but on a summary with more details than here, so you don't have to read all the tool's documentation to understand what it is and what its main features are. If you're interested by the resource, there's a button to go directly to the relevant site. See "Visit this tool's website" blue button, top right on desktop view

1. pqoqubbw

A beautifully crafted animated icons. An open-source (MIT License) collection of smooth animated icons for your projects. Feel free to use them, share your feedback, and let's make this library awesome together. Built with framer-motion and lucide.

2. IconBuddy

Download, Customize, Edit and Personalize. Over 180k+ open source icons. Choose from a variety of formats for icon downloads, including SVG, PNG, WEBP, JSX, VUE, BASE64, URLs, CSS snippets, and HTML image tags.

3. Remixicon

Open-source neutral-style system symbols elaborately crafted for designers and developers. All of the icons are free for both personal and commercial use.

4. SVG Repo

Explore, search and find the best fitting icons or vectors for your projects using wide variety vector library. Download free SVG Vectors for commercial use.

5. CSS Icons

Minimalistic icon library Designed by code. Customizable et Retina-Ready icons, entirely build in CSS.

6. IconSVG

Customize your svg icon (color, size, background ...) and use it in your website. SVG, JSX, React code available.

7. useAnimations

Animated icons in Lottie Framework and After Effects for immediate implementation to your apps or websites.

8. FontKiko

Font Kiko is a pack of more than 1500 Open Source icons, which are suitable for any purposes. Use font Kiko on your PC while preparing a web-project or developing an application for iOS or Android.

9. Unicons

1300+ Pixel-perfect vector icons and Iconfont for your next project.

10. Eva Icons

Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.

11. Feather icons

Simply beautiful open source icons designed by Cole Bemis.

12. Norde

Norde Source makes it easy to customize entire icon sets to fit your brand. Built for designers, developers, marketers and anyone who works with a lot of icons.

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,430 tools. 🚀

See you ... 🖖

7 little-known code editors that deserve your attention 🤖

Gilles Vauvarin — Tue, 21 Jan 2025 18:06:05 +0000

I love testing new code editors. In the course of my various tests, I've picked out 7 code editors that could be your next dev companion.

Disclaimer: the links below do not open directly onto the resources cited but on a summary with more details than here, so you don't have to read all the tool's documentation to understand what it is and what its main features are. If you're interested by the resource, there's a button to go directly to the relevant site. See "Visit this tool's website" blue button, top right on desktop view

1. Kate

Kate is a versatile text editor with features aimed at improving productivity and ease of use for both general text editing and software development.

2. Lapce

A modern open source code editor in Rust. Lightning-fast and Powerful. Quick from launch to every keystroke, and batteries included.

3. VSCodium

VSCodium is a fork of VSCode. This project’s sole aim is to provide you with ready to use binaries without Microsoft’s telemetry code. Hell yes, Microsoft is Microsoft! ;-)

4. Zed

Zed is a high-performance, multiplayer code editor from the creators of Atom and Tree-sitter. It's also open source. Mac, Windows, Linux.

5. Pulsar

Pulsar is a community-driven, open-source text editor known for its hackability. It's a specialized version of Chromium that's been designed for coding rather than browsing, offering a unique blend of web technology and native functionality.

6. Geany

Geany is a powerful, stable and lightweight programmer's text editor that provides tons of useful features without bogging down your workflow. It runs on Linux, Windows and macOS, is translated into over 40 languages, and has built-in support for more than 50 programming languages.

7. Lite-XL

A lightweight, simple, fast, feature-filled, and extremely extensible text editor written in C, and Lua, adapted from lite.

Personally, I'm partial to Cursor and Zed, which I'm using in parallel at the moment. And you, did any of them poke you in the eye? 😻

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,404 tools. 🚀

See you ... 🖖

Here are 7 Regex tools that can save your life from hell 🔥

Gilles Vauvarin — Tue, 14 Jan 2025 15:42:10 +0000

I don't know if you're like me, but whenever I'm faced with a regular expression aka Regex I break out in a cold sweat. I hate this synthaxis and I'm tearing my hair out to find the one that's right for me.

Fortunately, there are 😇 guardian angels on the web who have thought of us by offering us tools to assist us or teach us how to manipulate this demonic language.

Here are 7 Regex tools to help you get the hang of regular expressions.

Disclaimer: the links below do not open directly onto the resources cited but on a summary with more details than here, so you don't have to read all the tool's documentation to understand what it is and what its main features are. If you're interested by the resource, there's a button to go directly to the relevant site. See "Visit this tool's website" blue button, top right on desktop view

1. Regex Crossword

This is a funny way to learn Regex. With Regex Crossword, welcome to the fantastic world of nerdy regex fun! Start playing by selecting one of the puzzle challenges below. There are a wide range of difficulties from beginner to expert.

2. Regulex

JavaScript Regular Expression Visualizer.

3. RegexGPT

RegexGPT is a tool that lets people generate regex patterns by inputting an example of the text they would like to transform and another input for the expected result. There is also a natural language input that allows the user to explain the pattern they would like to match. The final input lets users select the programming language for the output.

4. Pomsky

A modern language that cross-compiles to regular expressions.

5. RegexAI

AI-Powered Regular Expression Solver. Insert your text and drag the cursor to highlight multiple strings to find matching regular expression. You can also click on the highlighted text to remove it.

6. Regex Learn

Learn Regex step by step, from zero to advanced. Learning Regex is easier than you think. You can use this tool to easily learn, practice, test and share Regex.

7. Super Expressive

Super Expressive is a JavaScript library that allows you to build regular expressions in almost natural language - with no extra dependencies, and a lightweight code footprint.

If you'd like to discover other tools for web workers, I invite you to visit my site The Whale, where I've already listed 1,398 tools. 🚀

See you ... 🖖

12 CSS resources you may not know about ... 🔎 🧐

Gilles Vauvarin — Tue, 07 Jan 2025 16:08:24 +0000

Hi web dev community 👋

One day, I told myself that instead of cluttering my browser with bookmarks I’d never revisit, it would be smarter and more useful to share them publicly on a website. That must have been back in 2016. Since then, I’ve been regularly adding all the tools that seem interesting to me, and here’s just a small selection:

1. BeerCSS

Build material design in record time without stress for devs.

2. HyperUI

HyperUI is a collection of free Tailwind CSS components that can be used in your next project. With a range of components, you can build your next marketing website, admin dashboard, eCommerce store and much more.

3. Pico CSS

Minimal CSS Framework for semantic HTML. Elegant styles for all natives HTML elements without .classes and dark mode automatically enabled.

4. SimpleCSS

Simple.css is a classless CSS framework that makes semantic HTML look good, really quickly. By classless it means that there are no CSS classes anywhere in the CSS or the HTML. So your website can look just like this using plain old vanilla HTML.

5. UnoCSS

The instant on-demand Atomic CSS engine. UnoCSS is an engine instead of a framework because there are no core utilities - all the functionalities are provided via presets or inline configurations. We are imagining UnoCSS being able to simulate the functionalities of most of the existing atomic CSS frameworks. And possibly have been used as the engine to create some new atomic CSS frameworks!

6. Chart.css

Charts.css is a modern CSS framework. It uses CSS utility classes to style HTML elements as charts.

7. Tailblocks

Ready-to-use Tailwind CSS blocks. 15 different categories (ecommerce, blog, pricing and more...), responsive, dark/light mode, color variations.

8. :nth Tester

Online and visually :nth css tester made by CSSTricks.

9. Matcha.css

matcha.css is a pure CSS library designed to style HTML elements similarly to a default browser stylesheet, eliminating the need for users to manually patch their documents.

10. css-selectors

Here's a visual guide to the most popular CSS selectors.

11. What is your reset/base css?

Ire Aderinokun presents in this article her solution to resetting some default browser styles, she also includes some utilities that she wants in every project.

12. Destyle.css

Destyle.css is a reset stylesheet that provides a clean slate for styling your html. Made with love by Nicolas Cusan.

For your information, I publish all my online monitoring on my website The Whale Already 🔥 1398 resources 🔥 curated.

🥳 Happy codding and happy new year 2025 ... 🎉 🚀 🛸