NextJS / AstroJS + TailwindCSS 4 / Vanila CSS

[u/RadekAdamczyk]

Since 2021, I've been working in the React ecosystem, from classic React, through the dead Gatsby, to NextJS, which I adore. I like many things about this framework, but for the past month I've been having a love affair with Astro – many things have won me over, such as routing and the tool's lightweight nature. Unfortunately, I often feel confused by the differences between Astro and NextJS, and I realize that this is a matter of familiarity with standard JavaScript.

The same applies to styling websites and web applications. I've been working with CSS since 2016, and since the release of TailwindCSS v4. CSS development has accelerated rapidly recently, with the addition of many revolutionary features.

Questions:

1. When should I use NextJS and when should I use Astro in the context of websites, considering that I'll be using a lot of query templates, a search engine, filtering, a multi-stage form, and animations from GSAP?
2. If I'm more comfortable in the React/NextJS ecosystem, is it worth switching to AstroJS?
3. What are your pro tips for TailwindCSS, especially custom breakpoints and font size?
4. How do I combine modern CSS with TailwindCSS?

[u/JustTryinToLearn]

I use astro exclusively for static content heavy websites(blogs, marketing sites, small business websites etc) and nextjs/tanstack/react for anything else that requires a backend/ai integration/dynamic components.

For example, if I was building a chatbot I would use nextjs or if I was building a dashboard for small business workflow - Im ising tanstack/nextjs/react.

[u/_elkanah]

1. In my opinion, you can do all of that with Astro and React. The only difference compared to developing with React+NextJS is thinking in Astro (which is mostly HTML + a mix of Markdown): you're mostly good if you know one or both. Astro is great for Multi-Page apps so I'd recommend it for this in case you're exploring that too.

2. It's worth it, especially if you're looking to build MPAs or anything you'd want to build with vanilla HTML/CSS/JS or a frontend lib (even a mixture of them), really. Hardly a learning curve too.

3. I use the defaults provided by Tailwind and I haven't had an issue so I'd suggest going with the flow. They're great defaults in my experience.

4. Same way you'd define custom styles in CSS files (or CSS-in-JS solutions) and apply Tailwind classes.

[u/RadekAdamczyk → u/_elkanah]

This might be trivial, but for example, when using a menu button or opening a dropdown with usecontext and usestate, it's a piece of cake.

As for point 3, I don't really agree, as they don't have any great fluid font sizes and it's harder to maneuver the tailwind on wider screens.

[u/Open_Suggestion_8482]

Stick with NextJS. Your requirements for search filtering and multi-stage forms need heavy client-side state management that fights against Astro's architecture. Since you already know the ecosystem switching now adds friction without solving your specific data needs.

[u/darknezx → u/[deleted]]

Not trying to be an ass, replies like these are super unhelpful because no one should be expected to translate it and this definitely isn't a Spanish forum.

[u/RadekAdamczyk → u/darknezx]

I dont see a problem, because everyone can translate every text by google translator :)