Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
When building a JavaScript project, it all starts with the text editor. There are many JavaScript-friendly text editors available. In this video, we'll explore popular text editors that help make you a more efficient coder.
Text editors
- Sublime Text
- Atom
- Visual Studio Code
- Atom and Visual Studio Code were built using JavaScript, with the Electron framework
Linters
Code Formatters
There are a lot of moving parts in
web development and programming.
0:00
It seems like, as a JavaScript developer,
you have to think about many things at
0:03
once, like the structure of your project,
proper syntax, installing frameworks and
0:07
libraries, debugging, even just refreshing
the page to view and test your code.
0:12
So because of the increased complexity
in a JavaScript developer's workflow,
0:17
developers turn to tools to
help make them more efficient.
0:21
The JavaScript community
has created lots of free,
0:25
open source tools to help make
our job a little bit easier.
0:27
So in these final videos, we'll go
over some of the common tools used by
0:31
JavaScript developers,
starting with text editors.
0:34
When building a website or
0:38
a JavaScript application,
it all starts with the Text Editor.
0:39
It's where you'll spend most of your time
and an essential part of development.
0:42
There are many JavaScript
friendly text editors available.
0:46
But a good text editor should help
make you a more efficient coder,
0:49
as well as be able to handle
certain JavaScript related tasks,
0:53
like syntax highlighting,
proper indentation, and code completion.
0:56
The most common text editors used by
Java Script developers are, Sublime Text,
1:00
Atom, built by Get Hub, and
Visual Studio Code, built by Microsoft.
1:05
These are fast, lightweight, and robust
editors that include common features
1:10
of text editors, like syntax highlighting,
1:14
automatic code completion, they're easily
themeable, customizable and extensible.
1:17
And they have built in package managers
that let you install tools for
1:22
additional features and functionality.
1:25
Some editors like Atom,
and Visual Studio Code,
1:28
were even built using JavaScript,
with a framework called Electron.
1:30
You can read more about this
in the teacher's notes.
1:34
Two useful tools developers set up in
their text editors are linters and
1:37
code formatters.
1:41
All too often, errors in your projects are
related to simple typos like misspelling
1:42
a variable name, a missing comma,
or a closing bracket, for example.
1:46
A linter reads your code to help you
avoid problems and spot possible errors.
1:50
And a code formatter maintains
overall code quality by
1:54
enforcing a consistent style.
1:57
For example, tabs versus spaces and
semicolons versus no semicolons.
1:59
This is important when working on teams.
2:03
Every developer has their own style
of writing code, so a linter and
2:06
code formatter can help a team keep
their project's code maintainable and
2:09
readable for everyone on the team.
2:12
Especially future team members.
2:14
One of the most popular Java script
linters you can use in your text editor
2:16
is ESLint and Prettier is a code
formatter commonly used by developers.
2:19
Since these are automated tools, running
them doesn't require any extra manual work
2:24
once they've been set
up in your text editor.
2:28
You can learn more about
the differences between linters and
2:30
formatters in the teachers
notes with this video.
2:33
You need to sign up for Treehouse in order to download course files.
Sign up