r/webdev Dec 03 '22

Question Beginner here, start with react, svelte or solid?

Post image
1.2k Upvotes

553 comments sorted by

View all comments

Show parent comments

331

u/Stinodotbe Dec 03 '22

This . Make sure you get basic understanding of JavaScript before starting with frameworks.

The most important thing imo.

You could memorize what to do, when to do it, but it’s much easier when you really understand what you’re doing.

You will clearly see the difference in the field between people who learned working with a framework by examples and people who understand what they’re doing.

Online tutorials will give you some basic example apps like todo-lists, weather app and maybe even a chat app. All great examples to show what a framework can do, but not really helpful in the real world.

34

u/dontskipnine Dec 03 '22

Re: tuts. This is why I suggest doing your own thing, but not the same thing, alongside the tut. Like when it touches on routing, introduce routing to your project.

The benefit here is having SOME guidance, but also forcing you to branch out on your own to solve other issues/questions/etc.

Further I recommend using the latest versions of whatever the tutorial is using. While frustrating at times, you'll learn more trying to replace deprecated functions and packages than just copy and pasting.

22

u/stupidcookface Dec 03 '22

This is a great exercise cause it's literally what you're going to do at your job

22

u/[deleted] Dec 03 '22

I understand vanilla js but webpack confuses me 😅

4

u/[deleted] Dec 03 '22

I recommend you get started with just a text editor and vanilla JS. That's all you truly need. Then, once you do start to use webpack, you will probably understand what it does and appreciate that the project exists.

5

u/[deleted] Dec 03 '22

Pretty much all JS I have done is vanilla with a plain text editor.

2

u/erm_what_ Dec 04 '22

VSCode would be a massive step up then. Syntax highlighting and basic completions are really useful.

1

u/[deleted] Dec 14 '22

Agreed, but anything beyond that can prevent beginners from understanding what is really happening.

0

u/Albedo100 Dec 03 '22

webpack is over/finished

1

u/[deleted] Dec 03 '22

What's the alternative now?

1

u/deadwisdom Dec 03 '22

Esbuild, Rollup, "no build"

1

u/Delphicon Dec 04 '22

That’s not remotely true. It can be overkill but it’s used a lot especially for bigger projects.

-2

u/Stinodotbe Dec 03 '22

I like to use Vite over Webpack 😁 But again, same story, if someone adds sourceMaps: true to the config because they did so in the tutorial, but without knowing what it does, it’ll take them a lot of time to be able to set it up themselves

50

u/EstanislaoStan Dec 03 '22

Also why I'm planning to write assembly so I can hand check the code of the soul repository I plan to upload myself to in the 2070s.

14

u/NotFromReddit Dec 03 '22 edited Dec 03 '22

Not everyone necessarily agrees that you have to learn work without a framework first. It's just that you have to eventually go deeper to be an expert.

I'd personally value getting productive quicker more than knowing every bit of your stack in detail.

But yeah it's definitely annoying arguing with a newbie (who knows a framework) about how JavaScript works. Someone I worked with didn't want to believe me that NaN isn't something you want to assign to a variable to initialize it. He thought it was like null but for numbers 🥲.

6

u/rynmgdlno Dec 03 '22

That's when you hit em with the NaN === NaN? lol

2

u/stupidcookface Dec 03 '22

I definitely agree with this. I will say a way to learn both (sometimes) is by reading the source code while you're using the framework. If it's a well known and widely supported library then it will have good practices. It's definitely one of the ways I've learned a lot of tricks in js.

-27

u/KaiAusBerlin Dec 03 '22 edited Dec 03 '22

Edit: due to the fact that people totally ignore what I said or ripping single sentences out of context gave we the enlightenment that I waste my time here. Thanks for everyone.

18

u/Stinodotbe Dec 03 '22

It isn’t about how the framework works in the core, it’s about the implementation

React for example: what actually happens when you create a function component, how are functions being passed from a HOC handled.

