Dataviz sandbox with D3, React, and R datasets.

1. Install the dependencies:

npm ci

2. Install the LiveReload extension for Chrome, Firefox, Safari.

1. Build a view and open in a web browser:

gulp --view [View]

Views are stored in /src/views. Replace [View] in the aforementioned command with any directory name.

2. Enable the LiveReload extension in the web browser.

Available for macOS, Linux, and Microsoft Windows. Open source.

Download from atom.io.

Plugins can be installed from the command line. To install a few useful ones:

apm install asciidoc-preview atom-jinja2 atom-mermaid atom-typescript chary-tree-view docblockr editorconfig git-control highlight-selected js-refactor language-asciidoc language-markdown language-mediawiki language-nunjucks linter linter-eslint linter-htmlhint linter-js-yaml linter-markdown linter-remark linter-sass-lint markdown-table-formatter minimap minimap-autohide minimap-git-diff [email protected] react refactor

• @vincentarelbundock/Rdatasets - Datasets that were originally distributed alongside R.
• @awesomedata/awesome-public-datasets - Awesome list of public datasets.

• Fundamentals of Data Visualization - Claus O. Wilke - Beginner to advanced level.
• Financial Times Visual Vocabulary - Pick a visualisation type based on the data relationship that's most important.
• IBM Design Language | Data Visualization - Good practices.

• @fasouto/awesome-dataviz - Awesome list of visualisation libraries and resources.
• The Data Visualisation Catalogue - List of visualisation types.
• Data Viz Project - List of visualisation types.
• The Python Graph Gallery - List of visualisation types in Matplotlib, Seaborn and other Python libraries.
• The R Graph Gallery - List of visualisation types in ggplot2.
• Xenographics - List of unusual visualisations.
• A few more: 1, 2, 3, 4, 5
• dataviz.tools - List of tools, resources and technologies for visualisation

TODO

• Can I use... HTML and CSS support table - Browser support for HTML and CSS features.
• ECMAScript compatibility table - Browser support for JavaScript features.
• HTML5 polyfills - Shims, fallbacks and polyfills for HTML5 features.

TODO

• @Famolus/awesome-sass - Awesome list of frameworks, libraries and resources.
• Airbnb CSS/Sass Styleguide - Code style guide.
• Sass Guidelines - Code style guide.

• Eloquent JavaScript - Marijn Haverbeke - Beginner to advanced level.
• You Don't Know JS - Kyle Simpson - Intermediate to advanced level.

• jQuery
• Lodash
• Moment.js
• Numeral.js

• Learn JS Data - Manipulating data with vanilla JavaScript, D3 and Lodash.

• @sorrycc/awesome-javascript - Awesome list of browser-side JavaScript libraries, resources and shiny things.
• Airbnb JavaScript Style Guide - Code style guide.
• Learning Core Javascript (ES5) - Books and sites for learning JavaScript.
• Learning Current Javascript (ES6+) - Books and sites for learning modern JavaScript features.

• Pocket Guide to Writing SVG

• D3.js in Action, Second Edition - Elijah Meeks - Beginner to advanced level.

TODO

• @wbkd/awesome-d3 - Awesome list of D3 libraries and plugins.
• data-ui - React framework on top of vx.
• Semiotic - Opinionated React framework.
• Victory - Opinionated but easily customisable React components.
• vx - Low-level React components that closely follow D3 conventions.

• React docs - Official docs.
• @markerikson/react-redux-links - Quality resources for learning React. Beginner to advanced level.
• @vasanthk/react-bits - React patterns. Intermediate to advanced level.

• Airbnb React/JSX Style Guide - Code style guide.

• Redux docs - Official docs.
• @markerikson/react-redux-links - Quality resources for learning React and Redux. Beginner to advanced level.

• @ghengeveld/react-redux-styleguide - Code style guide.
• Redux Best Practices - Kyle Poole - Best practices in Redux.
• A Simple Naming Convention for Action Creators in Redux.js - Naming conventions in Redux.

Copyright (c) 2017 Hein Bekker. Licensed under the GNU Affero General Public License, version 3.