DEV Community

Cover image for Refactor Like a Superhero: New Web UI for the Book
Alex Bespoyasov
Alex Bespoyasov

Posted on • Edited on • Originally published at bespoyasov.me

Refactor Like a Superhero: New Web UI for the Book

TL;DR: Today I launch a web site for my book “Refactor Like a Superhero”! 🎉🥳

For more details, welcome below :–)

Look and Feel

The goal of this UI is to make it more comfortable to read, navigate, and search the book contents:

Main page of the book

Each chapter has quick access to its sections and other chapters:

The page with the “Functional Pipeline” chapter

Accents side notes, factoids, quotes, and code samples are now highlighted and easier to find:

Couple of side notes and a code sample

Bigger code sample

And, of course, it has the dark theme!

The chapter about “Functional Pipeline” in dark theme

Code sample in dark theme

Technologies

The site is built using SvelteKit and deployed on Vercel. In the future, I plan to write more about these technologies and compare Svelte with React.

For me, it seems like Svelte is a serious competitor to other frontend frameworks, at least in the field of statically generated sites. I want to share my experience and some thoughts on this topic.

Reasons

Originally, I published the book on GitHub.

It felt okay at first, but GitHub's .md parser aggressively trims styling and semantics of many elements. I decided to fix that and publish the book with correct semantics and better (subjectively! 😄) styles.

The book is still available on GitHub in case you want to read it there, leave feedback about the content, or fix a typo in the text.

Top comments (0)