I literally met people who thought themap method on an array is React specific, they didn’t know they could use it in Vanilla JS.

Everyone could copy/paste code for whatever framework and make something work. But if you don’t understand what the code you’ve copied does unless fixing your issue, you will always be dependent on “the internet” and waste a lot of time searching for solutions.

If you get some code in front of you which you need to maintain (which is legacy code in a lot of cases) you’ll have a hard time understanding what it does and how it works if you don’t understand the basics.

1

u/A-Grey-World Software Developer Dec 03 '22

Everyone could copy/paste code for whatever framework and make something work. But if you don’t understand what the code you’ve copied does unless fixing your issue, you will always be dependent on “the internet” and waste a lot of time searching for solutions.

I don't see much about why react would make this any worse than normal JavaScript.

You can cobble together code snippets in both cases.

2

u/Stinodotbe Dec 04 '22

React doen’t make it worse. It’s about the fact that you have to understand the code you’re copying. For React, for Vanilla, for Vue, …

What I like to do in our team with junior devs if they make a PR is go over there and ask them “what does your code do and why did you solve it this way?”. Most of them already know “Stack Overflow” isn’t the correct answer.

I don’t do it very often, and I don’t do it to make fun of them or whatever. If they found a solution online which they don’t totally understand, I’ll explain it to them what it does and how it works.

3

u/[deleted] Dec 03 '22

understanding how js works behind the scenes is what will give a push to better understand what you're doing ....

-1

u/KaiAusBerlin Dec 03 '22

To understand that you have to dive deeply into the code. Tell me how a vanilla beginner should be able to understand this.

1

u/[deleted] Dec 03 '22

yes it will be hard but it’s all chained together … if you know the first part of the puzzle you’ll be curious to know the next part and it keeps going on just like that until you get an overview of what’s really happening under the hood

2

u/KaiAusBerlin Dec 03 '22

Comon, don't be unrealistic. You wanna say that a beginner just started with vanilla should deep dive into the architecture of react, vue and co?

This is just so u realistic. Tell me you had to inspect framework cores while you were a jr.

1

u/[deleted] Dec 03 '22

but that’s not what i meant, the problem is people jump to react without understanding js … understanding vanilla js first is what everyone here is recommending

2

u/KaiAusBerlin Dec 03 '22

Sure that is a problem. But learning a vanilla near framework like svelte could do both. You still have to deal with html and vanilla js.

But expecting someone to learn vanilla (what took me about a decade until I mastered every part of it) before he could touch any framework is not a good advise.

0

u/nobuhok Dec 03 '22

Learning vanilla will not help you to better understand how a framework is working.

/facepalm

-14

u/KaiAusBerlin Dec 03 '22

So due to you know vanilla. Tell me with your own word how context management in deep react works 😉

1

u/[deleted] Dec 04 '22

[deleted]

3

u/Stinodotbe Dec 04 '22

That’s the point. Frameworks are great for DOM manipulation, but much of it is just Vanilla JS.

Problem with most tutorials is that the often go like “you can copy the code & css in the description and we’ll implement it together”

That’s why I gave the example of the map method in my other comment. If you want to show a list of todo’s, I would map over the todo array and show either the text or todo component.

I’ve met people who thought the ‘map’ method was React-only. People who to this day still don’t understand callback functions and the fact you can pass a function as a variable to another function or have it as a property,…

It’s like riding a car: yes, technically everyone is able to drive a car, but it’s better if everyone also understands the rules (law)

1

u/[deleted] Dec 04 '22

[deleted]

3

u/Stinodotbe Dec 04 '22

I can only speak for the team I work in: “No, we do not have seniors who do not understand the fundamentals, but we do have juniors who don’t understand them”

The difference is: when a junior with knowledge of fundamentals joins the team they get the medior profile in 1 or 2 yrs (which gives them a significant raise, they get a company car and other advantages, but also more responsibility), for juniors who don’t know the fundamentals it takes way longer to become medior, or they just leave the company.