As someone that enjoys embedded and hacking things I've always leaned more towards Python and C++, so naturally when I needed to build a webapp I chose Django.
Though as our app progressed and we needed more control over our front-end, templates stopped serving us and suddenly we saw the value in React + DRF.
Now this is fine and we see no need to switch, but my curiosity was piqued after doing a two startup accelerators and noting that most companies in both batches were using NextJS and TailwindCSS.
Now, I'm familiar and have built things with javascript, though I certainly don't prefer it -- but when something becomes as ubiquitous as these tools I figure it's worth exploring.
After building an internal tool to convert youtube videos into quote cards and reels at the click of a button, I've realized why.
NextJS
NextJS essentially lets you harness the flexibility of React with the speed/simplicity of server-side rendering while still retaining the fluidity of single-page applications.
Previously, single-page applications typically suffered from slow start times as the entire javascript app was loaded into the user's browser. While this was often made up for with the speed of having everything already loaded on the client, it still depended on the user's hardware to run and didn't play nice with SEO.
NextJS fixes all this, letting you essentially build an SPA application, but getting the speed and SEO benefits of server-side rendering -- with NextJS magically handling it all for you.
So not only do you get a flexible application, it suddenly loads and updates faster too.
Which is all well and good, but for me, the main obstacle to using React was having to make API calls. Fussing about with fetch and axios is something I've always found messy compared to Django templates with context already passed in.
However, despite basically reinventing index.php, NextJS Server Actions have largely solved this problem, and now you get the simplicity of calling a back-end function while enjoying the composability of React components + static-site generation and server-side rendering.
TailwindCSS
Which brings me to Tailwind.
Tailwind addresses the worst part of CSS: the sheer flexibility of it yields too many choices.
Tailwind fixes this by reducing your choices into a smaller subset that:
- looks good
- covers all bases
- and is composable
Good designers have likely been creating such subsets to compose with for years, but now the rest of us have that first step completed for us.
Not to mention, having the ability to style directly from a component itself (as opposed to needing to find the CSS file) does wonders for staying in a coding flow.
And with the prevalence of component-based architectures, having HTML elements with a large number of classes is less of a hurdle in 2024.
Combine this with a component library like DaisyUI and suddenly you're building attractive UIs at light-speed while still retaining the ability to customize.
Conclusion
After years of holding out on Javascript, I think I can finally include it in my default stack. While we'll continue using Django for Dopplio, the next project I build will likely use the following:
- Frontend: NextJS deployed on Vercel
- Backend: Django Rest Framework, FastAPI, or mere NextJS Server Actions (depending on needs in order of most intense to least intense)
- Auth: auth0 or Supabase
- ORM: Django ORM or Prisma
- DB: Supabase
- Styling: TailwindCSS + DaisyUI
If you’re interested in more dissections like this you can follow me on Twitter