Skip to main content

Learning H2O Wave - Community Resources

路 8 min read
Michelle Tanco
PM of the AI Cloud @ H2O.ai

This blog is intended to help new users learn and become comfortable with the H2O Wave framework. Use the Overview section for an ordered-list of how to get started, learn more, and get hands on with the capabilities of H2O Wave. Move onto the Examples and Existing Apps to see what鈥檚 possible and being built by other developers. In the Friends of Wave section you can learn about companion libraries which help take your Wave projects to the next level.

Overview#

Setup and Tutorials#

The best way to get started with a product is to read it鈥檚 docs and do some examples. It鈥檚 not always fun or glamorous, but each link below will take 1 to 10 minutes to read/execute and is the best way to get you up to speed on what is possible, where Wave excels, and to have everything running on your local machine.

Have feedback? Documentation is often written by the product experts. Have an opinion on something that is confusing, could be more clear, or is missing? Add a note in the Wave Discussions or feel free to make the changes and open a pull request (PR).

  1. Learn what Wave does
  2. Install the software on your local workstation
  3. Run a pre-built app on your local workstation to have access to over 150 examples
  4. Work through the Hello World, Beer Wall, System Monitor, Bean Counter, and Todo List tutorials

Detailed Guides#

The best way to learn details on the intricacies of a product is to read it鈥檚 docs. It鈥檚 not always fun or glamorous, but each guide topic will take 3 to 15 minutes to read and make you the expert at various topics in the Wave framework.

Start at the introduction and then use the left hand navigation to read through all topics or pick the ones you are most interested in.

  • Architecture
  • Wave Scripts
  • Wave Apps
  • Pages
  • Layouts
  • Cards
  • Data Buffers
  • Components
  • Query Arguments
  • App State
  • Routing
  • Realtime Sync
  • Background Tasks
  • Data-binding
  • Files
  • Plots
  • Javascript
  • Graphics
  • Security
  • Logging
  • Command Line Interface
  • Development
  • Browser Testing
  • Configuration
  • Deployment
  • Backup and Recovery
  • WaveML
  • WaveDB

Straight to the Source#

Once you are feeling like you get how Wave works and what it is good for, it鈥檚 time to find the code. Start by reading the GitHub README which explains more about the project from a technical perspective.

Browse the recent Discussions to get an idea of what types of questions people have. A great way to learn is to teach! Look for an unanswered question, if it鈥檚 a bug and there鈥檚 no reproducible example, make one! If it鈥檚 asking how to do some specific task see if you can make an example.

Checkout specifically the Show and Tell section of the Discussions to get some inspiration for using Wave and best practices. Don鈥檛 forget to contribute to the community and make your own Show and Tell post when you develop something you鈥檙e proud of.

Another great way to learn about a product is to check out the Issues. Read through the suggested features from the community and the new features documented by the Development team to see where the product is going. Again, see a bug ticket with no reproducible example? Make one!

Finally, get details on the entire API from the documentation page to learn what functions are available and the parameters and outputs of each one.

What鈥檚 New#

Another good way of knowing what the product can do is to look at what features are new. Checkout the Change Log for a simple, ordered list. You can also check out the Blog for more news and details on Wave and releases.

See a point in the Change Log or Blog that you want to know more about? Head over to the source code and search for your key word in the Issues, PRs, and generally in GitHub. Then browse the conversations, code, and docs to learn more.

Examples and Existing Apps#

A great way to learn what is possible with H2O Wave is to look at existing apps! Find an app you like? Go to the source code in GitHub, clone the repo, and try running the app on your local workstation. Make some changes to the app and see what happens. Read through the code to learn how it works. Maybe even fix a bug or add a new feature and submit a pull request (PR).

Here is a list of some apps you may want to use as reference:

  • A Tour of Wave - these are 150+ short examples which can be accessed in several different ways
  • Sample Applications - these eight apps can be used as a starting point in your app development journey. Have an idea for how to improve them or streamline the source code or make the code more readable? Make some changes and a PR.
    • Explainable Hotel Ratings: This app allows you to filter hotel reviews and compare the most common phrases from the subset to the overall most common phrases.
    • Guess the Number: This a game where the machine "thinks" of a number and the human has to guess, getting told higher or lower. This application has a leader board where different users can compete to see who can guess numbers in the fewest number of turns, on average. This application teaches the developer about different app states and could be fun for new users.
    • Human-in-the-Loop Credit Risk: This application allows a business user to review model predictions on whether or not someone will pay off their credit card - a model used to approve or deny credit card applications. Specifically, this app provides a list of predictions the model is not confident about (predictions in the 0.4 to 0.6 range) and allows the end user to mark someone as approved or not.
    • Mitigating Churn Risk: This application builds a churn prediction model with H2O-3 and provides the likelihood to churn and actionable recommendations to prevent churn via nicely-presented top shapley values.
    • Online Shopping Recommendations: This application allows a marketing analyst to understand how their recommendation engine works. It allows them to add items to their cart and as they do a list of recommended products is updated.
    • Sales Forecasting EDA: This application provides an easy-to-use interface for exploring historical sales values and looking at future forecasts across store segments.
    • Social Media Sentiment: This application pulls tweets and uses the open source VaderSentiment to understand positive and negative tweets.
    • Big Data Visualizer - This application was started live in a webinar which gives you an idea of both how to build your own apps and also what is possible in an hour once you鈥檙e comfortable with the product. You can learn more about the inspiration for this app in this blog post.

