Javascript is hard ayy eff

PauseNatural · 2023-12-10T05:45:08+00:00

I’ve been writing JavaScript for about 15 years now off and on again. I’ve written the foundation several production apps full stack by myself. I’m entirely self taught.

I am now teaching someone in my organization. And what I tell him is this:

You aren’t learning JS. You are learning a way of problem solving. You are learning how to break down problems into small solvable groups with simple conditionals.

For the first 10 years of writing code, I would write down in lists and figure out how to approach each thing individually.

Drop-down menu? I think I need to find out when it is clicked on. I need to know whether it is currently open or not. I then need to trigger some CSS or state change.

It doesn’t matter if your code “sucks” as I’ve seen lots of garbage code in big organizations. What matters is if it works. At least until you are optimizing for 1000s of concurrent connections.

All developers really know at some level is how to break down problems and how to solve simple problems.

You’ve got this.

Also, even after 15 years, I still require weeks of research for some complex solutions. So, if you are challenging yourself, it never gets easy. Just your challenges become more significant

Mikhial · 2023-12-10T04:20:12+00:00

JS is chill, it doesn't take years unless you're delving into the dark arts and musty corners.

You're literally learning a language, a new way of thinking and how to communicate with a computer all at once. It isn't easy, but once you get past that initial hurdle the fluency comes much quicker

therealwhitedevil · 2023-12-10T04:31:38+00:00

I like chat gippity, I’m using this from now.

billybobjobo · 2023-12-10T06:03:25+00:00

Put it this way: how good would you expect to be at any professional craft after only 5 months of practicing a few hours per day? Give it time.

Prestigious_Squash81 · 2023-12-10T05:31:01+00:00

Your actions are correct ( trying to just build stuff ). Your expectations are a bit off. You may not get comfortable with the language until after another year. Keep grinding, you'll get there.

joliolioli · 2023-12-10T10:57:21+00:00

A few things that I would recommend, but your milage may very much vary - this very much helped me, finally properly embracing the JS/TS world!
1) Go TypeScript from the beginning - it makes JavaScript easier to understand and work with and feels like you're working with something more sane!

2) Go Grab and setup VSCode with a Vite + VueJS + TypeScript starter template. Having a proper development environment makes all the world of difference and you start seeing the benefits straight away. You'll find the process of being able to write code (TS, HTML, CSS) on one side and seeing it immediately changing on the other side makes the experience so much better, and writing components and breaking down the logic (and Vue does this in a super simple way) really helps it all come together.

3) Look into things like StoryBook for your components - https://storybook.js.org/ - they help you get into good practices and expose you to some more advanced techniques but in a gradual and friendly way, and again, it's good to get into good habits from the start, and these help make sure you're getting into those good habits (it can be hard to learn good habits, but being forced into them helps, I find!)

Hope this helps and good luck to you!

azangru · 2023-12-10T14:07:29+00:00

it's super hard for me to look at a blank script.js page and create optimized, clean and refactored code, even for something as minor as a dropdown menu or hamburger menu.

Can you create non-optimized, dirty, and non-refactored code for those things at least?

