HTML, cascading stylesheets (CSS), and JavaScript have experienced massive growth and evolution over the past two decades, which should come as no surprise given the ever-expanding role of the internet in our lives. JavaScript development has come a long way since the early 1990s and IBM's famous commercial depicting business' early recognition of the internet's significance. That commercial forever changed the role of the web developer. Before the business invasion, web developers were more artistic, but the influence of business and industry changed all of that.
More than 25 years have passed since the first web pages produced with JavaScript were developed, and things have improved immensely. Today, IDEs are well structured to validate your code, and self-contained environments help with testing and debugging web frontend logic. Now, learning JavaScript goes well beyond simply studying the language's syntax.
Because there are numerous areas you can learn, think about your objectives so you can focus your training and get up to speed as quickly as possible. Do you want to learn how make web pages dazzle with dynamic content and a killer frontend and user experience that blows site visitors away? Or do you want to focus on optimizing server backend integration, streamlining data flowing to and from the browser and employing the latest patterns with synchronous and asynchronous server calls? Or perhaps you want to do both?
There are tons of JavaScript libraries and frameworks out there that concentrate on dynamic HTML manipulation, Ajax, or both. There are too many to list here, but I encourage you to play around with several to find the frameworks that best do what you are trying to accomplish. Because web searches also have improved vastly since the early 1990s, you're bound to find plenty of commentary on the pros and cons of each.
Online learning resources
JavaScript
If you are new to the world of JavaScript, these free resources are a great introduction to the syntax and fundamentals of the language.
- Mozilla's JavaScript Guide: In textbook-like fashion, Mozilla's easy-to-understand guide explains concepts and methodically walks you through JavaScript development, from your first set of scripts to more complex topics such as error handling, flow control, objects, arrays, functions, etc.
- Udacity's Intro to JavaScript course: This is predominantly an online video course. It is broken into sections, and each section's lessons are presented as separate videos. The presentation is put together well, and the examples in the lessons are simple to understand and comprehensive. The course also includes online quizzes to test your knowledge.
- The Odin Project: Odin is for those who are looking for complete end-to-end development of a web application. It is definitely a hands-on experience in which you build the application components defined in the various assignments and even upload your "answers" to GitHub. This project starts off with HTML and CSS, moves to JavaScript, and even includes backend server logic. Each exercise also allows you to evaluate and compare your creation with others who have taken the course, as Odin's development exercises are available in GitHub as well.
jQuery
If you want to do web development, you need to put learning jQuery on your to-do list. jQuery has become one of the most central frameworks for JavaScript developers, as it greatly simplifies how to handle events, traverse HTML documents, invoke asynchronous calls, and initiate animated features in web pages. The framework masks differences in browsers, so developers don't have to create different sets of code for sites to function seamlessly across browsers.
Bootstrap
Bootstrap is another strong foundational framework that focuses on mobile frontend control and structure. It contains pre-built templates for web presentation geared for devices as well as desktop browsers. It also contains powerful plugins for jQuery to help you prototype ideas quickly.
Knockout.js
Knockout is a an awesome framework that uses the Model-View-ViewModel pattern to create bidirectional dependencies between data and your web interface. It uses declarative bindings to easily associate DOM elements, dependency tracking and templates to provide for automatic UI refreshes. It can interact with JQuery and perform some of the same functionality with simpler code, as well as execute asynchronous calls to server-side logic. The site includes tutorials and several of live examples, making it a a complete reference for this simple, but powerful framework.
Books
Whether you prefer the feel of that historic material called paper, or your idea of flipping through the pages is better suited to "swiping left" in an ebook, there is plenty of excellent reading material on JavaScript and related topics that might catch your interest.
Here are a few classics:
- JavaScript: The Definitive Guide, 6th Edition, O'Reilly: In its 6th edition, this definitive guide lives up to its title. This book has been around for more than a decade, is comprehensive, and it is and well organized. If you pick only one JavaScript book to add to your library, this is the one.
- Learning JavaScript, 3rd Edition, O'Reilly: This resource covers a multitude of topics, beyond learning the basics of JavaScript. It also covers fundamentals of some frameworks, such as JQuery, and includes good examples. This title is an excellent compliment to the "The Definitive Guide."
- Get Programming with JavaScript, Manning: This book is well organized, full of examples, and fundamental concepts are presented clearly and simply.
- Secrets of the JavaScript Ninja, 2nd Edition, Manning: The author dives into how to be more efficient in your functions and highlights typical pitfalls that can trip up any JavaScript developer.
- Pro JavaScript Design Patterns, Apress: Yes, even JavaScript can be object oriented. This resource covers several design patterns that you can incorporate into your JavaScript code, simplifying and organizing your functions for better maintainability.
- Ajax Design Patterns, O'Reilly: This resource is an excellent resource for creating well-crafted, object-oriented functions for AJAX, or asynchronous server calls. AJAX has become a powerful tool in expanding the user experience of your site, and this resource helps bring out the most of leveraging server-side applications and data.
If you're new to JavaScript, hopefully the resources above will provide you a sounder introduction to the language than our exhausted early developer had. If you're a seasoned JavaScript developer and don't see your favorite learning resources here, please share them—and your own tips for learning this powerful language—in the comments.
4 Comments