Friends of Wave#

Machine Learning with Wave: WaveML#

WaveML is a companion package to H2O Wave which makes it quick and easy to integrate machine learning models into Wave applications. This is done with a simple, high-level API to train, deploy, score, and explain ML models. This package uses H2O鈥檚 open source AutoML and can optionally use Driverless AI.

Get started by first reading the ReadMe in Github which includes an installation guide to and quickstart example to get started.

Information we have already looked at is pertinent for WaveML, too:

Data Storage with Wave: WaveDB#

WaveDB is a lightweight companion database to Wave, based on SQLite. WaveDB is SQLite with a HTTP interface. It is a ~6MB (~2MB UPX-compressed) self-contained, zero-dependency executable that bundles SQLite 3.35.5 (2021-04-19) with JSON1, RTREE, FTS5, GEOPOLY, STAT4, and SOUNDEX.

If you are already a fan of SQLite, WaveDB acts as a thin HTTP-server wrapper that lets you access your SQLite databases over a network. WaveDB can be used as a lightweight, cross-platform, installation-free companion SQL database for Wave apps. The h2o-wave package includes non-blocking async functions to access WaveDB.

Information we have already looked at is pertinent for WaveDB, too:

  • There is a Guide section on WaveDB which included how to download and install the database
  • Two of the Tour of Wave examples are on WaveDB
  • WaveDB API can be found in the Wave API documentation

Wrapping Up#

We hope that this helps with getting started and learning more about H2O Wave. Use the GitHub discussion board or tag us on Twitter with any questions or reference to what you鈥檙e building!

New in Wave 0.19: Custom Colors

路 4 min read
Martin Turoci
Software Engineer @ H2O.ai

With the latest release, we are excited to announce Wave becoming more colorful! In addition to existing color themes (default, neon) we added h2o-dark and plan on expanding the list to at least a dozen, so stay tuned. If interested, you can track the progress here. However, having only predefined color palettes keeps you from matching your Wave app to your specific color brand, so we have added custom, user-defined palettes.

Wave Workshop - Big Data Visualizer

路 3 min read
Michelle Tanco
PM of the AI AppStore @ H2O.ai

H2O Wave allows for easily building front ends to your projects. I was recently inspired by this tutorial notebook which explains how to use open source H2O-3 for finding anomalies in a dataset. Part of this process is using the H2O-3 aggregator function to visualize relationships in large datasets. A data scientist is at home in a Jupyter Notebook, but we could make it easier for ourselves and analysts or other business users to run this code and benefit from the H2O-3 aggregator function by building a front-end using H2O Wave.

Below you can see our data aggregation and visualization app. Currently, the app itself is creating a 1M row dataset as a demo. We can see that the H2O-3 aggregation function reduces this down into 68 exemplar rows and tells us how many of the original rows fall into each exemplar.

Aggregated data as a table.

Aggregated data as a plot.

Resources#

You can find the full source code for this app on GitHub.

Interested in seeing what it takes to make this type of application? In a 1 hour live-coding session we were able to:

  • Create the layout of our application
  • Create two interactive tabs for navigating in the app
  • Create a table view for a dataset
  • Create a plot view for a dataset

Here's the replay:

Ideas for Improvement#

For this app to be fully useful to our business users, we would probably want to add the following features:

  • Easily add data: allow users to aggregate and visualize on their own datasets
    • File upload from local machine
    • Connect to common SQL warehouses
    • Connect to common cloud data stores like s3
  • Improved backend performance
    • Connect to a production H2O-3 cluster rather than creating a cluster on the local machine of the H2O Wave server
  • Added user control
    • Let the end user decide parameters of the aggregator function like how many exemplar rows to attempt to make
  • Improved and new visualizations
    • Add new visualizations based on different data types
  • Robustness
    • Add unit tests!

If you do decide to work on this project, or use this as a template for your own projects, be sure to tag us on Twitter @h2o_wave or post as a Show and Tell on our GitHub discussions!

New in Wave 0.16: Custom Javascript

路 4 min read
Prithvi Prabhu
Chief of Technology @ H2O.ai

Wave ships with a growing library of cards and components for assembling user interfaces. For most apps, the built-in components can be adequate. They're designed to work well with each other, with consistent typography, layout and theming; and the library of components keeps expanding with each new release.

However, no matter how comprehensive the Wave library gets over time, there will be situations where an app needs to use external Javascript components to supplement Wave's capabilities, like custom visualizations, UI enhancements, and graphics.

Wave 0.16+ allows importing and using third-party Javascript libraries on a page. This provides an escape-hatch of sorts, allowing you to add UI capabilities that are not yet possible with stock Wave.

Introducing Wave ML - AutoML for Wave Apps

路 6 min read
Peter Szab贸
Lead Software Engineer @ H2O.ai

Today, we're excited to announce H2O Wave ML, an open-source extension to Wave that makes it easy to use automatic machine learning in your Wave apps.

$ pip install h2o-wave[ml]

In this article, we look at what Wave ML can do for you, how to get started, and what predictive applications look like in practice.

Routing, Themes and Analytics

路 3 min read
Prithvi Prabhu
Chief of Technology @ H2O.ai

Wave v0.12 shipped last week, with support for handling queries and routes using decorators and experimental support for switching themes. Here's a rundown of the major features.