Skip to content

Getting Started

Before diving in, let's go over some background, installation, and set-up to make sure you have the best experience using Anu.

Background

Anu does not stand alone. To use it effectively, knowledge of web technology stacks is recommended. Here is what you need to know, and what would be nice to know.

Need to Know

  1. The basics of web development - JS/HTML/CSS.
  2. How to set up and use Babylon.js to create 3D scenes and meshes.
  3. What Node.js is and how to use it.

Dive in without these you may find shallow water and angry stack overflow 🧙

Suggested Reading

🔗 mdn Web Docs

🔗 Babylon First Steps

🔗 Babylon Vite Boilerplate

🔗 W3 Schools Node.js Tutorial

Nice to Know

  1. D3 DOM manipulation patterns and visualization utilities.
  2. Web XR API and general concepts, applications, and limitations.
  3. Familiarity with Node.js tooling and bundlers, vite, webpack, etc.

You'll be able to swim without these, but you can always swim faster 🦈

Suggested Reading

🔗 D3 Select

🔗 D3 Scale

🔗 mdn WebXR Fundies

🔗 Vite Getting Started

Installation

We recommend following the Babylon + Vite guide to set-up your Babylonjs project.

Once your project structure is up and running, install Anu.js by building it locally in a different file directory and linking it to your project.

bash
npm install @jpmorganchase/anu

Then import the anu name space

js
import * as anu from '@jpmorganchase/anu';

You can now call Anu methods as such

js
//shape, name, options, data, scene
anu.create('box', 'myBox');

Or Use The Anu-Starter Template

bash
npx @jpmorganchase/anu-starter@latest my_project
bash
cd my_project
npm install
npm run dev

See and modify main.js to get started.