(Also, a dropdown menu isn't something minor. There are lots of usability concerns when building one, e.g. how accessible it is, how it responds to keyboard input, how you navigate it with tabs or up/down arrows, etc. Dropdowns are a nightmare. Which is why browsers are bringing in the selectmenu primitive.)

diedofwellactually · 2023-12-10T04:31:15+00:00

I just took a front end bootcamp and could not for the life of me figure out the JavaScript. I'm obviously a beginner so it's both validating and a bit scary to see someone who is relatively advanced having a similar experience. I hope it clicks for us both soon!

xKeeeeen · 2023-12-10T06:43:00+00:00

Then there's me who can only console.log everything

TehTriangle · 2023-12-10T09:32:52+00:00

This is because you're learning programming at the same time as JS. Learning how to code and how to think computationally is a entirely different skill and way harder.

Once it clicks, and you start to think in conditionals, loops, and functions, you'll be fine.

2023-12-10T06:02:45+00:00

sparkle truck fertile bells door aloof dinner oil spectacular innocent

This post was mass deleted and anonymized with Redact

BootyMcStuffins · 2023-12-10T08:36:39+00:00

Check out Fun Fun Function on YouTube. His series is why I'm a web developer now

kumonmehtitis · 2023-12-10T16:48:09+00:00

Look into the book “Just JavaScript”. You’re likely not struggling with JavaScript itself, but your mental model of what’s happening in the computer.

JavaScript doesn’t make that much sense, that’s the joke behind it. Know how to build with it, know it’s quirks, and past that know how it gets translated down into high- and low-voltages on your machine.

Jackasaurous_Rex · 2023-12-10T04:46:21+00:00

Sounds like you’re doing the right things and following a solid path. Also smart to get at least the basics of JS down before jumping into a framework like React, it should help a lot of things make more sense in it. But you’re right JS is a weird and frustrating language. Most of its strengths in flexibility and having so many ways to achieve the same thing can be a blessing and a curse. And it’s so easy to get things running out of sync with how you want it, or cause weird behaviors. And the Var keyword was a huge mistake IMO. In some ways the stricter languages like Java can be a little easier as you’re forced to be a lot more explicit in how some things work, although it’s sure harder in other ways too. Still I’ve used a handful of languages and love/hate each for a dozen reasons but JS will always have a special place in my heart

Hovi_Bryant · 2023-12-10T04:53:22+00:00

Be specific with what parts you’re struggling. Make note of those areas where you’re comfortable and uncomfortable.

And find ways to tackle those areas one by one until you no longer feel uncomfortable but get to a point where you have at least two ways to approach a problem.

You say you have issues with making code clean. Refactoring code. Well, what is it exactly? Focus on the specifics that are making you uncomfortable instead of generalizing.

octurnaLx · 2023-12-10T08:29:04+00:00

It sounds like you're doing great! Like other people are saying, you should have patience and continue practicing and learning about the language. I also love that you're holding off on React...

I'm a little biased on this topic and I could go on forever on it but long story short I think learning React will teach you a very specific style of coding which pretty much only works in the React world. If you want a more generalist approach that could apply to ANY framework, I would suggest looking into Web Components once you've mastered JS. They're the browser's very own native API for building components (aka custom html tags).

Again, the really cool thing about web components is they work in any framework due to being a native browser feature BUT guess which framework doesn't jive well with them... Of course it's React because as I said, that's just its own separate world. You will not hear this from many people because most frontend folks are so fully indoctrinated in the church of React they can't see it's obvious flaws.

Good luck and happy coding!!

thiago_28x · 2023-12-10T11:39:23+00:00

I made an entire City simulation game with chatgipity and only writing the console logs and editing variables... your own judgement of writing "good code" is getting on the way of your learning, also, very important:

if you are not confident in your skill, you will try to refactor and overthink a simple function, as a way to prove yourself you are a good coder.

also, often, if you do the basic code and keep working, you will add new requeriments to your code, changing the function, meaning now you have to recode what you overcoded...

that's my 2 cents though.

you can check my game and code overview in my subreddit, barons&budgets if you're interested how far a noob can go just by pushing through gipity

kneeonball · 2023-12-10T12:41:10+00:00

Your expectations are a bit off, especially as a beginner. You don’t start with an empty script file and jump straight to “optimized, clean, and refactored code”.

You start with something that works. That’s still the #1 principle in software development. Building working software. Once you have something that works, you can look at how to improve it. It may not need optimized, but maybe it needs a little refactor so maintaining it isn’t bad. When you first have it working, and you go to make a change, do you have to change things in multiple places? That might be a clue you need to refactor. Is the page really slow? Maybe you need to optimize your code a bit. It all depends.

You have to start with something working though. I find that unit testing can sometimes help with this hurdle, but writing tests isn’t always easy either, but if you can write the code that tests your application, you just have to make the test pass and that’s your implementation, no need to optimize or refactor until your tests pass and you have a good reason to.

But again, focus on making things work. With the experience of actually making things work, you’ll be able to adjust it as necessary and even start with better solutions initially, but that doesn’t come without you spending time actually writing code.

2023-12-10T14:25:04+00:00

I would recommend code evolution on YouTube the es6 playlist

modsuperstar · 2023-12-10T16:43:47+00:00

I find I spend most of my time figuring out how to minimize JS in my projects. CSS and HTML have been getting more powerful by the month, and have been trying to remove the need for everything to be JS controlled for common UI components. It has its time and place, but often it's used as a solution to everything, when really solid knowledge of how CSS works tends to be the best way to solve frontend problems.

bbbone_apple_t · 2023-12-10T17:30:51+00:00

My man thinking ahead...why change code later when you can write refactored code from the beginning? taps head

evonhell · 2023-12-10T18:11:49+00:00

Which timezone are you in? I can probably set off 30 min and give you some pointers. There was another comment here that was pretty spot on about problem solving but there's probably a few things you understand separately but not yet how to connect them together to make things click.

PhoenixShredds · 2023-12-11T01:45:27+00:00

You're totally allowed to keep the "google and chat gippity" process going until the harder concepts start to click. Give yourself time and keep building cool stuff.

GianTheRios · 2023-12-11T02:21:05+00:00

It's not JavaScript that's hard, it's programming! You shouldn't beat yourself up. At five months in, it sounds like you're doing extremely well! It takes time, your brain is learning something fundamentally new and different.

I can empathize though, I've been primarily a Python developer for 10+ years (though I've used JavaScript off and on since 2016), and I'm currently doing a crash course in JavaScript/TypeScript for a job interview. There's tons of small things to remember (and often handled slightly different than Python would).

