Skip to main content

Command Palette

Search for a command to run...

Coding is unforgiving af for beginners

It’s like failing a writing exam because you had ONE spelling error

Published
3 min read
Coding is unforgiving af for beginners
J

I write about indie hacking, frontend dev, writing & tech for good. ✍️ golifelog.com 🔌 plugins.carrd.co 🥑 ketolistsingapore.com

Warning: Code newbie rant incoming.

I spent a good chunk of time trying to figure out why my script didn't work. Can you see why?

<div id="resizable"></div>

<script type="text/javascript">

  $("#resizeable").resizable()

</script>

All because of ONE "e". Resizable vs resizeable. One tweeny lack of alertness, and everything breaks. The problem is most code editors can't pick up spelling errors/mismatches like that. The level of accuracy needed for human beings to code - perfect and error-ZERO - is like asking human beings to be computers.

There's something wrong with this. We've got things the wrong way round. I understand that computers need very precise instructions to be able to execute a command. But to expect that same level of syntactic precision in human beings...is unrealistic. We have limited energy levels, our attention wavers, we get distracted easily, and after staring at the same words for some time, we miss the trees for the forest. And this also doesn't take into account cultural differences where we spell words differently (color vs colour, anyone? Accordian or accordion?), or people who's native language is not English and not really proficient in it, which significantly increases the error rate.

This is so frustrating.

Code is computer-centric, not human-centred. The user experience of coding is broken. Our tools should defer to us, not the other way round! There's not much one can do about it. The syntax is fixed. Apologies if it's beginning to read like a child's tantrum here. I'm just a code rookie ranting, but because I'm still new to this, I find myself questioning how things are done, and how things should be done. Maybe you're a code veteran and you'd developed a great workflow to prevent this from happening. Double-check your work. Get someone else to look at it for you. Take a break and come back to it. Etc etc.

I get it.

But that's still a work-around. That's still us being slave to our tools.

How many productive developer hours worldwide are wasted because of stupid mistakes like this? Every minute a developer wastes trying to solve spelling mistakes, a kitten dies.

I detest this, because this is a solvable problem (or "solveable"??). This is a design problem. As a designer, I see it clearly enough. When the syntax and the tools are designed at the onset, the authors probably didn't think that it's important to account for human failings like these.

Something that works similar to a normal dictionary/spelling feature in MS Word might help somewhat with checking for inconsistencies. The ideal would be something that can check for mismatches between e.g. your style classes/ids versus what's written elsewhere in the head/body/script sections. Why isn't this already a thing? Is there a Brackets/VS Code extension somewhere that does this?

I'll be super happy to be proven wrong in this case.

D

I'm using VSCode but never facing the same issues here. Probably all you need to do is installing an extension related to your programming language or framework you are using.

For example, if you are writing ReactJS app, you can type reactjs in the extension tab in the left sidebar, and install the most popular extension.

While writing the code, the extensions usually taking some of the work by guessing & suggestion what you want to type. If it doesn't show up, you can press Ctrl + Space to show the suggestions.

Another great extension is this Prettier extension (15M downloads today) would be also helpful to format your code so it will be more readable by human.

Also, in the latest version of VSCode, there's a super helpful settings to colorize the brackets. It is useful when you are working with deep-nested functions.

All you need to do is enabling it from the settings (press Ctrl + ,), look for bracket and enable this setting.

Selection_002.png

And here's how your code looks like (pay attention to the brackets' color)

Selection_003.png

9
J

Thanks Diky! I wrote part of this post in 2019 as a reflection of my time then as a codenewbie who didn't know VSCode. I was using Brackets/Sublime then, didn't know how to add extensions, and frankly VSCode or any IDE would be too scary for a beginner like me then jus starting out.

I had since tried VSCode and yes it does solve many of the issues, though sometimes I still catch edge cases in spelling like the above article!

10
A
Anil4y ago

Well, I highlight the word/Id/class then the matching words are shown. This feature is usually in Most IDE’s, but I use sublime text and the feature is there. Btw I don’t type already designed classes, I copy and paste in other areas to avoid time wastage.

9
J

Yeah, but if I make a typo somewhere else, the wrong word wouldn't show up in the search right?

Anyway, my main point of the post is that missing a character shouldn't be so 'punitive' - it scares off a lot of beginners. Many just starting off might not even use IDEs or know how to pre-set linting in their code editors...

8
\nAll because of ON...","author":{"@type":"Person","name":"Jason Leow ~ golifelog.com","url":"https://hashnode.com/@jasonleow","image":"https://cdn.hashnode.com/res/hashnode/image/upload/v1631525099980/vVItN0OzBf.jpeg","sameAs":"https://x.com/jasonleowsg"},"publisher":{"@type":"Organization","name":"jasonleow","url":"https://jasonleow.hashnode.dev"},"datePublished":"2021-09-29T23:11:02.421Z","image":{"@type":"ImageObject","url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1632957023232/gHns-nUce.jpeg"},"keywords":"Beginner Developers, learning, Learning Journey, #codenewbies, Text Editors"}