r/learnjavascript • u/sweetcocobaby • Aug 17 '23
Javascript finally clicked for me.
For the longest, I didn’t believe people when they said that one day Javascript will make sense to me. I didn’t understand what they meant. I figured it would never stick conceptually. Yes, Javascript IS hard, but yesterday I was reading over Jon Duckett Javascript & JQuery and the abstract beginner concepts just clicked. It was at that point everything from then on made sense. 🥹 I guess they were right.
6
u/tnnrk Aug 18 '23
I don’t see how an entire language can just “click”. You mean some aspect of the language? There’s much more confusing and advanced aspects of JavaScript that are far from beginner concpets
15
Aug 18 '23
It clicks, like learning German, or French or Spanish. And then your understanding of it all becomes way easier. So yeah, the entire language .
1
u/sweetcocobaby Aug 29 '23
I didn’t say the entire language clicked. Let me clarify, the big ideas one must know to learn Javascript clicked. Thus, I am able to learn the more difficult parts.
5
u/ogreUnwanted Aug 18 '23
When I started with js, I was self taught using resources like codecademy. No matter how much I did it never clicked, took a boot camp, and the way the teacher phrased it, it clicked. Things made sense. The flow of it made sense. How you grab elements from the dom makes sense. You just understand why the cops are turning. Just need to learn how each cog is turning.
2
u/xyzAction Aug 18 '23
I agrée, there are so many levels to it. Like, a few months ago, I was trying to learn redux but I couldn’t understand it. But while I was building a react app, I needed to send state data from a child to a parent … I tried a few things, and realized the headache, at that point I realized what redux was for. I went back to the lessons and everything made so much sense.
2
u/OldAssDreamer Aug 18 '23
You have to remember that a lot of people who start out with coding may have never coded before and even the simple concepts seem foreign. I can't speak for OP, but I remember back when I started self learning BASIC, for loops didn't make a whole lot of sense and it wasn't until I got into C and an instructor made me trace the code that it all of a sudden clicked.
0
Aug 18 '23
Yea I'm not really sure what they mean by "it just clicks". It's like saying integrals "just clicked". Maybe there's a core language feature they understand now? I dunno, seems weird
5
u/Count_Giggles Aug 18 '23
Try calling it "Epiphany" or "Aha moment".
Gestalt theory also comes to mind (the whole of anything is greater than its parts).
I would assume op has accumulated a certain amount of knowledge and now has a solid understanding. Could also mean that they have moved to the "slope of enlightenment" on the Dunning-Kruger Effect Curve
On the other hand. Oh boy is there more to learn and be frustrated with ^__^
5
8
4
u/Jjabrahams567 Aug 18 '23
JavaScript has been a series of epiphanies for me. Each time I unlock one it is like getting a new super power.
First the basics, then the DOM, then the CSSOM, then in no particular order, async/promises, http/fetch, CORS, routing, streaming, generators. There are more and it never really ends. Just recently streaming with web sockets clicked with me and is giving me all kinds of ideas.
1
6
u/jayerp Aug 18 '23
Yes, that’s nice and all, but did it…
….onClick for you?
😎
3
u/Disturbedm Aug 18 '23
document.getElementById("jayerp").addEventListener ("click", function() { console.log("still hasn't clicked for me to be honest") }
3
3
u/dani_o25 Aug 18 '23 edited Aug 18 '23
This is pretty much all programming is. Stick with it long enough and most things will just “click.” That is why this field requires so much persistency. When I started learning react, I didn’t know what useState and useEffect were until after I landed my first job. When the company I work for started requiring that we start writing test for our code, I had the worst time ever, but I road it out and eventually it clicked. Same thing happened when I started learning the backed, Node/express.
2
2
2
u/No_Call_6462 Aug 19 '23
Hit hard huh? I loved that when happened to me and I thank God for it everyday, because JS is so fucking amazing and abstract.
2
Aug 20 '23
I explore that idea somewhat in an article I have just written about habits and coding!
https://thecodingapprentice.substack.com/p/atomic-habits-and-learning-to-code
I hope you enjoy!
1
u/Unisaur64 Aug 18 '23
Which parts were not previously clicking for you? Was it some unique aspects of JS, or just general programming principles?
1
u/mirodk45 Aug 18 '23
Yeah not trying to downplay OP but there's nothing really of substance... it's like saying "i didn't understand math but after I studied a book on math, I understood math"
1
u/Mr-Appleseed Aug 18 '23
I needed to read this. Currently struggling though JS and it all seems so alien haha
1
u/GavrielBA Aug 18 '23
To me, it clicked as soon as I realised it's a scripting language designed for visual artists
1
u/abestract Aug 18 '23
I have this book. Which section specifically are you referring to…got a page number?
1
1
71
Aug 17 '23
[removed] — view removed comment
1
5
u/xyzAction Aug 18 '23
Yeah but it’s still a relevant library. There are so many libraries out there no one “needs” anything per se… I’ve been coding for a year now and fell in love with it once I discovered what it can do. Like if I’m making a small site, why should I use react or svelte?? Jquery will get the job done.
4
u/MonsterMeggu Aug 18 '23
What do you want in jQuery that can't easily be achieved with vanilla JavaScript?
2
u/xyzAction Aug 18 '23
It’s more about the trove of component libraries and templates that exist. Why throw them away? I recently created an amazing site in a few hours… All I’m saying is that it’s useful. No need to paint it as useless.
2
u/MonsterMeggu Aug 18 '23
Never said it was useless. I'm just wondering because it seems like a lot of the jQuery functionality is built into vanilla js these days. I haven't worked on my own projects for quite some time and I only ever see jQuery when supporting legacy apps
1
u/averajoe77 Aug 18 '23
while vanilla js does have a simpler api today than when jquery was invented, the concept of jquery has always been to "do more, write less", and that concept still holds true today.
most of the vanilla js apis take more lines of code to write in order to achieve the same results (please don't link me to youmightnotneedjquery - I am not referring to those basic examples )
on top of that, building complex components in vanilla js takes lots of time and testing, and even more time and testing with a framework, adding an already tested jquery plugin that works in a matter of seconds is way more efficient.
do js frameworks have their place, yes. should they be the default for every small project out there that does not need dynamic data driven interactivity and robust animations or transitions? to quote my neighbor Wilson, I don't think so Tim.
0
u/UnluckyCrafter Aug 18 '23
Yes, but it makes a lot of things more easy and faster to write considering a lot of functionality is built into single functions, so simple that its hard to mess up things it has built-in. It can also your code cleaner, for example the "get" function in jquery makes it so you don't have to a write a fetch statement that is extremely big and messy without even writing the actual part that decideds what to do with the data.
Don't quote me on that its just my perspective.
2
u/prid13 Aug 28 '23
jQuery is much simpler to use and thus more beginner-friendly. Too much syntax and work can be daunting for someone just wanting to accomplish a basic thing, so jQuery is more appealing in that aspect even if it's not needed anymore :)
Registering click event:
Javascript:
document.querySelector('.element').addEventListener('click', (evt) => { ... });jQuery:
$('.element').on('click', (evt) => { ... });Showing / Hiding an element:
Javascript:
document.querySelector('.element').style.display = "none"; // "block"jQuery:
$('.element').show(); // .hide()Bonus (jQuery animated show/hide on click):
$('#button').on('click', function(evt){ $('element').animate( { opacity: 'toggle' } ) });Creating and appending element:
Javascript:
var el = document.createElement('p'); document.querySelector('#main').append(el);jQuery:
$('#main').append( $('<p></p>') );Adding CSS to element:
Javascript:
var el = document.querySelector('.element'); el.style.color = "black"; el.style.backgroundColor = "purple";jQuery:
$('element').css('color', 'black').css('backgroundColor', 'purple');Now, combining everything:
Clicking on a button will add a new element with text, and the button will become invisible.
Setup:
<body> <div id="button">Click me</div> <div class="element"></div> </body>Javascript:
var el = document.querySelector('.element'); var btn = document.querySelector('#button'); btn.addEventListener('click', function(evt){ var newElement = document.createElement('div'); newElement.style.color = 'white'; newElement.style.backgroundColor = 'blue'; el.append(newElement); btn.style.display = "none"; });jQuery:
$('#button').on('click', function(evt){ var newElement = $('<div></div>').css('color', 'white').css('backgroundColor', 'blue'); $('.element').append( newElement ); $('#button').hide(); });Now, can these be easily replicated in pure Javascript or with a simpler library? 100%, no doubt. And are some of these bad practices (animating in Javascript)? Of course. But for someone new to any language, the simpler and more swiss army knives you can give them to quickly whip up results, the better, faster and more fun it will be to learn :)
2
u/Anonymity6584 Aug 18 '23
Yes, but you run into it surprisingly often in existing projects of some random library needing it as depency.
1
u/Mikedesignstudio Aug 18 '23
Bad advice
“jQuery is used by 94.6% of all the websites whose JavaScript library we know. This is 77.7% of all websites.”
Source: https://w3techs.com/technologies/details/js-jquery
You guys have to start doing your own research instead of repeating bs you read on Reddit.
12
u/noXi0uz Aug 18 '23
Would be more interesting to know how many teams use it to build new webapps that are not wordpress. Just because jQuery is still loaded in most existing websites doesn't mean that you will ever touch it at your job. Many websites even fetch it without using it at all.
3
u/enserioamigo Aug 18 '23
This. Our boilerplate has traces of jQuery in it. It’s just not worth our time to convert it at the moment. Doesn’t mean we’re writing anything new with it.
2
u/Mikedesignstudio Aug 19 '23
Websites not web apps. Of course you wouldn’t use jQuery to build a web app.
1
u/MonsterMeggu Aug 18 '23
Yeap some css frameworks also use jQuery (bootstrap does or at least used to)
4
u/xyzAction Aug 18 '23
Jquery is great for small websites, you don’t always need an extravagant framework to build a site for a musician etc … So yeah Jquery is very good, gotta know when to use a pistol or a shotgun.
3
u/ogreUnwanted Aug 18 '23
Find me a decent paying job asking for jQuery only knowledge. It's all about frameworks these days. No point in learning until op comes across it.
1
u/enserioamigo Aug 18 '23
Not worth putting time into though. Easy enough to figure out on the fly and fix whatever needs fixing.
1
u/Fleaaa Aug 18 '23
in 99.999% of dead end website that hasn't been updated more than years*
If your job is maintaining 90s page and has no plan to change anything, you could be right
4
Aug 18 '23
[removed] — view removed comment
1
u/Mikedesignstudio Aug 19 '23
So many butt hurt people here lol. I would rather get advice from ChatGPT than from a lot of you people here 😂
1
0
0
0
Aug 18 '23
[deleted]
2
u/xRockTripodx Aug 19 '23
You'll almost certainly run into it. Anytime you get a client who needs a site updated or redesigned, you'll see it. Even if it's a full redesign, you'll want to be familiar it at least. Hell, there are plenty of libraries that are dependent on it. Looking at you, slick.js. Stepped away from that one in my work, but used to use it, and bumped into it plenty.
36
u/lift_spin_d helpful Aug 18 '23
.click()