{"id":14990399,"url":"https://github.com/volumetrics-io/mrjs","last_synced_at":"2025-10-06T00:40:53.092Z","repository":{"id":190728209,"uuid":"629348785","full_name":"Volumetrics-io/mrjs","owner":"Volumetrics-io","description":"An extensible WebComponents library for the Spatial Web","archived":false,"fork":false,"pushed_at":"2024-10-11T05:48:25.000Z","size":101679,"stargazers_count":163,"open_issues_count":102,"forks_count":8,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-12T01:05:04.390Z","etag":null,"topics":["immersive-web","javascript","mixedreality","rapier3d","spatialcomputing","spatialweb","threejs","webcomponents"],"latest_commit_sha":null,"homepage":"https://mrjs.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Volumetrics-io.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-18T06:16:42.000Z","updated_at":"2025-03-31T02:18:10.000Z","dependencies_parsed_at":"2025-01-11T05:21:06.175Z","dependency_job_id":null,"html_url":"https://github.com/Volumetrics-io/mrjs","commit_stats":{"total_commits":631,"total_committers":11,"mean_commits":57.36363636363637,"dds":0.6164817749603804,"last_synced_commit":"8b31dbfc30f9c12ba74dd59ca44bde6e7de32f79"},"previous_names":["volumetrics-io/mr.js","volumetrics-io/mrjs"],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Volumetrics-io%2Fmrjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Volumetrics-io%2Fmrjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Volumetrics-io%2Fmrjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Volumetrics-io%2Fmrjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Volumetrics-io","download_url":"https://codeload.github.com/Volumetrics-io/mrjs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248606866,"owners_count":21132430,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["immersive-web","javascript","mixedreality","rapier3d","spatialcomputing","spatialweb","threejs","webcomponents"],"created_at":"2024-09-24T14:20:04.512Z","updated_at":"2025-10-06T00:40:48.049Z","avatar_url":"https://github.com/Volumetrics-io.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![The MRjs logo, an indigo and purple bowtie.](https://docs.mrjs.io/static/mrjs-logo.svg)\n\nAn extensible library of Web Components for the spatial web.\n\n[![npm run build](https://github.com/Volumetrics-io/mrjs/actions/workflows/build.yml/badge.svg)](https://github.com/Volumetrics-io/mrjs/actions/workflows/build.yml) [![npm run test](https://github.com/Volumetrics-io/mrjs/actions/workflows/test.yml/badge.svg)](https://github.com/Volumetrics-io/mrjs/actions/workflows/test.yml) [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/Volumetrics-io/mrjs/blob/main/LICENSE)\n\n[![docs](https://img.shields.io/badge/documentation-8A2BE2)](https://docs.mrjs.io) [![dev-examples](https://img.shields.io/badge/examples-ee99ff?logoColor=white)](https://examples.mrjs.io)\n\n## Branches\n\n- Large refactor of MRjs happening on ![sub-main](https://img.shields.io/badge/sub--main-orange) branch, stay tuned!\n- ![main](https://img.shields.io/badge/main-gray) branch still being used for dependabots and quick fix cleanups\n\n## Overview\n \nMRjs is a mixed-reality-first, WebXR user interface library meant to bootstrap spatial web development. It implements much of the foundational work so that developers can spend less time on the basics and more time on their app.\n\nDesigned to be extensible, MRjs provides a familiar interface via [THREE.js](https://github.com/mrdoob/three.js), the [Custom Elements API](https://developer.mozilla.org/en-US/docs/Web/API/Web_components), [Rapier.js](https://github.com/dimforge/rapier), and our own built-in ECS (Entity Component System) setup.\n\n[[ECS - what is it?](https://docs.mrjs.io/ecs/what-is-it/)] - [[ECS - how we use it](https://docs.mrjs.io/ecs/how-we-use-it/)] - [[MRjs - Creating custom entities, components, \u0026\u0026  systems](https://docs.mrjs.io/ecs/how-we-use-it/#defining-custom-components--systems-in-mrjs)]\n\n## Getting started\n\n### Via HTML Script Tag:\n\nFor the latest stable version:\n\n```html\n\u003chead\u003e\n    …\n    \u003cscript src=\"https://cdn.jsdelivr.net/npm/mrjs@latest/dist/mr.js\"\u003e\u003c/script\u003e\n    …\n\u003c/head\u003e\n```\n\nFor the daily build. No guarantee of stability:\n\n```html\n\u003chead\u003e\n    …\n    \u003cscript src=\"https://cdn.jsdelivr.net/gh/volumetrics-io/mrjs/dist/mr.js\"\u003e\u003c/script\u003e\n    …\n\u003c/head\u003e\n```\n\n### Via NPM:\n\n```sh\nnpm i mrjs\n```\n\n### Via Github Source:\n\n1) [Clone this repository](https://github.com/Volumetrics-io/mrjs) ([github's how-to-clone](https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories))\n\n```sh\ngit clone the.cloning.url\n```\n\n\u003e If you are planning to contribute to this repo instead of just using is as a source you will need its submodules for proper samples and testing:\n\u003e ```sh\n\u003e git clone --recurse-submodules the.cloning.url\n\u003e ```\n\u003e \n\u003e If you've already cloned the repo the normal way (`git clone the.cloning.url`) you can update for the submodule as follows:\n\u003e ```sh\n\u003e git submodule update --init --recursive\n\u003e ```\n\n2) Next, setup your node environment ([make sure node is setup properly](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)):\n\n```sh\nnpm install\n```\n\n3) and now build:\n\n```sh\nnpm run build\n```\n\n## Running the samples and tests\n\n\u003ci\u003eNote for in-headset testing / running of samples: [https requirement](#https-requirement)\u003c/i\u003e\n\n### Samples\n\nThis only works if you're setting this up [via github source](#via-github-source); otherwise, go to [examples.mrjs.io](https://examples.mrjs.io) to try out the samples there.\n\nYou are able to try the samples locally and in headset by running the following:\n\n```sh\nnpm run server\n```\n\n\u003e We serve some of our examples and testing files from submodules, if you are planning to contribute, there will be times when the submodule for your work might be out of date. Since we run scripts along with our submodule update. Run the following to stay up to date:\n\u003e ```sh\n\u003e npm run update-submodules\n\u003e ```\n\n### Tests\n\n```sh\nnpm run test\n```\n\n### Updating Documentation:\n\nCheck [docs.mrjs.io](https://docs.mrjs.io) or our [repository](https://github.com/Volumetrics-io/documentation) for the full documentation.\n\nFor local documentation or to check the local output when writing your own PR to see how it will update, run the below command.\n\n`Note:` the order of creation of docs depends on your operating system, so if when you run this and the order looks different, do not worry - in the repository itself our action will handle that for you and default to use the right version for these automatically generated docs.\n\n```sh\nnpm run docs\n```\n\n### HTTPS Requirement\n\nTo test in headset, WebXR requires that your project be served using an HTTPS server. If you're using Webpack, you can achieve this by utilizing the [Dev Server webpack plugin](https://webpack.js.org/configuration/dev-server/) with `https: true`. \n\nHere are some additional solutions:\n\n- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) for VS Code\n- [via Python](https://anvileight.com/blog/posts/simple-python-http-server/)\n\nBoth options require you generate an SSL certificate and a key via OpenSSL:\n\n```sh\nopenssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvolumetrics-io%2Fmrjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvolumetrics-io%2Fmrjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvolumetrics-io%2Fmrjs/lists"}