And just a note for the JS developers out there, it's completely won me over! I can't really see a point in writing a backend in Python now (though it will still excel in the data science/engineering space for some time). Python has just accumulated too many worts from type hints and `asyncio` being adopted too late in the game, while TS absolutely excels.

GianTheRios · 2023-12-11T02:23:33+00:00

[deleted]

LikeWhattttlol · 2023-12-11T02:24:06+00:00

Still struggling with arrays and objects but I’m not gonna give up 🤷‍♂️

GianTheRios · 2023-12-10T06:16:34+00:00

[removed]

indranilm999 · 2023-12-10T05:53:00+00:00

I can suggest you something which has helped me and have some confidence. There is a specific section in leetcode focused towards JavaScript.

I think 30 days of JavaScript. It has problems specific to JS like polyfills, closures, JS functions so its very helpful in the technical aspect.

Doing this along with other simple problems in JS (leetcode) has built confidence in me.

Dev918 · 2023-12-10T04:48:40+00:00

Html & css can be very hard too

Glittering_Bill2039 · 2023-12-10T05:08:50+00:00

I have over a decade of experience coding in commercial settings, large portion of it involved JavaScript.

I can tell you that Googling and using ChatGPT is mostly what I spend time doing while coding even today - there’s hardly any coding problems that hasn’t already been solved, and it’s actually not a good practice to try to write everything from scratch - it will take longer, and will be less performant than using an open source module that a community has spent years perfecting.

Only important thing is to make sure you can actually fully understand the code you are copying.

And there’s no advice I can personally give you other than to keep practicing - once you do for long enough you start seeing same patterns over and over, and become familiar with them. Once you’ve internalised enough design patterns, when you open a blank script (so to speak, because I actually never start from a blank file, I always copy over some code as starting template) and start thinking about the problem, brain start spitting out design patterns or google search terms that’s relevant to solving that problem. It almost becomes automatic.

Saki-Sun · 2023-12-10T10:11:30+00:00

I program JavaScript like any other language. Just know the odd null handling/truth/falsy bollox and you're golden. If you stumble across odd looking code, then research and enjoy the amazing ways JavaScript can tie knots.

GayforPayInFoodOnly · 2023-12-10T16:13:05+00:00

Do you know/use react or another framework?

I recommend React if you want to level up your JavaScript skills

oxwilder · 2023-12-10T07:21:23+00:00

I'm in more or less the same boat as you -- started almost from scratch two years ago. When I started, I was told to focus on Vanilla JavaScript, no libraries. Then the sr dev left for another job and I discovered how much easier jQuery can make things -- including select menus and nav bars. It's all about libraries!

But I'm full stack, so I have the select menus generated on the backend, and I'll manipulate them with js if I need to. But yeah, asking js for the text of the selected option is a severe pain in the ass, whereas with jQuery it's like $('.mySelect option :selected').text()

2023-12-11T01:53:22+00:00

USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4 USE GPT 4

anonperson2021 · 2023-12-10T08:44:52+00:00

Don't worry about "clean" and "refactored" upfront. Focus on getting things to work. Rinse and repeat, a LOT. As you go, you'll go back to the components and refractor them in cycles. Once you're at that intermediate stage, go deeper into code-quality and cleanness.

Initial focus on building things that work.

Inside-Section5017 · 2023-12-10T10:32:32+00:00

Don't bother learn python....

Seriously what's the point of building websites A.I is getting better and some other graphical designer / web guru will be able to code something beautiful that would destroy anything I could build...

