Open Journalism Project

Resource(s) to bring code and journalism together for fun

##Contribute?

Yes, we love contributions.

This site is a work in progress, but can ALWAYS use better, improved copy. Also important is continuing to make the list of resources of libraries, tools, and examples more thorough.

The goal is to show the accessible nature of the open web to anyone interested in the intersection of the web and news.

To help contribute first git clone this project. Then in the project directory run:

jekyll serve --watch --baseurl ''

You'll then be able to go to localhost:4000 in your browser to view the site. The above --watch command allows your edits to a page like data.md or _posts.scss to be seen without having to restart the server.

The above --baseurl '' allows the site to run locally without using the github url structure.

To test that everything is working, open up data.md in your text editor and add a sentence to the How We Got Here section. Save the file with your changes, then you should be able to go back to your browser and refresh the page to see the changes.

If you want to submit a pull request with a fix or addition, it's also recommended you fork and create new branches for cleaner work flow.

Content

• 🌍 Mapping

• 📈 Data

• 🙊 Security

• 🔮 Command line tools

• 📷 Media

• 👏 Open source

Mapping 🌍

---

Mapbox

Site: mapbox.com

Github: github.com/mapbox

• Tutorials
  • Mapbox crashcourse
  • Mapbox studio tutorial
• Examples
  • What can you build with Mapbox

Leaflet

Site: leafletjs.com

Github: github.com/Leaflet

• Tutorials
  • Leaflet quick start
  • Lay group and layer control
  • Leaflet on mobile
  • Setting up Leaflet with Basemap
  • Getting started with Leaflet
  • Creating an interactive map with Leaflet and OpenStreetMap
  • Ebook: Leaflet Tips and Tricks
• Examples
  • Holiday lights 2012
  • Where shooting occur in Chicago

Tilemill

Site: mapbox.com/tilemill

Github: github.com/mapbox/tilemill

• Tutorials
  • The insanely illustrated guide to your first data-driven tilemill map
  • Video: Use TileMill with Open Data
  • Cartography with TileMill
  • Digital mapping with TileMill

QGIS

Site: qgis.org

• Tutorials
  • Havard QGIS 2.0 Workshop

OpenStreetMap

Site: openstreetmap.org

Data 📈

---

D3.js

Site: d3js.org

Github: github.com/mbostock/d3

• Tutorials
  • code.minnpost.com/simple-map-d3/
  • Dashing D3.js ebook
  • Official D3.js list of tutorials
• Examples
  • How Obama Won Re-election
  • Racing Against History

Raphael.js

Site: raphaeljs.com

Github: github.com/DmitryBaranovskiy/raphael

• Tutorials
  • An introduction to Raphael JS library, Tutsplus+
  • Intro to Raphael, HTML5 Rocks
  • Raphael JS tutorial part I
  • Using Raphael with SVGs
  • Create a responsive and interactive animation with Raphael.js
  • VIDEO: Raphael Part I Raphael Part II
• Examples
  • Canada map and data
  • Easing with Raphael.js

Kimono

Site: KimonoLabs.com

Github: github.com/kimonolabs

• Tutorials
  • Interactive: Create your first API
  • Web scraping with Kimono Labs
  • Video: Using Kimono

Chart.js

Site: chartjs.org

Github: github.com/nnnick/Chart.js

• Tutorials
  • Build a dynamic dashboard with ChartJS
  • Create animated charts with Chart.JS
  • Getting started with Chart.js
• Examples
  • Thing1

Chartbuilder

Site: quartz.github.io/Chartbuilder

Github: github.com/Quartz/Chartbuilder

• Tutorial

  • How to turn everyone in your newsroom into graphics editors with Chartbuilder
  • How to use Chartbuilder to make simple graphics fast

• Examples

  • Water cleanup commences, New Hampshire Public Radio
  • Bike Sales in Europe, NPR
  • Small business still reeling from credit crunch

Sheetsee.js

Site: jlord.us/sheetsee.js

Github: github.com/jlord/sheetsee.js

• Tutorial
  • About sheetsee.js
  • Sheetsee.js: the basics
  • Jessica Lord on Sheetsee.js
• Examples
  • Mapping hack spots
  • Budget visualization

Tabletop.js

Github: github.com/jsoma/tabletop

