#DataDev Mini-Challenges

Challenge the #DataDev in you!

One of the biggest benefits of joining Tableau’s Developer Program is a free personal developer site. With this site, developers can learn about and test the latest Tableau APIs on the most current version of Tableau. It gives you a safe and secure space away from your production environment to hack on!

Enter the #DataDev Site Challenge; a way to educate and encourage you, our developer community, to do more with your site, discover new ways to use it, and have a little fun along the way.

And obviously, we want to reward you for achieving these challenges with exclusive #DataDav Swag Packs! Check out the challenge (and prizing!) details below.

Let the Games Begin!

There are 18 challenges in total. The challenges will focus on three categories: Extensibility, Automation/Integration, and Embedding. Each challenge category will have three different difficulty levels, each with a corresponding prize. Participants are eligible for one prize at each level. You will have two weeks to solve one or more of each set of new challenges.

At the end of the two weeks, we will host a “How to” webinar to spotlight what someone from the #DataDev community has built before the next new set of challenges are revealed. We can't wait to see what our #DataDev community builds!

The Mini-Challenges

Theme: Embedding

You have until June 29th, 11:59 PM Pacific Time to submit these challenges

Level 1: Learn the basics

Level 2: Select marks and get data

Level 3: Add visualizations to text

Instructions: When starting to use a new API, tutorials are a great way to learn. For this level, you are going to follow along with this tutorial on the JavaScript API. This tutorial is a sample web application, created with Tableau's JavaScript API. It's designed to help you explore and learn about the API using a series of steps that guide you through the basics.

Bonus: The tutorial is using a viz from Tableau Public, try to replace it with a viz published on your Developer Sandbox site.
The JavaScript API lets you get the underlying data for an embedded viz. It is really handy when you want to bring data into other applications or libraries such D3.js to build custom charts. For this challenge, embed a viz from your Developer Sandbox and when a user selects marks, your web page displays the underlying data.

The following is a suggested outline of the steps you could take to solve this. You might have other ideas that are valid and can accomplish the same goals:
For level 3: Group submission. For the level 3 only, you can collaborate on the submission. Four people max by submission.

Telling a story with words is great but imagine saying it with words and data visualization, that would be awesome! In this challenge, you are going to have an HTML page with plain text telling you a story about Superstore and an embedded viz published on your Developer Sandbox. Use the words and numbers in your text to trigger filtering of the viz. For example, when the user clicks on “Tables” in the following sentence “Tables are not profitable”, the viz should filter to show everything in the Tables category.

Hint:
Submission: Send your code and your Developer Sandbox link to developerprogram@tableau.com Send your code and your Developer Sandbox link to developerprogram@tableau.com Send your code and your Developer Sandbox link to developerprogram@tableau.com

Prizes

  • Complete a challenge for level 1, you win a #DataDev sticker pack
  • Complete a challenge for level 2, you win an exclusive #DataDev water bottle
  • Complete a challenge for level 3, you win a 2020 #DataDev t-shirt and beanie
    *Limited one prize per level per participant.

April Agenda

04/06: On your mark, get set, code: First set of challenges published
04/13: Webinar: Extensibility
04/16: Second set challenges published
04/17: First “How To” Developer Spotlight

Useful Resources

Past Mini-Challenges

The Mini- Challenges below were from June 1 to June 15

Theme: Automation & Integration

Level 1: Set Up a Webhook Using Postman Level 2: Create custom workflows triggered by events with Webhooks Level 3: Please tweet every time an extract is failing
Instructions: We released Webhooks in the Tableau 2019.4 release. Webhooks are a common method whereby a computer system can notify another that an event has occurred using standard web technologies such as HTTP and JSON.

In this mini-challenge, you are going to set a Webhook to get notified when a workhook is deleted (API Event Name is: webhook-source-event-workbook-deleted). You can use the Postman Collection that is available here to set it up. For testing the Webhook, you can use webhooks.site, it will let you test Webhook without setting anything up—they provide a free, temporary URL to point to your Webhook.
Now that you set up a Webhooks and tested it, the next step is to build processes and procedures around events happening in your Tableau deployment. In this challenge, you are going to use Webhooks to send a notification when a workbook is created. You can follow this DataDev mini-project and complete one of the challenge exercises. For level 3: Group submission. For the level 3 only, you can collaborate on the submission. Four people max by submission.

When an extract is failing, you want your entire community to know. Using Tableau Webhooks, create a workflow, every time an extract is failing on Tableau Online, send a Tweet with #DataDev out.

Hint:
  • IFTTT, it is a free way to get all your apps and devices talking to each other: https://ifttt.com/

The Mini- Challenges below were from May 18 to June 1
Theme: Extensibility

Level 1 Challenge: Start Dashboard Extensions Tutorial Level 2 Challenge: Finish the Dashboard Extensions Tutorial and implement the show/hide feature Level 3 Challenge: From here to there
Instructions: Tutorials are a great way to get started with a new API and to learn the basics.
Follow the first three steps from our Dashboard Extensions Tutorial: https://github.com/tableau/extensions-api/tree/master/Tutorial
Complete the last three steps from our Dashboard Extensions Tutorial: https://github.com/tableau/extensions-api/tree/master/Tutorial
Once you built the final extension, it’s time to do the happy T-Rex dance (Don’t forget to send us the recording), and implement the show/hide feature. You can use the ZoneVisibilityType enum and setZoneVisibilityAsync method to control whether the objects in a dashboard are visible or hidden. The goal is to hide the extension when the end-user is not selecting any marks.

Hint: Show and Hide Objects in the Dashboard documentation
For level 3: Group submission. For the level 3 only, you can collaborate on the submission. Four people max by submission.

