Preprocessor I've been working 4 years now
Hey there, I'm here today to share with you a software I've been working on for 4 years now. I'm not full time dedicated to it, as I need to make a living. My inspiration to develop it came when I started using Sass for real in production. I really appreciated the hierarchy of nesting rules instead of the way CSS vanilla used to do. The obvious nesting rules was easy to read and understand just by looking at. That was something I personally admirated very much. I wondered why there was no HTML preprocessors as revolutionary as there is for CSS and JavaScript. All popular preprocessors for…
In plain words
Preprocessor is an HTML preprocessor that maintains angle bracket syntax while adding nesting capabilities inspired by CSS preprocessors like Sass. Developed over four years as a side project, it addresses the developer experience gap by preserving familiar HTML markup symbols while introducing hierarchical nesting rules for improved readability and structure. It targets web developers seeking a more intuitive approach to HTML preprocessing without abandoning standard syntax conventions.
written from the facts on this page · September 2026
From the sources
In the maker’s words, at launch
Hey there, I'm here today to share with you a software I've been working on for 4 years now. I'm not full time dedicated to it, as I need to make a living. My inspiration to develop it came when I started using Sass for real in production. I really appreciated the hierarchy of nesting rules instead of the way CSS vanilla used to do. The obvious nesting rules was easy to read and understand just by looking at. That was something I personally admirated very much. I wondered why there was no HTML preprocessors as revolutionary as there is for CSS and JavaScript. All popular preprocessors for HTML have one thing in common. All replace the angle brackets by something else (usually identation) and then add some functionalities on top of it. If the symbols for markups are a problem to the experience of developing a visual structure, just replacing it for something else doesn't fix the problem. You are just changing the character of marcation for another. With that in mind, I started Pretty Markup. Not just replacing the clutter of angle brackets by something else, but removing it completely. Very much inspired by Sass. No special characters needed, except by the quotes. The project still in its early stage, but its already useable. I reached a point where it has a stable base to work. Now, I'm plannig the layer of features that will make it usefull and revolutionary as Sass and TypeScript. Its important to note that I didn't started directly in Pretty Markup. I had a previous package called htmlpp-com-github-mopires. Yes, terrible name, but it was a start. Later a decided to make it more professional and with a friendly name. You can give it a shot by having NodeJS and installing it with: npm install pretty-markup I created a syntax hightlighter for VS Code to attract more devs to it. You can use it by searching "pretty markup" on the extensions tab. Now, it's the first one. The next step will be a package to create a basic starter project. Something like the good old create-react-app. Any feedback, suggestion or even a contribution about anything is very welcome. Thank you very much for your attention, Matheus PS: The package available in runkit is very old(and I don't know how to update it there), I do not recommend you to test there.
More life & fun this month
the category →- TL
Life & fun · 10d ago · louisabraham.github.io
Photosynthesis fires two of your iPhone
Life & fun · 28d ago · photosynthesis.camera
SoloUno▲310Take control of hair pulling, nail biting & skin picking
Life & fun · 28d ago · solouno.io
Scroll through all 43,252,003,274,489,856,000 reachable Rubik's Cube permutations.
Life & fun · 26d ago · everycube.alen.is
Hi HN, I built Eigendrum, a web tool that solves the 2D wave equation for arbitrary shapes so you can hear what they sound like as drums. How it works: * Solves -∇²u = λu using finite element analysis (Kφ = λMφ) on a triangle mesh. * Validated to <0.1% error against closed-form solutions for circles (Bessel zeros) and rectangles. * Sound model factors in strike location, Rayleigh damping, and mallet width. * Includes Kac drums I & II to demonstrate identical sound spectra from different geometries. * No frameworks, build steps, or dependencies. Repo and tests:…
Life & fun · 26d ago · baselashraf81.github.io
Launched alongside, July 2024
the whole month →
- IC
Many years ago, I made VJ softwares (to mix live visuals in clubs) for unexpected platforms like the Game Boy Advance, the Playstation 2 and the Raspberry Pi. This year, I’m back with a new web-app: Pikimov. Inspired by Photopea (a free Photoshop clone), I created this web-based motion design & video editor as an alternative to After Effects, to fill empty void. It's free, without signup, without cloud uploads (your files stay on your machine), and your projects are not used for AI models training.
AI · 2024 · pikimov.com
