Build Interactive Data Visualization Tools in the Cloud
WHEN
2nd - 6th of July 2018
WHERE
Botanisches Museum, Königin-Luise-Straβe 6-8, Berlin (Germany)
Instructors:
- Dr. Maria Nattestad (Scientific visualization lead at DNAnexus. Founder of OMGenomics USA)
- Dr. Robert Aboukhalil (Sr. Bioinformatics Software Engineer GenapSys, Inc., USA)
Overview
This course is a bootcamp in bioinformatics web development. By the end of the course, students will have built their own interactive data visualization web applications in the Cloud, to be shared with a global community of scientists.
Targeted Audience & Assumed Background
This course is aimed at scientists who have some knowledge of bioinformatics and are interested in building bioinformatics software for the web.
Prerequisites
Some programming experience in any language is required. We will be giving an introduction to JavaScript assuming that you know another language well enough to be comfortable with variables, for loops, if statements, and other common programming concepts. Prior to the course, give some thought to the kinds of data visualization tools that could help your own field of research.
Session content
Monday 2nd. 09:30-17:30
Session 1: Introduction to 21st century bioinformatics.
In this first session, we will give an introduction to the course and highlight emerging trends in bioinformatics that are already impacting how science is done. We will have a group discussion about how these topics will influence students' respective fields of research, and brainstorm specific problems that we can attempt to solve with data visualization during this course.
Session 2: Kicking off the team projects
Students will form teams of 3-4 people and decide on a data visualization web application to build for the week.
Session 3: Introduction to Cloud computing
We will give an introduction to Cloud computing concepts, including virtual machines, compute, storage, and how to get started on the Google Cloud Platform (GCP). Then students will create accounts on GCP, create their first file storage buckets, and launch a virtual machine.
Tuesday 3rd. 09:30-17:30
Session 4: Setting up a web development environment
We will give an introduction in the form of a lecture followed by a practical on hosting a website on the Cloud, setting up a git repository, creating files with Cloud Shell Editor, and building your first Hello World website in HTML.
Session 5: Web development with HTML, CSS, Bootstrap, and JavaScript
We will introduce front-end web development with the core languages HTML, CSS, and JavaScript. Then students will create a basic layout in HTML with a button, style it with CSS and Bootstrap, and finally create an event listener in JavaScript that changes text when the button is clicked. This will be the basis of the UI for our team visualization projects.
Wednesday 4th. 09:30-17:30
Session 6: Designing visualization tools
We will give a lecture on the central concepts in visualizing data, introducing best practices. We will also discuss the value of working with real data when designing useful ways to display data. Students will then find sample data and design plots to fit.
Session 7: Working with data
We will give an introduction to working with JavaScript FileReader for loading data, and PapaParse for parsing data in various formats. Then students will use these in their team projects to shape data and deal with any input issues introduced by specific bioinformatics file formats.
Thursday 5th. 09:30-17:30
Session 8: Creating plots using JavaScript
We will introduce students to drawing plots in the browser using JavaScript libraries such as plotly.js. After the lecture, teams will add their first plot to their project.
Session 9: Finalize Projects
Students will work in teams to finalize their projects.
Friday 6th. 09:30-17:30
Session 10: Present Projects
Students will present the projects they developed during the course.
Session 11: Advanced Topics in Web Development
In this session, we tie a few loose ends, including how to set up a domain name, and will cover advanced topics in web development. This includes an introduction to backend development for launching data analyses and advanced cloud concepts, including Cloud Functions and Preemptible Instances. Finally, we will end with a brief overview of using Electron to port web applications to the desktop.