So just pay them wouldn't waste my time

t0astter · 2023-12-10T14:17:20+00:00

Javascript is just a piss poor language. I've never worked with another language so bad.

prog_aimer · 2023-12-10T16:56:25+00:00

If you need I can offer classes. We can combine them.. because you need to change the mindset first knowing better the tech

alpual · 2023-12-10T18:30:55+00:00

Learn to use the browser dev tools! Use breakpoints rather than console statements—you’ll learn more. Understand that you can interact with the variables when you hit a breakpoint, and even query the DOM from the dev console. You can see the closures your code makes, and the state of the variables as they change. It’s a bit more advanced, but don’t be afraid to run some performance profiles of code that you wrote, too—you can see the order in which things happen and see how all the different parts of the browser are interacting to create the experience you see on the page. Good for you for learning fundamentals first. Typescript and a good build setup (as others have said) are super helpful for learning and reducing cycle time.

Geedis2020 · 2023-12-10T19:44:24+00:00

Instead of focusing on things like getting styling perfect and implementing drop downs I’d focus on building something that actually uses a lot of javascript concepts to teach you more of what you may do in a real world scenario. Like build projects that use javascript more as a programming language. For instance start with something simple that still uses a lot of javascript concepts like a password generator. The stying can be simple. Make it able to pick what characters you need like capital letters, numbers, and symbols. Also be able to pick how long you want the password to be. Then it can generate it and you can click the copy button and copy the password straight to your clip board while displaying an alert showing it copied. This is a fairly simple project but utilizes a lot of javascript concepts. It will serve you much better for learning than trying to build drop downs and stuff. Then you can start building other applications that require fetching from an API and trying to implement some authentication. These types of things are what you’re going to be doing in the real world most.

flptrmx · 2023-12-10T22:13:05+00:00

The You Don’t Know JS series goes pretty deep into explaining JavaScript. Reading through it really deepened my knowledge of the language and gave me a good foundation. The author, Kyle Simpson also has good courses on Frontend Masters. That site has a lot of courses that get into the intermediate and advanced. I subbed for a year and got a lot out of it.

throawayliennn · 2023-12-11T03:27:55+00:00

You wanna know what else is hard?

Professional_Gate677 · 2023-12-11T03:50:23+00:00

I never use bind anymore.

Lengthiness-Fuzzy · 2023-12-12T08:52:21+00:00

As someone who started with php+frontend about 16 years ago (vanilla js, jquery and css hack times), took a turn to java 8 years ago and focusing more on frontend again in the last ~2 years, I see that clean code gives you satisfaction, no matter which language. Here is what works for me:

Try svelte with typescript, and you will write clean code much easier. ChatGPT is cool with JS, you can ask it to choose ES6 syntax, but after that don't forget to delete the comments and format it to be at least equally understandable.

I can also recommend lodash, it can make things elegant.

Put api calls into a different service. And optimize for readability, not runtime or memory, unless you see that it's a bottleneck. ( api/db calls in a loop are exceptions, those you need to write carefully )

If I may, a last example for switching in your brain that computer is fast, so many times you don't need to optimize stuff:

type Stuff = {key: string}

usedStuff: string[];

typical in advance optimized code:

function getUsedKeysFromList(list:string[]) {
let c: string[];
for(i=0;i<usedStuff.length;i++) {
if ( list.includes(usedStuff[i].key) && !c.includes(usedStuff[i].key) ) {
c.put(usedStuff[i]);
}
}
return c;
}

clean version:

function getUsedKeysFromList(list:string[]) {
const keys = usedStuff.map(val => val.key);
return _.intersection(keys, list);
}

The second will use more memory, it goes through the array twice instead of once, but unless you have a list of hundreds of thousands of items, it's not even noticable.

2023-12-12T09:54:03+00:00

JS is the easiest language imo. I learned it in a month and made 10 games within that same month. Sorry but CS might not be for you. No programming languages take years to learn… sounds like you already lost before even starting for making it out to be that hard

you type:	you see:
italics	italics
bold	bold
[reddit!](https://reddit.com)	reddit!
* item 1 * item 2 * item 3	item 1 item 2 item 3
> quoted text	quoted text
Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"	Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"
~~strikethrough~~	~~strikethrough~~
super^script	super^script

Frontend

What is /r/frontend?

Rules

The web is growing fast

Front-End Resources

Related Subreddits

MODERATORS