Ask HN: Learning JavaScript in 2021

6 points by emehex ↗ HN
I have deep knowledge of Python, and lots of experience with Swift... I'd like to learn JavaScript but don't know where to start!

Should I learn TypeScript? What the hell is ECMAScript, WebPack and Gulp and React? How do I even setup a development environment? Do I need Node? What even is Node?

I'm motivated to learn (just enough) JavaScript because I'd like to build more "complete"/"end-to-end" products and services. What do I mean? Well... I can build iOS apps. And I can build Flask/Fast- APIs that serve ML models. But I can't, right now, build things that use accounts or store data.

I'm working my way through the AWS Amplify docs (to solve for the back end stuff). And I'm starting to familiarize myself with GraphQL. But it seems as though I'm going to need to pick up some JS along the way.

So, how should I get started?

I'm not sure "JavaScript: The Definitive Guide (7th Ed)" would be an appropriate place to start as I know what a Class" is, and I don't want to read 40 pages on Types.

Thanks!

16 comments

[ 1.5 ms ] story [ 48.9 ms ] thread
ECMAScript is the standard of JavaScript.

Node.js is a program that can run JavaScript progams as command-line programs, and includes its own library of functions such as file system, cryptography, compression, HTTP(S), etc.

The other stuff you mention I don't know, but hopefully someone else does and can answer your question.

Thanks for your reply. With python, I can run applications at the command line by calling `python my_app.py`. Is this because the language ships with it's own runtime, whereas JS is just a language and doesn't come packaged with a runtime? Also, I've been reading about Deno. Worth learning over Node?
Yes. You have multiple runtimes with JavaScript, more than just Node.js or Deno.

While I like Deno I would recommend against it because right now you don’t have as many libs or tutorials out there to get you started. That would make learning it a lot harder. Once you know Node.js you can look at Deno. The sandboxing they’ve implemented is rather nice in my opinion but I think it is easier to understand what they’ve done and why once you understand Node better.

Interesting. So libraries like Vue and React only work with Node? Why aren't they cross compatible with the different runtimes?
This is mixing up a few different things.

Vue and React are primarily client-side frameworks, intended to run in a browser. They expect that the Document Object Model (DOM) APIs be available, so that they can update parts of the current page based on your components.

However, they can also be used for "server-side rendering", using the same component definitions to generate an HTML string and return it (similar to how you might generate HTML via templates in a typical server framework like Rails or Django).

I know just enough about Deno to know that there are technical differences between how Deno and Node handle defining and loading JS module files, and that might have implications on whether Deno can handle loading libraries like React and Vue as they're currently packaged and published.

Okay! Thanks for the clarification.

I was imagining React as like a library akin to Flask and that it could only work with Node and not Deno. But I understand now that this is the wrong way to think about it.

If you already know Python don’t go with something like JavaScript: The Definitive Guide and just go for some basic tutorials. JavaScript is a tiny language with nearly any base library at all. You should be able to get learn the basic syntax quickly. Stay away from TypeScript unless you come from Java when learning. You can look at it later once you’ve got your own bearing.

I would also recommend Next.js as frontend framework. It is React and WebPack based, you can get started quickly and what you learn from it can be applied to other projects.

For the backend just install Node.js (you will need it anyway) maybe look for NVM if you are on mac or linux or nvm-windows if you are on windows.

Once you feel somewhat comfortable with with the syntax you can take a look at eloquent javascript. The book is online, if you like it you can support the author by buying the book but you don’t have to.

Small tip, if you know programming already books like “The Definitive Guide” are not good for learning something new. Giant tombs like that are interesting when you are a total noob, at any other time they will just slow you down when you are trying to get into a new language. Some of those tombs can be interesting once you get well acquainted with a language and might need to look up edge cases but you are not there yet.

Hope this helps and have fun.

https://nextjs.org/

https://developer.mozilla.org/en-US/docs/Web/JavaScript

https://eloquentjavascript.net/

That Mozilla resource looks great! Thanks for the tip.

A question about Node: It seems like many books, tutorials, libs all use different versions. Do I need 12, 14, 16?

RE TypeScript: I'm interested because it looks a lot like Swift. Bad reason?

Go with 14, it is the current LTS. If you use NVM (node version manager) you can install multiple versions of node concurrently and switch between them. You might need that if you are fallowing a tutorial that uses an oder Node version. I would recommend ignoring 16 until it becomes the LTS version (not worth it).
You can learn to write modern JavaScript in a browser console or a single script tag just fine. There IS a lot of nodejs based tooling to overcome problems with the strategy, but you don't need any of that to start.

Find a modern JavaScript tutorial (if it tells you to declare variables with 'var', look elsewhere) and just start building. The browser has everything you need to create a dynamic page. There will be pain points, but once you understand them, frameworks will make a lot more sense.

GraphQL is a garbage tech, btw. The hardest part of frontend is knowing what trends are useful, and gql isn't really useful unless you are facebook. It just adds mental overhead.

What's so wrong with var? And it's a shame in Swift it's {var, let} vs JS {let, const}!

My motivation for learning GraphQL is directly tied to Amplify/AppSync. It is actually speeding things up for me considerably. Sorry to hear that you haven't had a great time with the tech~

You can use "var", but it does not have proper block scoping; usually proper block scoping would be wanted, so use "let" instead, or "const" if you do not need to reassign the value later (I don't know whether or not any implementations can optimize based on that).
> What's so wrong with var?

var his function scoped, allows redeclarations in the same scope to work as reassignments, and has some other quirks, while let is block scoped and errors on redeclarations in the same scope.

The net result is that var is a lot more trouble. If you are using ES6+ and need a reassignable variable, you should use let. If you need something that won’t be reassigned (even if it will be mutated), use const.

Let/const behave more the way you'd expect in JavaScript. They came about as part of the language shift in 2015, along with a lot of other conveniences. Many of JS's warts are less of an issue if you write modern code.

I guess there's nothing technically wrong using var, but there's no reason to use it over let in almost any setting, and a tutorial that starts you with var might be outdated.

I recently wrote a "How Web Apps Work" series that covers the common terms, technologies, and concepts that are used in web dev. It's a bit more oriented towards the front-end / JavaScript side of things, but covers some information on both ends. I'd suggest reading through some of that as a starting point to get the lay of the land:

https://blog.isquaredsoftware.com/series/how-web-apps-work

I also have a "JS for Java Devs" slideset that provides a cheatsheet-style overview of JS syntax and concepts, as well as summaries of common JS ecosystem tools:

https://blog.isquaredsoftware.com/2019/05/presentation-js-fo...

Great! Thanks for the links