An Introduction to JavaScript

JavaScript is one of the most popular programming languages in the world. Along with HTML and CSS, JavaScript is one of the three foundational technologies that virtually all websites rely on.

While HTML is the language used to assign meaning to each bit of content on a website, and CSS is the language used to format styling and layout of HTML elements, JavaScript adds behavior to a web page.

What is JavaScript?

First, let’s clear up any confusion about the name: JavaScript has nothing to do with Java. Now that we know what JavaScript is not, we can talk about what JavaScript is.

If all you want to do with your website is to display some basic text and images, then HTML and CSS are enough to do the job. However, if you want to do more - such as change styles dynamically, animate menus, create functional buttons, validate data entered into a form, and much more - you’re going to need another tool. JavaScript is the tool most frequently used to handle these common website behavior tasks.

JavaScript Libraries & Frameworks

When you first start learning JavaScript you will want to learn and use it in its native format. However, you will quickly that many of the things routinely accomplished with JavaScript require a great deal of coding. This is where JavaScript libraries and frameworks come in: they cut down on the amount of code required to accomplish common tasks.

While you certainly can use JavaScript in it’s native format, and you should develop a solid understanding of pure JavaScript before moving on, you can get a lot more out of JavaScript with a lot fewer keystrokes if you learn to use some of the many libraries and frameworks. According to W3Techs, jQuery, Bootstrap, and Modernizr, are the most popular JavaScript libraries and frameworks.

jQuery is the most popular JavaScript library by a large margin, is designed to help you write less code. It’s also one of the easiest JavaScript libraries to get started with since it uses mostly the same syntax as pure JavaScript. Basically, if you can accomplish a task with JavaScript, you can accomplish the same task with a lot less code by learning jQuery.

Bootstrap is much more than just a JavaScript library. It is a complete framework, or suite of tools, for developing responsive websites. Building a website front-end with Bootstrap will produce solid HTML, CSS, and JavaScript code. Bootstrap provides everything you need to develop the front-end of any type of website.

Modernizr is a small piece of JavaScript code used to detect the features available in a website visitor’s browser, and to tailor the content and styling delivered based on the features detected. Unlike jQuery and Bootstrap, which are can be used to accomplish just about anything, Modernizr is a niche script used for a very specific purpose: to tailor a website visitors experience based on the features supported by the visitor’s browser.

Also see our introduction to Node.js

Some additional JavaScript frameworks being used to develop the most advanced web applications today are Angular.js, Backbone.js, Ember, and React. If you want to take your JavaScript from simple front-end manipulation to full-fledged custom-app development, a little time spent researching these frameworks will help you identify the best framework for your project, and open your eyes to the power they offer.

Getting Started with JavaScript

If you’re ready to get your hands dirty and get down to the task of learning JavaScript, there are two types of resources to check out. If you prefer to learn-by-doing, consider working your way through an interactive course or two where you will learn JavaScript as you are prompted to create simple scripts in a browser-based interactive course. When you’re ready to dive deeper and become a true JavaScript developer, online books and tutorials can help you get there.

If you are a complete beginner you will do best to start with some of the free interactive courses. Once you have a basic grasp for how JavaScript works, head into some of the meatier books and tutorials which will help you level-up from beginner status to a competent programmer.

Free Interactive Courses

Codecademy is the premier provider of free programming education. They offer a JavaScript track that may be the most effective way to get started learning JavaScript.

Code School is a premium (paid) education provider. However, their quick introductory JavaScript course is free, and will give you a 10-minute overview of JavaScript that will get your education headed in the right direction. If you are an absolute beginner, you’ll cover a lot of ground in just a few minutes in this course.

The jQuery Foundation, in cooperation with Code School, has pulled together an introductory interactive jQuery course. Keep in mind that most everyone, including us, recommends learning some JavaScript before you plunge into jQuery. So after completing the JavaScript track at Codecademy, give this course a try and you’ll gain a sense of what can be done with jQuery.

Online Books & Tutorials

JavaScript For Cats is a free tutorial you can read online, and one intended to get you up and running as a beginning JavaScript programmer. Written for cats, but also suitable for their human companions, this tutorial won’t turn you into a full-fledged developer, but it covers the basics and will help you develop a solid foundation to build on.

Eloquent JavaScript by Marijn Haverbeke can be read for free online, or you can get an old-fashioned paperback copy. Developed with backing from web-heavyweights such as Mozilla and Hack Reactor, Eloquent JavaScript is well-respected by experienced programmers.

The Mozilla Developer Network (MDN) offers comprehensive guides for foundational web technologies, including JavaScript. The content provided by MDN is extremely detailed and is considered adequate to get a disciplined student all the way from beginner status to being a competent front-end developer.

The You Don’t Know JS books series, by Kyle Simpson, is a deep-dive series that aims to help you develop mastery of each topic covered. This isn’t a “get up and running” series. You should already be relatively competent before beginning it. If you’re ready to move beyond basic JavaScript usage and become a truly competent JavaScript programmer, with this book series you’ll dive right in the deep end.