Why I Chose Django + HTMX + React for cThink

As I’ve been building cThink, my multisensory learning platform for technical education, I’ve faced a foundational decision: what frontend stack should power the user experience?

Like many developers, I initially assumed I’d default to a full React frontend. But the deeper I got into the product’s needs, the more it became clear that a hybrid architecture — Django on the backend, HTMX for most interactions, and React only where it makes sense — was the right choice.

Let me explain why.

The Stack I Landed On

• Backend: Django + Django REST Framework

• Frontend: HTMX for most UI interactions (forms, buttons, partial page updates)

• Frontend: React for advanced interactive components (code editor, visual builder, etc.)

This gives me the best of both worlds: the speed and simplicity of server-rendered HTML, combined with the power of client-side reactivity when needed.

HTMX + React: The Best of Both Worlds:

Here’s a breakdown of when I’m using HTMX vs React on the frontend:

By default, HTMX drives the UI, keeping things fast, lightweight, and simple. But in places where interactivity demands more — like a visual logic builder, embedded code execution, or onboarding flows — I mount a small React component into the page.

Why I Didn’t Go Full React

1. Speed of development – HTMX lets me ship fast, without getting bogged down in state management or boilerplate.

2. Less frontend overhead – No bundlers or complex build chains unless I truly need them.

3. Better server integration – HTMX makes Django’s built-in class-based views and templates shine.

4. SEO & performance – Server-rendered HTML helps with crawlability and speed, especially important for public-facing learning content.

5. Control – React gives me interactivity where necessary, but not at the cost of complexity everywhere else.

When React Does Make Sense

There are places in cThink where React is absolutely the better fit. For example:

• A collaborative whiteboard
• An interactive drawing canvas for the D.A.B. (Draw–Act–Build) model
• A live chat system or embedded video session

These aren’t things I want to try hacking together with hx-get. For these, React gives me the control and dynamism I need — and I can load it only where required.

A Progressive Architecture

Rather than choose between simplicity and power, this hybrid approach lets me:

• Keep 90% of my code in familiar Django views and templates
• Use HTMX to handle the bulk of the user interface, AJAX-style
• Introduce React only where it adds value

The result is a fast, modern, scalable platform that’s still easy to reason about — and friendly to new contributors or students who may not be full-stack React experts.

Final Thoughts

Going hybrid isn’t a compromise — it’s an optimization. By combining Django + HTMX + React, I’ve built a stack that matches the complexity of the product, rather than over-engineering for the sake of trends.

If you’re building a learning tool, internal system, or SaaS platform where most interactions are standard forms, filtering, or CRUD — give this stack a serious look. You might be surprised how far HTMX can take you.

You can find me here 👉 https://heriberto.codes