Weave.js Frontend UI Showcase

Build visual collaborative tools like Excalidraw, Miro, Canva, or Figma!
Explore the docs »

View Demo · Report Bug · Request Feature

About The Project

This repository contain the Weave.js showcase frontend, its a demo application that highlights the features of Weave.js, a collaborative canvas framework. It provides a user interface for:

• 🖼️ Drawing and manipulating visual elements (like shapes, images, and groups)
• 🧑‍🤝‍🧑 Real-time collaboration via shared rooms
• 🧰 Tool usage such as select, transform, move and erase
• 🔄 Undo/redo and action history

This frontend serves both as:

• A reference implementation for developers building on Weave.js
• A live playground to test and iterate with visual + collaborative features

Built With

• Next.js

Related repos

• Weave.js
• Weave.js showcase backend

Quickstart

You can locally launch the frontend showcase by:

• Install dependencies with: npm install

• Create a .env file on the folder /code, and setup the necessary configuration:

  // Azure Web PubSub endpoint name
  NEXT_PUBLIC_API_ENDPOINT_HUB_NAME=weavejs
  // Weave.js backend endpoint (proxied through Next.js)
  NEXT_PUBLIC_API_ENDPOINT=/weavebff/api/v1
  // Real Weave.js backend endpoint
  BACKEND_ENDPOINT=http://127.0.0.1:8081
  

• Run the frontend: npm run dev

You'll need access to a Azure Web PubSub instance.

License

This project is licensed under the terms of the Apache-2.0 license.

© 2025 INDUSTRIA DE DISEÑO TEXTIL S.A. (INDITEX S.A.)

(back to top)