Are You a Code-Curious Journalist? Here’s a Quick Guide to Online Tutorials

“I definitely think that coding now is a kind of a literacy, no matter what position you are in.” –Louise Ma, WNYC’s data news interaction designer, in CJR

Here’s a fact: The occupation of newspaper reporter was recently rated by one career services website as the No. 1 worst job of 2013. With a negative 6 percent projected job growth and a painfully low median salary, it’s become clear that the concept of the “traditional” journalist is a dying breed. As a student myself, this translates into, “If you leave j-school with only an improved comprehension on how to write words on a page, you’re in trouble.”

The solution? Well, if you’ve been paying attention then you have probably already heard somebody preach: It helps to learn how websites are made.

Prior to Medill, I spent a good five years dabbling in web-making, compelled by an introductory computer science course I took on a whim during my senior year as an undergraduate. And by dabbling, I mean running up a hefty Barnes & Noble bill on whatever code-learning books had received the best Amazon.com reviews or sitting idly at my desk watching video tutorials, occasionally asking myself, “why am I even doing this?”

Googling “journalism” + “coding” serves as an omnipresent reminder.

Pieces about why journalists need to integrate technology skills into their repertoire have become commonplace. Last year, Neiman Journalism Lab took on journalism education, and a number of tech-focused publications like GigaOm and MediaShift have weighed in as well.

And performing that aforementioned Google search returns links to the same prescient story written 100 different ways. I can tell you, having concentrated my Medill degree on the interactive side of things, my fear of leaving Medill without improving my digital literacy is very real. And for better or worse, the number of resources available to teach these skills can be overwhelming. Which begs the question: Where do I start?

There are, of course, a plethora of paper-based books available. But for many journalists unfamiliar with web-making, it can be a laborious and often frustrating process to find the one that “speaks” to them in a way that makes sense. Most books that teach code — even ones that claim to be for “beginners” — are written with programmers in mind. Not only am I not a programmer, but I’m also a more visual learner. I learn by watching and doing. That’s where online tutorials and live text editors come into play.

As learning to make the web has gained more mainstream appeal, the number of available tutorial websites has exploded, which muddles the playing field a bit. They’re not perfect, but online tutorials are a highly-accessible way to get started. Not all are created equally so the following is a brief breakdown of some that I found helpful:

Video only

Lynda.com

www.lynda.com
$25/month, $250/year

Lynda.com began teaching people how to program via video tutorials in a pre-just-search-YouTube-for-a-tutorial world, and when the idea of learning through video itself was pretty novel. And it was one of the first sites I turned to before I could write a snippet of HTML. Over the years, their staff has grown to over 100 “educators, authors, and recognized authorities” in the fields of not only web design, but graphic design, video, photography, audio and more, and they offer more than 100,000(!) tutorials in all. Certainly worth the price of admission, if you can swing it.

Treehouse

www.TeamTreehouse.com
“Silver” plan: $25/mo., $250/yr. “Gold” plan: $49/mo., $490/yr.
Provide proof of university enrollment $9/mo.

Treehouse’s mission is to “bring affordable technology education to people everywhere, in order to help them achieve their dreams and change the world.” Changing the world sounds like a modest goal, but it’s become commonplace for sites like these to glorify coding to such an extent that you almost feel guilty not learning how to do it. The hard work and persistence involved in learning these languages is sometimes obscured by the idea that a programming career involves mostly riding around on scooters or jamming out in isolated soundbooths during work hours (take this widely popular video from Code.org, for example).

Still, Treehouse covers all of the major programming languages as well as Android and iOS development, and also provides project-based tutorials such as building a simple Ruby on Rails application or iPhone app. They utilize a badge system to keep users motivated, there’s a forum with helpful moderators and experienced users willing to answer questions, and they recently added a regularly updated job board. Plus, customer service is top-notch, as I’ve never gone more than 24 hours without a receiving a response to inquires.

Learn by doing

If you’re looking for a more hands-on approach, there are certain websites that offer live text editors that allow you to copy and tinker with what you’re learning, and view results in real time.

Codecademy

www.codecademy.com
Free

If there’s one tutorial site you’re already familiar with, it’s probably Codeacademy. Founded in 2011, it pioneered a more interactive method to teaching that was revolutionary at the time. You don’t just watch others input lines of code on a screen. You become the inputter.

This method of teaching is an excellent idea in theory and quite helpful in a vacuum, however, that’s what learning via Codeacademy is — learning to program within the confines of the instructions you’ve been given, making it a tool that’s far more effective when paired with a book or class. Also, be warned: Their Q&A forum is a mess. It’s constantly littered with confused users who get stuck on certain parts of lessons and can’t move onto the next one, and it’s not uncommon for modules to be buggy.

Mozilla Thimble

