Difference between code editors and IDEs

How are code editors and IDEs different? Both of them can be used to write code and make the process easier and faster so why should one prefer one over the other.
Also, what is the difference between using notepad to write html vs using visual studio, atom etc.?

3 Likes

IDE’s integrate lot’s of functionality and present that in one interface. Things like debugger, version control management (like git), syntax highlighting, code completion (auto completes what you write), usually very powerful search functionality to move around in the code (even in different files), extensions for devs to build their own integrations, and the list goes on.

You can do all of these things with separate apps/scripts but using an IDE is convenient.

If by code editor you’re referring to an editor that’s only doing say syntax highlighting, the benefit may be that kind of app can be a lot less cluttered and run faster. Though you’ll have to figure out how to do the other stuff by yourself.

IDE’s also come in many forms. Vim and Emacs can run completely in a terminal environment and are lightweight compared to VS Code and others.

Now a text editor like Notepad or Nano (in the terminal) that’s not aware of any programming language and doesn’t help you as a dev in any way also gives you more ways to miss mistakes like simple typos. And a simple typo like missing a ‘;’ somewhere can mean that your app won’t even run and such typos can be hard to find. It’s your own call but if you’re looking to work with code professionally, it’s a good idea to use the tools available to make your life easier

11 Likes

I would add to what David’s said: if you absolutely can’t use an IDE, notepad can be used, and it’ll work. But an IDE has many more pros.

I heard some schools train their first-years by using only text editors precisely because it is that much harder, since (as David pointed out) you rely only on your own knowledge to debug your code. I use notepad when I absolutely need to do somehting on my phone or on somebody else’s computer.

But outside of those situations, I find that an IDE can help you a lot to get used to the syntax and the structure of the code, so I’d recommend it for those reasons, additionally to the actual features they offer =]

5 Likes

I am not familiar with IDE. I have been using Sublime Text and in terminal. I would like to know more about IDE and how to get it. Thanks!

You can download Visual Studio Code here https://code.visualstudio.com/
It’s a free and open source IDE.

First time you’re starting an IDE it can be a little daunting but I think VS Code starts a tutorial at first start up. Definitely don’t feel like you have to use an IDE when you’re starting out. Writing code in Notepad is fine! Just know there are other tools available. Actually, writing code directly in Codepen.io or some other online editor is very nice when you’re learning IMO.

6 Likes

I confirm, as a beginner, that using codepen is nice and easy, as you see the result of your coding in real time and can save your html.

3 Likes

Thank you David. Downloaded it and will explore and learn.

2 Likes

Hi Guys

1) ANY ONE CAN TELL ME HOW CAN I SAVE MY WORK ON IDE ?

AFTER SPENDING THE WHOLE DAY CODING , EVERYTHING DISAPPEARED. !

CAN´T SEEM TO FIND THE SAVE BUTTON OR SOMETHING ?
CONTROL V , DOES NOT WORK IN IDE ENVIRONMENT RIGHT ?
HOW CAN I SAVE MY WORK ?

2) ANOTHER THING, ON IDE , CAN I VISUALIZE THE IMAGES AND OTHER LINKS WHEN I RUN THE PROGRAM ?

I COULDN´T VISUALIZE THEM , I DON´T KNOW IF MY LINKING CODING WAS WRONG OR IT´S NORMAL THAT YOU CAN ONLY SEE THEM AFTER POSTED ?

WHAT AM I MISSING HERE ?

HELP PLEASE !!

What program are you using?

Sorry to hear that you lost your code :disappointed:
It’s usually CMD/Ctrl+S or File > Save. But like David asked, what IDE are you using?

thank you for such a detailed answer. I have done some research too after reading your answer and it helped a lot. I have seen some people debate whether VS code is a code editor and not an IDE. Is there a particular reason for that?

1 Like

Ah yes, in one of the livestreams, it was mentioned that using notepad or something that does not autocomplete can be good for learning as we need to focus on the remembering the syntax more.

VS Code is an IDE. Not sure what people mean by “code editor” (any IDE is by definition a code editor) but I guess they mean editors that does less :wink:
In editors like Vim it’s up to you how much functionality you want to integrate. So Vim is an editor that you can setup as a full IDE if you want.

In the zoom session that covered the tribute page, saturday social i think, jess said that vim is complicated for beginners. I guess I will see it way later in the course, for now, I am sticking with VS code

Yeah, I don’t recommend Vim if you just want to get started learning to code. Steep learning curve if you’re not familiar with it’s concepts from before. I just wanted to say that the line between a code editor <–> IDE can be a little arbitrary and not very clear to me personally when some editors let you add the functionality you want.
VS Code is great! Perhaps the most popular IDE/code editor now. Vim is essential if you work a lot with linux servers and/or if you prefer to keep your hands on the keyboard and stay in the terminal most of the time. If you’re not that person, don’t worry about Vim.

3 Likes

I’m starting to transition my projects to VS code. So far, I use codepen for everything because I’m still learning a ton by trial and error, and then when projects are complete or really close, I start transferring the code to github via VS code & terminal.

I get the benefits of VS code in terms of debugging, but was wondering if there’s any preferred sandboxes like codepen that people use as extensions with VS code? I still need that visual what is the website doing when I add x line of code in real time at this stage. Sounds like there are a couple options out there; what do people use?

I don’t like working in CodePen. I use VSCode as often as I can. You can try CodeSandbox. I just started using it and I think it is much better than CodePen.

As far as viewing the website live, add Live Server from the Extensions tab. There will be a Go Live link at the bottom right of VSCode. Click on it and it will open up the site in Chrome. You can save the file and it will update automatically. There is a way to have the browser update as your typing. I will try to find out how I set that up and will post it here.

Edit: Select Auto Save in the VSCode file menu. That may work. I had to change something in the settings file, but that was quite a while ago.