• Tutorial

  • Tabletop.js's Github README
  • Why I don't use Tabletop.js in production
  • Using spreadsheets and Tabletop.js as a Web App Backend
  • Web-based data tables with Tabletop.js
  • Creating a styled data project with Tabletop and Handlebars

• Examples

  • Internet Indians, Al Jazeera
  • Mayor Tracker 2013, WNYC
  • Mapsheet
  • You Might Be the 47 Percent If..., Mother Jones
  • Police Departments, Massachusetts
  • Mother Jones News Quiz

Fusion Tables

Site: support.google.com/fusiontables/answer/2571232

• Tutorials

  • Google's Fusion Tables tutorials
  • Mountain Bike trails
  • Mapping population densities by the block
  • Mapping with Fusion Tables
  • Video: Google Fusion Table map visualization tutorial

• Examples

  • Mapping the riots with poverty, Guardian
  • Newspaper Map
  • What's the most congested street in Toronto, Globe and Mail
  • Hurricane zones, WNYC

Other data links

• Comparing Paper.js, Processesing.js, and Raphael.js
• Differences between Raphael.js and D3.js
• Data Journalism Handbook
• Flowing Data: learning R and visualizations

Security 🙊

---

Onionshare

Site: onionshare.org

Github: github.com/micahflee/onionshare

• Tutorials
  • github.com/micahflee/onionshare/blob/master/README.md

SecureDrop

Site: freedom.press/securedrop

Github: github.com/freedomofpress/securedrop

• Tutorials
  • Using SecureDrop with the Washington Post
• Examples
  • The Guardian uses SecureDrop for confidential stories
  • Using SecureDrop with The Intercept
  • Using SecureDrop with ProPublica

Tor

Site: torproject.org

Github: github.com/TheTorProject

• Tutorials
  • Installing Tor on different systems
  • A beginner's guide to Tor
• Examples
  • Who uses Tor?

Cryptocat

Site: crypto.cat

Github: github.com/cryptocat/cryptocat

• Tutorials
  • Video: How to use cryptocat
  • Video: Encrypt your chats with cats

Other security links

• Why King George III Can Encrypt
• minilock.io

Command line tools 🔮

---

youtube-dl

Site: rg3.github.io/youtube-dl

Github: github.com/rg3/youtube-dl

• Tutorials
  • rg3 documentation
  • Downloading videos from Youtube

gifme

Site: github.com/holman/gifme

Github: github.com/holman/gifme

Media 📷

---

Popcorn.js

Site: popcornjs.org

Github: github.com/mozilla/popcorn-js

• Tutorials

  • https://dseifried.wordpress.com/2011/06/28/an-overview-of-popcorn-js-streetview/

• Examples

  • Radiolab
  • Al Jazeera: Internet Indians

Soundcite

Site: soundcite.knightlab.com

Github: github.com/NUKnightLab/soundcite

• Tutorials

  • Soundcite tutorial

• Examples

  • An interview with Chance the rapper, WBEZ
  • Wendy Davis, Washington Post

Open Source 👏

---

Github

Site: github.com

• Tutorials
  • Hello World on Github
  • Git - The simpel guide
  • Git flight rules
  • How to Github
  • Interactive: Try Git

Other resources about open source and journalism

• Mozilla's Source

Canadian news orgs in open source | Github :--------------------------------:| :-----------: | :-----------: Ubyssey | github.com/ubyssey/
Globe and Mail | github.com/globeandmail
Toronto Star |
National Post |

US news orgs in open source | Github :--------------------------------:| :-----------: | :-----------: NYTimes | github.com/nytimes & github.com/nytlabs Knightlab (Northwestern) | github.com/NUKnightLab
Propublica | github.com/propublica
NPR | github.com/npr & github.com/nprapps Chicago Tribune | github.com/newsapps LA Times | github.com/datadesk Texas Tribune | github.com/texastribune Washington Post | github.com/washingtonpost Boston Globe | github.com/BostonGlobe WNYC | github.com/wnyc Columbia U School of Journalism | github.com/jsieben Vox Media | github.com/voxmedia Al Jazeera America | github.com/ajam Time Magazine | github.com/TimeMagazine HuffPost Data | https://github.com/huffpostdata BuzzFeedNews | github.com/BuzzFeedNews FiveThirtyEight | github.com/fivethirtyeight USC Annenberg J-School | https://github.com/uscannenberg