Big List of Resources for Design, Data & Code

Overall

The Data Institute curriculum, a workshop on using design, data and code for journalism.

Big list of tutorials, slides and other links from NICAR 2015, 2016, 2017, 2018, 2019, 2020-2024.

Communities & Conferences

News Nerdery

NICAR, the NICAR-L listserv & the IRE/NICAR training events and conferences

Hacks/Hackers, which has meetup groups all over the country (and world!)

OpenNews, a community of developers, designers, journalists and editors.

Lonely Coders’ Club Slack

SOURCE, an OpenNews publication that features journalism code and how-to's.

SRCCON, the OpenNews conference

Learning to Code

Where Do You Learn HTML & CSS in 2020?

Just Starting Out with CSS & HTML

Interneting is hard: Friendly web development tutorials for complete beginners

Something I wrote about learning to code

Code with Me workshops, cheat sheets & online exercises

Make a Website From Scratch

Don't Fear the Internet Video Series

HTML Beginner Tutorial

CSS Beginner Tutorial

Intro to Web Fundamentals by Scott Murray

Understanding Git – Explain it Like I’m Five

Ten Lessons I Learned While Teaching Myself To Code from Clive Thompson

Data Visualization: Overview

Data Viz Project

The Data Visualization Catalog

Three Gifs for Better Data Viz

Data Visualization Pitfalls

How Dataviz Can Unintentionally Perpetuate Inequality: Part 1, Part 2 and Part 3

Data Visualization: Tools

One Chart, Twelve Tools

One Chart, Twelve Charting Libraries

Datawrapper

Flourish

iNZight

Quartz Atlas

RAW Graphs

Mapbox

Google Maps

Timeline JS

StoryMap JS

Juxtapose JS

Data Visualization: Inspiration

Flowing Data, especially the Chart Types section.

The Functional Art

Visualising Data

Axios Visuals

NY Times Graphics

Washington Post Graphics

Bloomberg Graphics

Data Visualization: D3

How to Learn D3.js with No Coding Experience

Scott Murray's D3 Tutorials

The D3.js Graph Gallery

Learn D3 for free

The Hitchhiker’s Guide to d3.js

Let’s Make a Bar Chart (in D3) with divs and svgs

Binding Data in D3, an explanation here and here

Web Scraping

Getting Data Without (Much) Code

Import.io

Tabula: Getting Data out of PDF's

Extract an HTML table to Google Docs

Collect data from anywhere with Google Sheet's ImportXML function

Step-by-step guide to writing a web scraper with Python

Data & Excel

A guide from David Eads on how to 'interview' a big pile of data

A few of my own tutorials on Google Spreadsheets, Excel, and more Excel

MaryJo Webster's data journalism training materials, including Excel Magic: Tips and Tricks (here's the data to go with it)

Free & Cheap Tools for Wrangling Data

Explore Census Data

Census Reporter

Parserator: Parse addresses, names & more

Mr. Data Converter: Convert your Excel data into HTML, JSON or XML

Dedupe.io: De-duplicate and find matches in your Excel spreadsheet or database

Open Refine

Design

Clean Up Your Mess: A Guide to Visual Design for Everyone

The curriculum for my Design for Journalists class

Design Principles for News Apps and Graphics

The Non-Designers Design Book

A 20 Minute Intro to Typography Basics

Thinking with Type

Web Design is 95% Typography

Grid Anatomy

Adobe Kuler

Color Oracle

Color Brewer

Designer Rob Weychert on making color decisions

Colorgorical: a color palette generator

Viz Palette: Tester for color palette legibility

Illustrator/Photoshop

Illustrator Basics: A Tutorial

Illustrator Tools

Photoshop Tips & Tricks

Let's Make Some Animated Gifs

I update and add to this list often. If you have questions or suggestions, feel free to get in touch: @lenagroeger