Ripple screenshot

Ripple

Author Avatar Theme by Dpc sdp
Updated: 8 Jan 2026
61 Stars

Ripple is the frontend framework for Single Digital Presence, delivered using Nuxt and Vue.js

Categories

Overview:

The Ripple project is the presentation layer for building websites on the DPC Single Digital Presence platform. It is built with Vue and Nuxt and provides support for all modern browsers. Ripple components can be published individually as npm packages and imported into any Vue project. There are two ways to use Ripple: without the Tide backend and with the Tide integration for Drupal content backend. Contributing to the project is encouraged and supported by the Digital Engagement department of the Department of Premier and Cabinet, Victoria, Australia. The project is licensed under the Apache 2.0 License.

Features:

  • Vue and Nuxt-based presentation layer for building websites
  • Support for all modern browsers, including IE11
  • Published as individual npm packages for easy import into Vue projects
  • Two installation options: using create-ripple-app or manually adding to an existing Nuxt.js project
  • Component explorer using Storybook and example reference application included

Installation:

To install Ripple without the Tide backend, you have two options:

  1. Using create-ripple-app: This is the easiest way to start a new project from scratch. More details can be found in the packages/create-ripple-app/README.md file.

  2. Manual Installation: If you already have an existing Nuxt.js project, you can add @dpc-sdp/ripple-nuxt-tide as a dependency. This will also automatically add @dpc-sdp/ripple-nuxt-ui as a dependency. Refer to the @dpc-sdp/ripple-nuxt-tide documentation for installation and configuration details.

To use Ripple with the Tide integration for the Drupal content backend, follow the installation guide provided. It includes steps for both new projects and existing Nuxt.js projects.

Summary:

Ripple is the presentation layer for building websites on the DPC Single Digital Presence platform. It provides Vue and Nuxt-based components that support all modern browsers. Ripple can be easily added to any Vue project through npm packages. For installation, there are options for both projects without the Tide backend and those with the Tide integration. Ripple is open to contributions and is supported by the Digital Engagement department. The project is licensed under the Apache 2.0 License.