My Best Friend Wants to Learn JavaScript – Here's What I Want Her to Know.

Cover image: Bubble Bobble

The other day, during a marathon FaceTime call, a good friend of mine offhandedly mentioned that she wanted to learn JavaScript. She has some knowledge of HTML and CSS (plus a dash of Python) but has never approached JS before. Being a beginner myself, I wanted to save her some pain– so I started gathering some links I've found helpful as I've been starting out.

If you're reading this and you're not my friend Lea, that's okay too. Whoever you are, this is a very basic guide to some free resources for starting in JS, compiled by someone who cares you.

What is JavaScript?

In my own words, in simplest terms: JavaScript is a programming language that can make things happen on web pages – without having to refresh the page. It's what lets you add comments that appear instantly, and makes the heart button turn red when you click it. But it's also super flexible, and can be used to build MUCH more complex things. Here are some overviews that say it better than I can:

• Here is a description of what JS is on the JS site itself.
• Here's a great write-up in the MDN Docs, which will prove to be invaluable throughout your JS experience. It also includes a "Hello World" exercise to get you started. Which brings me to...

Getting Started

Just reading up doesn't give you a gut understanding about how to work with JS. Different people like to approach learning a new programming language in different ways. You may want to start with an online course that walks you through the basics, or you might want to jump in feet-first and Google "How to do this in JS" as you go. Here are some options.

• Sunil Sandhu's great plain-English JS Beginner's Guide is a really great primer.
• Codecademy has a course on beginning JS.
• Learn.co's curriculum on JS/the web and JS/the world are good starting points, and their repository has a ton of JS intro readme resources.
• MDN Docs: JavaScript First Steps
• javascript.info is pretty verbose, but has EVERYTHING. In fact, you could probably stop reading my post right now and go over there and be better off.
• And finally, I highly recommend Dan Abramov and Maggie Appleton's Just JavaScript, which will come to you as a series of gorgeous emails and help you form your mental models of JS.

Okay, but how do I actually... do it?

First, you'll need an environment to program in. JavaScript traditionally works in-browser, so all you really need is a browser and a text editor to get started. JS devs tend to prefer Chrome and Firefox because of their robust developer tools. (here's a guide to the Chrome console, and here's one for Firefox)

In terms of text editors, you've got a lot of choice. It's possible to write JavaScript in something as plain as TextEdit, but specialized apps like Atom or Visual Studio Code are made for writing code and will make things easier. It's totally up to you what text editor you want to use – some are simpler, some more structured. There are tons. Google around!

You can use your browser's console to get familiar with the ins and outs of writing JavaScript. Then, when you want to test out your knowledge on your own web pages, all you have to do is create an HTML file with a <script></script> tag (you can either insert JavaScript right in the file or link an external one, which is just a file with the extension .js). Open up your HTML file in the browser and you can test your code, and/or see all your errors in the console. :)

You can also use online tools like jsfiddle or codepen to play with JavaScript, which might be a good option to get your feet wet with minimal setup.

To run JavaScript on your computer without having to use the browser, you should install node.js and npm. Here's a guide to using it, although I admit I haven't played around much in Node.js yet. Once it's installed, you can type node in your terminal to open up a JS console right on your computer, or run .js files using node filepath.js. Pretty cool!

Slightly more advanced things

Once you're familiar with the basics of JavaScript, here are a few resources I like for more advanced concepts.

• Maggie Appleton's site has some wonderful illustrations and explanations about JS concepts.
• Similarly, Dan Abramov has recently started whatthefork.is for explaining JS thingies.

That's the end of the links I have for now – I might add more resources for things like working with APIs as we go, or this might become a series, as long as Lea wants to keep hearing from me!

Stay safe.