How the $ ^ do I learn web?

Question

More accurate to ask "How do I evaluate web tools"? Like frameworks aside, I want to build a webapp for production and write it all. Now I have to build it. Do I use webpack, esbuild, rollup, parcel, snowpack, vite? How tf am I supposed to compare these?!Sorry this is kinda vent-y but any recommendation on how to evaluate different stuff like this? I'm kinda new to web and have been frustrated by too much different tools in a way I never was on backend stuff. Thanks.

acemarke · Accepted Answer

As a first suggestion, you might want to read through my "How Web Apps Work" blog series, which covers many key web dev terms, concepts, and technologies:
https://blog.isquaredsoftware.com/series/how-web-apps-work
It doesn't go down to the level of individual frameworks and build tools, but it does help describe _why_ build tools like Webpack exist and what a typical JS dev workflow might look like.

ivank · Answer

If you can mentally process a lot of opinions like a Bayesian: Hacker News search with Algolia, e.g. with more than one framework in the query. Twitter search. Reddit search (via https://camas.github.io/reddit-search/).
GitHub issues to see what kind of problems people are having and whether they're really showstoppers. Are they things that can be fixed, or do they reveal more-serious design problems in the software?
Comparative code review in your IDE.
Comparative review of documentation.
GitHub search to find big projects that use those dependencies and seeing whether you like the results.

smt88 · Answer

Just pick a popular boilerplate, like create-react-app or framework like Next.js. Don't overthink it as this stage.I like SvelteKit with Typescript a lot, but there isn't as big of an ecosystem as React has.

cable2600 · Answer

https://knowyourmeme.com/memes/how-do-i-shot-webTry this: https://www.theodinproject.com/It is always better when you hand code it, I don't trust all in one code generators.

cercatrova · Answer

You shouldn't need to use any of those as a beginner.
Pick a boilerplate framework like create-react-app, Next.js, VueJS, etc which build everything for you so you don't need to manually build the project via writing Webpack or esbuild etc.
Create a product or project that you like from there. You can learn Webpack and other such tools when you need to.

ed-209 · Answer

I often like to start with nothing in situations like these and each time I encounter boredom or pain I apply the simplest remedy. Eventually the ad hoc remedies themselves can become a source of pain and I solve that too in the simplest way.

rudasn · Answer

Search for TodoMVC, or something like that, where a todo list Web app is created using different tools and methodologies. Read the source code for each, and dig deeper for those frameworks that actually make sense to you.

idealroad4029 · Answer

No easy way tbh. I look for frameworks that are widely supported and used aka boring.

How the $ ^ do I learn web?

Just pick a popular boilerplate, like create-react-app or framework like Next.js. Don't overthink it as this stage.
I like SvelteKit with Typescript a lot, but there isn't as big of an ecosystem as React has.

https://knowyourmeme.com/memes/how-do-i-shot-web
Try this: https://www.theodinproject.com/
It is always better when you hand code it, I don't trust all in one code generators.

I often like to start with nothing in situations like these and each time I encounter boredom or pain I apply the simplest remedy. Eventually the ad hoc remedies themselves can become a source of pain and I solve that too in the simplest way.

Search for TodoMVC, or something like that, where a todo list Web app is created using different tools and methodologies. Read the source code for each, and dig deeper for those frameworks that actually make sense to you.

No easy way tbh. I look for frameworks that are widely supported and used aka boring.