https://github.com/deamoner/spatialjs

SpatialJS Core is a powerful library for building spatial applications for the open web.
https://github.com/deamoner/spatialjs

augmented-reality metaverse virtual virtual-reality webxr

Last synced: 3 months ago
JSON representation

SpatialJS Core is a powerful library for building spatial applications for the open web.

• Host: GitHub
• URL: https://github.com/deamoner/spatialjs
• Owner: Deamoner
• License: mit
• Created: 2023-09-23T13:49:51.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-09-04T11:28:45.000Z (4 months ago)
• Last Synced: 2024-10-10T01:02:58.958Z (3 months ago)
• Topics: augmented-reality, metaverse, virtual, virtual-reality, webxr
• Language: TypeScript
• Homepage: https://www.spatialjs.dev/
• Size: 49.5 MB
• Stars: 14
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# SpatialJS Core

SpatialJS Core is a powerful library for building spatial applications for the open web. Leveraging React Three Fiber (R3F), it enables developers to create fully immersive 3D experiences. With SpatialJS, you can easily construct and manage spatial user interfaces, making it an ideal toolkit for developing next-generation web applications, VR/AR experiences, and spatial computing platforms.



  





  

    

  

  

    

  

  

    

  

  

    

  



## Amazing Projects Making SpatialJS Possible:



  


    

      

    

    

      

    

  

  


    

      

    

    

      

    

  

  


    

      

    

    

      

    

  



## Features

- Create and manage 3D windows in a spatial environment

- Intuitive React components for building 3D UIs

- Flexible window management with tiling, focusing, and minimizing

- Support for VR/AR experiences

- Easy integration with React Three Fiber

## What does Spatialjs do?

| Simple Example for a room with a music player | ![render of the above code](./assets/spatialjs-demo.gif) |

| --------------------------------------------- | -------------------------------------------------------- |

## Installation

Install SpatialJS Core and its peer dependencies:

```bash

npm install @spatialjs/core react @react-three/fiber three @react-three/uikit

```

## Quick Start

1. Add the WindowManager to your scene

```tsx

import { WindowManager, createWindow } from "@spatialjs/core";

;

```

2. Add a Window to your scene

```tsx

import { createWindow } from "@spatialjs/core";

const window = createWindow(MusicPlayer, {

  title: "My Window",

  disableBackground: true,

});

```

## Documentation

For detailed usage instructions and API reference, please refer to our [documentation](https://www.spatialjs.dev/).

## Examples

Check out our [examples directory](https://www.spatialjs.dev/examples) for more advanced usage scenarios and demos.

## Contributing

We welcome contributions! Please see our [contributing guidelines](link_to_contributing_guidelines) for more details.

## Support

For questions, bug reports, or feature requests, please open an issue on our [GitHub repository](https://github.com/Deamoner/spatialjs).

---

Built with ❤️ by [Deamoner](https://twitter.com/spatialmatty)

Visit my personal site: [mattydavis.ca](https://mattydavis.ca/)

Subscribe to my [YouTube channel](https://www.youtube.com/@mattjdavis) for more SpatialJS tutorials and updates!

Follow me on [Medium](https://medium.com/@mdavis-71283) for articles on SpatialJS, web development, and more!

Join the discord for more help and support: [discord.gg/tKNwtpDVJn](https://discord.gg/tKNwtpDVJn)