Sign in
Log inSign up
How IDE is a blessing for beginners

How IDE is a blessing for beginners

Gijo Varghese's photo
Gijo Varghese
·Jan 12, 2019

Quite recently I came across the post IDE - The beginner's trap. It's a must a read, good article by Younes

But

I can't agree to it 100%. Moreover, sometimes it seems to be misleading for beginners. That's why I'm writing this down. Let's discuss

What's an IDE?

An integrated development environment (IDE) is a software suite that consolidates basic tools required to write and test software - Wiki

Basically some tools on top of a code editor, right?

Training a few newbies - My story

In the past, I used to train students programming in HTML, CSS, JavaScript using editors like Notepad++. I went quite well. But it was 3 or 4 years back

Recently I'd to train some freshers in my startup. They've some basic knowledge from college. I'd to make good at the backend (NodeJS) and frontend (ReactJS). I'd configured VS code for them with everything I know when it comes to the best practices in React and Node.

  • Setup Prettier
  • Setup Eslint
  • Strict rules from Airbnb style guide for JS in Eslint
  • Install extensions for JS, JSX, CSS etc
  • Some intellisense extensions

What I learned

Once you make some mistakes in Nodepad++, most of the time it's not intelligent to tell you those mistakes, you need to run and see the console for errors

But if you're in IDE, whenever you make mistakes, before you run it show you the errors and the suggestions to fix it. For beginners, I think it's really good. Because if they aren't seeing the output really fast, they will eventually hate programming, and they'll lose track

We'd very strict rules and config so that our developers follow the best practices. Some good examples would be (in front-end, React)

  • Shows warning whenever a lifecycle hook that is deprecated is used - Beginners are not very well interested in reading docs, or even experienced ones are not up to date with docs.
  • Shows warning when setState is used in hooks that have side effects - Not only IDE shows it's not recommended, but also indicated why!
  • Suggestions on what to do when you add onClick to div (beginners forgot to make them cursor:pointer), following a11y style guides
  • Naming variables - beginners always tend to write var=a,b,c. A properly configured IDE can suggest using camelCasing or whatever you follow
  • var is not required. We never use var. Always let or const. IDE will suggest why it's not needed, and alternatives. You can say beginners need to study JS before writing JS, but I believe 90% of the learning is while doing it
  • You missed catch statement - Beginners always think "yup I'll get a response for this HTTP call", what if it fails? My IDE always throws errors whenever there is a catch is missing
  • No console logs - Whenever someone uses console.log and tries to commit code, our tools in IDE will stop them from committing.
  • No parameter reassign - Not just for beginners, Experts also forget it sometimes.
  • Warning or JSON.parse(JSON.stringify(Object)) - It's a very dangerous one, some beginners I've seen frequently use it without knowing the proper method. IDE suggest to not use that. So they'll eventually use the proper method

There are plenty of things to add. But I'm ending up here.

Conclusion

IDE is not always for auto-complete and code-snippets. It's much beyond that. Whenever I'm coding in a properly configured IDE like what I said before, it feels like an experienced engineer is sitting next to me. He helps with my errors, suggestions, best practices, indentation, tools and more.

After training a lot of beginners I found that using a properly configured IDE can help you make better programmers, by following the best practices. It's also less headache for senior engineers because we're sure that 80% of the basic code review is done by the editor. Otherwise, they can't commit code!!

I regret the days where I taught newbies programming with Notepad++

IDE is not always a trap - I feel it's a blessing for beginners