What's the best framework for Web Apps vs Static Pages
so I'm working towards making real fullstack web apps as projects, I'm learning React for that, but I feel like React would be overkill for static websites, when I make those, should I still use React, go for no framework, or try learning Vue/Svelte? I'ma learn React since it's dominant in the market, but if I were to freelance in a couple years, what would be the framework you'd recommend me to learn and use?
16 Replies
If React is overkill, Vue and Svelte would be too. I'm not sure which meaning of "static" you are using. If it's static in the sense that content is not dependent on data coming from an external source, React isn't necessarily overkill. If it's static in the sense that there is no Javascript driven changes in the DOM, then React is overkill. For that, I would recommend Astro or Eleventy. Many developers use React solely for the purpose of having reusable code because HTML doesn't have import. Static site generators like Astro and Eleventy allow you to have reusable components that render to plain HTML without any JS, unless you explicitly indicate that you want JS in the output.
right well for my needs then React wouldn't be overkill
but it kind of defeats the point to make React components, when you could use libraries like jQuery to reuse specific components or javascript animations imo
in that case, would that be a valid React component for creating buttons?
I don't really like the color and fontsize parameters tho, I'd much rather use sass for anything involving the button's style
but ig for the on click handling, this should work?
jquery ded.
And one of the "points" of react is reusable components...
sure, that's a valid button component, break it out into a separate file and import export.
Please also give it a descriptive name.
and by all means, you can style components seperately with 1 or more css files, scss, whatever.
Your site is still responding to user input with JS, so React is fine to use. It's only overkill if the site just provides information and the only possible user interaction is clicking on a link.
I just looked at the code more carefully and it looks like you are using buttons to do the job of anchor tags. That is overkill. This could be HTML/CSS without any JS. If you want links to look like buttons, you can style them with CSS to look that way.
I mean, you're saying that if I want a button's sole purpose to be an href link, then I whould just do it with html?
Yes. Use an anchor tag. That is their purpose.
Yepp
Idk why The Odin Project made me do this
But ig it's good to know
Is there any reason for me to keep building vanilla javascript websites or should I go full-on React
Weird exercises are sometimes given to students because the instructor couldn't think of any better way to practice a specific technique.
It's better to understand how you need to render content and how it is to be shared, lots of options these days. But personally I prefer Svelte Kit (or one the meta frameworks for your pref UI like Remix ( react router). Thing is it's def not overkill and you can mix and match SSR, SSG, CSR if you want
The only part of vanilla JS that React really replaces is DOM manipulation. You still need to learn other aspects of JS to use React properly. I'm not sure what "full-on React" really means. You can start practicing React more, but don't abandon learning JS.
Thing I love is you can create fast static websites with client side routing, but if JS fails it all just works (with most meta frameworks now)
And with SSR in the same framework you get even more benefits like progressive enhancement for forms
It's pretty much cuz I know decently well javascript but there's always weird syntax and usages of js I haven't done that they recommend knowing and idk if React will just erase that need or not
React only replaces DOM manipulation. It does not erase the need to know or understand any other aspect of the Javascript language or the major JS APIs.
Bet
let's assume I wanna build a list component, is it more common for React users to just go found the component online and drag and drop it on their own code and adapt it?