You are here
Moving Forward with Javascript: Back to Basics
I have been exploring a few front-end JavaScript frameworks recently and during my research have come across more than a couple references to developers using frameworks as a crutch rather than learning the fundamentals and basics of the language they are using. I have been using JavaScript in various ways for almost a decade now: using it load SWFs; using it to make DOM manipulation a bit easier; using the server-side capabilities to communicate with a database collection of JSON documents; and least of all leveraging the open-source libraries and frameworks the community has built to make my life easier. Now that I think about it JavaScript has evolved and grown tremendously in the past 10 years. I make my living as a web developer and it never occurred to me that I might not know the fundamentals of modern JavaScript.
So what are the fundamentals a modern web developer should know? Should they only include the basics of JavaScript, HTML, and CSS? That certainly would have been enough to build a website when I first started learning to program. We should probably include some Node.js exposure and you have to have version control. If we're using Node we should also learn to use npm for package management; if we're including git we might as well throw in some markdown basics. We'll need to know about promises, closures, ES5, WebGL, and you can see where I'm going here.
So as a way to evaluate my own skills and hopefully learn some new ones I am going to work through the tutorials at NodeSchool over the next several blog posts. While the tutorials are listed together in "Core" and "Elective" sets I will endeavor to work through them in more bite-sized chunks with similar concepts grouped in a more intuitive manner.
You'll need Node.js installed to work through these tutorials. For each tutorial listed, just follow the install instructions unless otherwise noted.
Part I - Before the Basics
These are some thing you need to know before really getting started. Consider these skills the to be the wading pool of web development.
git-it
Version control is your friend. You'll want to know how to properly store your code for future reference or re-use. What type you ultimately choose to use is an argument for another place and time. Git had only just been developed when I was learning to code. Github hadn't even been launched yet and, really, it was a couple more years after launch that it started to become a more popular platform for hosting and sharing code repositories. For now, Git is the version control system for the web so start with git-it first. You can use what you learn here to better manage your code as you learn.
After installing the tutorial through the command line, running git-it for the first time shows a list of tutorials. The first one, "Get Git," gives you instructions by way of a web link and/or local address that you can launch in the browser of your choice. The rest of the tutorials walk you through creating your own repositories, forking other repositories, pulling, pushing, and branching code so you really know the basics of using Git.
Further Reading:
how-to-markdown
Markdown is an easy-to-use plain text format used for styling content on the internet. Markdown is used on sites like StackOverflow and Github to allow users to contribute content using a common set of rules to write readable and formatted text. One of the big things I use Markdown for is writing the README files for my Github repositories. Your mileage may vary. This tutorial goes over the basics of formatting headers, lists, tables, links, code blocks, and images as well as a basic intro to Github's flavor of Markdown.
Further Reading:
- Github's Getting Started with Markdown
- Github Guide: Mastering Markdown
- Adam Pritchard's Markdown Cheatsheet
How to npm
What is npm? npm is the package manager originally built for and shipped with Node.js. There are over 300,000 packages that are listed in the main npm registry for developers to use and because npm was built for use with Node.js all the code you'll find there will be written in JavaScript. What are packages? A package, in this context, is a discrete bundle of code written as modules for a specific task or tasks. A metadata file, package.json, can be used to manage dependencies, handle versioning, and run simple build- and test-related tasks. Why do you need to know how to use it? Npm has become almost the de facto package manager for JavaScript web development. It is an integral part of the Node.js ecosystem but can also be used in projects that aren't built on Node.js. With the coming of ES5, ES6, and beyond, modular JavaScript development is here for the long term. One thing to mention is that some of these tutorials may require some Googling to get a successful submission (I'm looking at you "Publish Again" - see https://github.com/npm/how-to-npm/issues/25 for help if you are stuck).
Further Reading:
All of these examples are available on Github.
What's next? In Part II we look at the rest of NodeSchool's core tutorials and get our feet wet in the web development pool.