thimble.webmaker.org
Free

Similar to Codecademy in that you can view your results on a split-screen page, Thimble is another tool that’s pretty good for getting started. There’s no actual instruction, though, it’s merely a static text editor on a page. The difference is that it’s a dedicated page with more room to work with, and it allows users to publish finished web pages right from the site. JSFiddle and CodePen are similar resources, and are great for providing links to your work in forums so others can view your code remotely rather than copy and pasting straight from your editor.

Thimble is just one of Mozilla’s kit of Webmaker tools, which also includes timeline-based video editing software called Popcorn Maker, an app written entirely in web standards that allows non-programmers to create dynamic videos, or edit their current ones, using a host of overlays and web-based sources. For instance, you can embed text, images, pop-ups featuring background information about what’s happening in the video, pull quotes from Twitter or Wikipedia or include a live shot of a Google Map. A lot of what can be done is Javascript-based, so it acts as a nice primer for those interested in learning the language.

Journalism-focused

While the above sites take an “anybody can (and should) learn to code,” approach to web development, other resources are emerging that specifically cater to the aspiring code-savvy journalist.

Code with me

@codewithme
$85 for two-day workshop

Code With Me, co-founded by two Medill alums – New York Times graphics editor Tom Giratikanon and ProPublica news apps developer Sisi Wei – runs two-day workshops in major U.S. cities and promises to “help journalists overcome their fear of code.” Knight Lab sponsored their second workshop in Miami, and the journalists in the area have since started their own Hacks/Hackers chapter and have been hosting weekly open hack nights with the Code For Miami Brigade at one of the city’s co-working spaces called The LAB Miami.

For Journalism

@forjournalism
Cost TBD

For Journalism, a Kickstarter-funded resource, appears to be a promising offering aimed at the “mid-career journalist.” It also features workshops as well as “semester”-long courses (one will be taught by Medill’s own Michelle Minkoff) with innovative topics I’ve yet to see on other sites, like Cybersecurity, Data Science and Statistics and DevOps, as well as many of the usual suspects (Javascript, Ruby, responsive design). Some course outlines are already available on GitHub, and they occasionally post to Twitter with updates about offerings and launch dates (expect the first content to be available in the coming weeks).

A project-based approach to learning

As valuable as these online learning tools can be, there’s a strong feeling within the journalism-tech, hive-mind community that tutorials can only take you so far. I spoke with Lena Groeger, a self-taught designer and science journalist at ProPublica, and she emphasized the importance of having a specific goal or project in mind.

“I think one thing I realized after doing a lot of online tutorials and not really getting it, is that it takes actually making something, even if its small, to really learn anything about coding,” Groeger said. “And it takes longer and is sometimes frustrating, but struggling with a real project is when you really learn.”

Don’t forget YouTube

Let’s face it – learning to make things on the internet can be an expensive venture, with some of the more popular video tut sites asking upwards of $400/year for its services. But it doesn’t have to be. Many people fall into the trap of believing the more they spend, the more they’ll learn (osmosis via credit card). However, there’s an ever-growing library of free tutorials available on YouTube, and it’s a far safer approach if you’re not ready to jump in head first. It may take a some hunting to find a reliable resource, but if you’re okay with a bit less structure, go forth and search, because the videos you’re looking for are probably out there (for a primer in what technologies to learn first, check out this post by Emily Ferber).

However you choose to learn how to make the web, don’t be afraid to ask questions along the way (you will have many). Stackoverflow has emerged as the anointed go-to Q&A outlet because it discourages superfluous discussion, asking users instead to focus on specific questions they’ve encountered. It utilizes a Reddit-esque up-voting system where the best answers to each question rise to the top. And of course, Google makes for a useful companion too.

Sifting through the available options should you choose to traverse down the path to better understand the interwebs can be tricky, if not stiflingly overwhelming business. And while there’s no “wrong” choice, getting started is typically the hardest part. Pressing “play” is an excellent place to begin.

Matthew Gelfand is a Jersey native and Medill graduate student with interests in magazine layout and front-end design. Previously at Urban Daddy, The Improper Bostonian, Circus Media.

This post originally appeared on Northwestern University Knight Lab’s blog.

The Knight Lab is a team of technologists, journalists, designers and educators working to advance news media innovation through exploration and experimentation. Straddling the sciences and the humanities the Lab develops projects, prototypes and innovative bits of code that help make information meaningful, and promote quality journalism, storytelling and content on the internet. The Knight Lab is a joint initiative of Northwestern University’s Robert R. McCormick School of Engineering and Applied Science and the Medill School of Journalism. The Lab was launched and is sustained by a grant from the John S. and James L. Knight Foundation, with additional support from the Robert R. McCormick Foundation and the National Science Foundation.