I am here and I need to go there: how many miles/kilometres are between the two points? For this challenge, you need to build an extension that calculates the distance between two selected points on a map in a dashboard. For example, if the end-user selects Mauritius-Seattle, the extension is going to display: 16,973 km.

Hint:


Bonus: Get the driving directions between the two selected points on the map

The Mini- Challenges below were from May 4 to May 18:
Theme: Embedding

Level 1 Challenge: Create a basic embedded page Level 2 Challenge: Spice up your embedded page by adding more functionality Level 3 Challenge: Build your own portal with Tableau recommendations
Instructions: Copy and paste the basic code for JavaScript API on our resource page and replace the embedded dashboard with one of your dashboards on your Developer Site. You can host your code on Glitch for example, or just save it locally on your laptop.
Hint:
Be sure to use the right visualization URL. Go to our Tableau JavaScript API Help here to know more.
One of the benefits of using the JavaScript API to embed your viz in your application is the two-way communication between the viz and your application. Your application can respond to events in the viz, but also the other way around, the viz can respond to events in the application.

For this challenge, you are going to:
  • Add a text zone in the web page that is going to display all the values that are currently set on the filter. For example, if you are using the Superstore dataset, and you have filtering on Category, the web page should display: Furniture, Office Supplies and Technology if all the values are selected.
  • Add a button to clean any filters on your viz.

The following steps are a suggested outline (you might have other ideas that are valid and accomplish the same goals) of the steps you could take to solve this:

  • To add the dynamic text zone:
  1. Solve Level 1: Get a basic embed page working
  2. If you are embedding a dashboard, get all the worksheets on the dashboard. Hint: The JavaScript has a propery getWorksheets() to get the collection of worksheet contained in the dashboard
  3. Get all the filters on the worksheet(s) Hint: The JavaScript API has a method getFilterAsync() that fetches the collection of filters used on the sheet.
  4. Get all the applied values for the filters. Hint: The JavaScript API has a method getAppliedValues() that gets the collection of values that are currently set on the filter.
  5. Display these values in the HTML. Hint: You might want to use the property innerHTML to set the HTML content of an element
  6. Add an event to this button. Hint: The event you want to use it onclick
  7. Apply a filter that adds all values to the filter. Hint: The JavaScript API has a method applyFilterAsync that applies a simple categorical filter.
  • Add cleaning button:
  1. Add a button in HTML. Hint: Button can be defined in HTML using the <button> tag
New for level 3: Group submission. For the level 3 only, you can collaborate on the submission. Four people max by submission.

Build an interface that would display all the visualizations recommended (to the signed-in user) by Tableau. The recommendations will be shown first as thumbnail images. When the users click on a thumbnail, the fully interactive embedded viz (and the power of Tableau’s interactive experience) is displayed and made available for use.

Hint:

The Mini- Challenges below were from April 20 to May 4:
Theme: Automation & Integration

Level 1 Challenge: Sign-in to your site using Personal Access Token (PAT) Level 2 Challenge: Programmatically Build List of Workbook Owners Level 3 Challenge: Programmatically Email the owner of the bad named calculated fields
Instructions: Before doing any request using the REST API or Tableau Server Client (TSC), you will need to sign in to your site.
You can use your username and password or a Personal Access Token (PAT). For this challenge, we want you to use a PAT to sign-in. A sign-in using a PAT returns the same info as a username and password sign-in (a credentials token, site LUID, and user LUID), but without the security risk of exposing hard-coded usernames and passwords, or an interactive login experience.
Hint:
Oftentimes you need to programmatically do things with Tableau or the data & content within Tableau. The level 2 challenge for A&I asks you to figure out all the owners of workbooks on your Tableau site and then use this list as a datasource so that we can build a viz to better understand the owners of workbooks.

The following steps are a suggested outline (you might have other ideas that are valid and accomplish the same goals) of the steps you could take to solve this:
  1. Write a Python script that uses the Tableau Server Client library that:
    1. Sign-in to your site - Check level 1
    2. Requests a list of all the workbooks (and owners) on the site
    3. Writes this list out as a CSV file (hint: https://docs.python.org/3/library/csv.html)
  2. Manually login to your site and:
    1. Connect to this new CSV file on the web (hint: https://help.tableau.com/current/online/en-us/creator_connect.htm)
    2. Create a new viz using your new CSV

Bonus: You don’t have to complete the bonus exercise to validate your submission, but why not challenging yourself a little bit more
Use the Hyper API to create an extract from the CSV file, and use TSC to publish this extract to your site.

New for level 3: Group submission. For the level 3 only, you can collaborate on the submission. Four people max by submission.

Dashboard creators when working on a dashboard create a lot of calculated fields. Sometimes, they forget to rename them and Profit is going to stay forever Calculation1 (name that Tableau gives by default when creating a calculated field). Or while they are testing their calculations, they have 10 ‘test’ fields: test1, test2, etc. Having these badly named fields doesn’t help end users to understand what is the output of the calculations and take space on your site/server.

Build a script that will get all the bad named calculated fields (like Calculation1) and email the owners of these fields to ask them to rename these.

Hint:

The Mini- Challenges below were from April 6 to April 20:
Theme: Extensibility

Level 1 Level 2 Level 3
Mini-challengea: Complete one of these DataDev mini-projects:
- https://github.com/tableau/datadev-hackathon/wiki/Update-a-date-filter-t...
- https://github.com/tableau/datadev-hackathon/wiki/Refresh-All-Data-Sources
Create an extension that allows you to search all fields in a worksheet.
You enter text, and it selects any items in your viz that match that text.
For example, in Superstore 'table' should match the 'Tables' sub-category and 'KI Conference Tables' product name.
Build an extension that writes back to a data source or file. You can pick any data source/file types.
For example, the extension would allow the end-user to update a salesperson's quota.