Index
Overview
To get started we'll need a js code editor(s).
We'll also need a way to run our code.
Suggestion: use a combo of the approaches listed below.
Note that we don't show a sophisticated IDE (Eclipse/Intellij, etc) here. They are good solutions as well, but best after first climbing up the js learning curve a ways.
Plain Text Editor
Choosing Editor
Program source files are plain text.
This includes all of our source files: "js", "html", "css", "ejs", etc.
Therefore, when we edit source code (a.k.a. "write code") we want to use a plain text editor.
Windows and the MAC both are bundled with plain text editors:
- Notepad (Windows)
- TextEdit (MAC OSX) - use menu "Format > Make Plain Text" and/or "Preferences > Format > Plain Text"
However, we'll typically want to use an editor with more capabilities. An internet search for "plain text code editor" will produce a large result set. Here are a couple editor listings:
Saving With Different File Extensions
Each plain text editor should always be saving in plain text format (which is what we want). Therefore, generally when we "save" or "save-as" we can simply type in the filename with the proper extension whether that is "myfile.js", "myfile.css", "myfile.ejs", or "myfile.foo".
There is an effectively unlimited number of different source file extensions (with more being added all the time) but they all follow this same (editing) pattern.
When doing a save/save-as, if there is a "type" choice list, we can generally ignore that field (unless we do not know the file extension -- and we always should know it).
File Extensions
As developers, we'll be working with files that have many different file extensions like "js", "html", "css", etc. When browsing files we ALWAYS want to see file extensions. This is how:
Notepad++ With Node.js
We'll go through the steps here for Notepad++ (Windows). Most MAC editors will have similar capabilities.
Notepad++ is a great way to start coding js. You can both code and run JavaScript from within Notepad++. Nodejs fully supports JavaScript.
This approach has a major side benefit of getting Node.js installed (as a js coder, you'll want to use Node.js).
The setup is here:
NOTE WELL -- Note that you will need to have a "package.json" in the directory with your JavaScript files. You can copy and use (as-is) the json file in this ZIP.
Once installed, here is an example 'lab' for play (simply open up in Notepad++).
Pros: efficient coding. A minimal ide so we can code and run with the press of a function key.
Cons: best for code w/o ui.
Plain Text Editor Plus Web Browser
This approach uses this combo:
Also see How to Do a Quick Run Check in a Browser
Pros: viewing code in ui
Cons: time consuming. Involves managing view also (html, css, etc).
In a Web Browser
You can open about any web browser and do a little js.
The coding you can do is extremely limited, but it's useful for quick code play.
This one minute video shows you how.
Pros: super quick
Cons: limited to just checking one-line statements.
JavaScript Online Editors
There is a countless number of online javascript editors
Pros: great for quick code spot checks e.g. test a few lines of code.
Cons: java is file-based, so the transfer of files from the online editor back to a local computer code base can be error prone (if possible at all).
Quick Run Check
Overview
Note that we do not cover testing js here. That is covered in a later chapter.
This is for cases where we just want to give our code a "quick run check".
Alternatives
All the editors discussed in this chapter are suitable for doing run checks on a .js file.
Especially see:
No matter or choice, we'll always find reasons to use (or also use) a web browser for run checks. Here is a step-by-step example for that:
JavaScript Guide
(Chapter 301 - CodeEditors)