{"id":32783181,"url":"https://github.com/foobar404/webxr-sdk","last_synced_at":"2026-05-02T20:36:20.751Z","repository":{"id":319106142,"uuid":"1076945259","full_name":"foobar404/webxr-sdk","owner":"foobar404","description":"👾The WebXR SDK, a collection of tools to accelerate VR/AR development on the web.","archived":false,"fork":false,"pushed_at":"2025-11-03T13:20:15.000Z","size":1489,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-11-03T14:29:06.410Z","etag":null,"topics":["aframe","ar","iwsdk","meta","metaverse","threejs","vr","web","webvr","webxr","xr"],"latest_commit_sha":null,"homepage":"https://foobar404.github.io/webxr-sdk/","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/foobar404.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-10-15T14:59:34.000Z","updated_at":"2025-11-03T13:20:18.000Z","dependencies_parsed_at":"2025-10-18T04:47:38.919Z","dependency_job_id":null,"html_url":"https://github.com/foobar404/webxr-sdk","commit_stats":null,"previous_names":["foobar404/aframe-components","foobar404/webxr-sdk"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/foobar404/webxr-sdk","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foobar404%2Fwebxr-sdk","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foobar404%2Fwebxr-sdk/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foobar404%2Fwebxr-sdk/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foobar404%2Fwebxr-sdk/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/foobar404","download_url":"https://codeload.github.com/foobar404/webxr-sdk/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foobar404%2Fwebxr-sdk/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":282733686,"owners_count":26718292,"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","status":"online","status_checked_at":"2025-11-04T02:00:05.887Z","response_time":62,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["aframe","ar","iwsdk","meta","metaverse","threejs","vr","web","webvr","webxr","xr"],"created_at":"2025-11-05T00:00:21.560Z","updated_at":"2026-04-11T20:37:18.052Z","avatar_url":"https://github.com/foobar404.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 😎 Hello XR - \u003ca href=\"https://foobar404.github.io/webxr-sdk/\"\u003eDemo\u003c/a\u003e\n[![npm version](https://img.shields.io/npm/v/create-xr.svg)](https://www.npmjs.com/package/create-xr) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm downloads](https://img.shields.io/npm/dm/create-xr.svg)](https://www.npmjs.com/package/create-xr)\n\nThis repository is meant to be an *easy to use* starter kit of the best / most current 3D and XR libraries on the web, with some of my own contributions as well. Packages such as **AFRAME**, **THREE.js**, the **IWSDK** by Meta, and a few others, all bundled using **Vite**, with a simple `npm create xr` command to generate a template project with all the functionality you would expect from a *modern day game engine*, like physics, locomotion, controller/hand tracking, skyboxes, gltf model rendering, scene editor, XR emulator, and many more. \n\n\u003ca href=\"https://foobar404.github.io/webxr-sdk/\" target=\"_blank\"\u003e\u003cimg src=\"./assets/demo.png\" /\u003e\u003c/a\u003e\n\n# Getting Started\nGet up and running with web xr development with just a few commands!\n\n## Template\nTo create a new Web XR project using the template, use:\n```\nnpm create xr\n```\nYou'll be prompted to name your project and select which components to include.\n\nTo run the project use:\n```\nnpm run dev\n```\n\n## Adding Components\nTo add components to an existing project, run inside your project directory:\n```\nxr add\n```\nOr pass component names directly:\n```\nxr add grab ray-interactor health\n```\nDependencies are resolved automatically.\n\n## Components\nTo import all **AFRAME** components into your project (done automatically when using the template), use:\n```\n\u003cscript src=\"https://cdn.skypack.dev/pin/gh@v2.8.9-pbIyFCSRoTBr23wffpcU/mode=raw,min/foobar404/webxr-sdk@main/components/index.js\"\u003e\u003c/script\u003e\n```\nTo import individual components into your **AFRAME** project use:\n```\n\u003cscript src=\"https://cdn.jsdelivr.net/gh/foobar404/webxr-sdk@main/components/component.js\"\u003e\u003c/script\u003e\n```\nReplace `component` with your desired component, for example the **fly** component would be:\n```\n\u003cscript src=\"https://cdn.jsdelivr.net/gh/foobar404/webxr-sdk@main/components/fly.js\"\u003e\u003c/script\u003e\n```\n\n# Components\n**AFRAME.js** provides the scaffolding to build a powerful XR app, such as **geometry**, **materials** / **textures**, gltf model rendering, **animations**, and more. This project aims to fill the gaps and create a *cohesive development experience*, *similar* to a modern game development workflow that one would have with **Unity** or **Unreal**. *Crucial* missing features for quick **webxr** development include things like **locomotion**, VR UI for things like menus, basic object interactions, **performance** optimization such as model compression, LOD controls, foveated rendering, and many other components one would expect that have for a streamlined XR development workflow.\n\n## Current Components\n- **ability**: Manage *entity abilities* with cooldowns and activation logic\n- **ai-agent**: Basic *AI behavior* with state-driven movement and decision making\n- **area**: Defines a *spatial area* that can trigger events on enter/exit\n- **audio-event**: Plays *audio clips* in response to entity events\n- **basic-geometry**: Helpers for common *procedural geometry* shapes\n- **bullet**: Manages bullet projectiles with *collision detection*, *pooling*, and *target interaction*\n- **checkpoint**: *Checkpoint system* for tracking progress through a level\n- **climbable**: Makes surfaces *climbable* with hand/controller input\n- **collision**: Emits events on *physics collisions* between entities\n- **confetti**: Creates a *confetti effect* with falling particles in waves\n- **cooldown**: Attaches a *cooldown timer* to any action or ability\n- **csg-primitives**: Constructive solid geometry *primitive shapes*\n- **damage**: Applies *damage* to entities with health components\n- **decal**: Adds *decals* (stickers) to surfaces at specified points with texture support\n- **faction**: Tags entities with a *faction* for team-based logic\n- **fly**: Provides *flying movement controls* using VR controllers\n- **fog-volume**: Adds a *volumetric fog* effect to a region of the scene\n- **follow**: Makes an entity *follow* a target with configurable speed and offset\n- **geometry-animation**: Animates *geometry properties* like scale, morph targets, etc.\n- **grab**: Allows entities to be *grabbed and held* with controllers or hands\n- **grab-point**: Defines a *grab attachment point* on an entity\n- **gravity**: Applies *gravity* and *damping* to rigid bodies\n- **groups**: Organizes entities into *named groups* for batch operations\n- **haptics**: Enables *haptic feedback* (vibration) for VR controllers\n- **health**: Tracks *health points* with damage and death events\n- **highlight**: Applies a *highlight effect* to hovered or selected entities\n- **interactable**: Marks an entity as *interactable* for ray or hand input\n- **inventory**: Manages a *player inventory* for picked-up items\n- **joints**: Creates *physics joints* between entities\n- **jump**: Implements *jumping mechanics* for entities\n- **keyboard**: Maps *keyboard keys* to custom events or actions\n- **loading-screen**: Shows a *loading screen* while assets are fetched\n- **melee-hit**: Detects *melee swing hits* and applies damage\n- **nav-agent**: Moves an entity along a *navigation mesh* path\n- **nav-obstacle**: Marks an entity as a *navigation obstacle*\n- **nav-path**: Computes a *path* across a navigation mesh between two points\n- **objective**: Defines *mission objectives* with completion tracking\n- **origin**: Sets the *origin* or reset position for the scene\n- **particle-burst**: Emits a *burst of particles* as a one-shot effect\n- **passthrough-toggle**: Toggles AR *passthrough mode* for mixed reality experiences\n- **path-follow**: Moves an entity along a predefined *waypoint path*\n- **phone-controls**: Provides controls optimized for *mobile phone input*\n- **pickup**: Makes an entity *pickable* and tracks the carrying entity\n- **pool**: Generic *object pool* for reusing entities and reducing GC pressure\n- **projectile**: Fires a *projectile* with velocity, gravity, and damage\n- **pushable**: Allows physics *pushing* of entities with controller/hand contact\n- **ray-interactor**: Casts a *ray* from a controller to interact with interactables\n- **rigid-body**: Defines *physics rigid bodies* with velocity and collision properties\n- **save-game**: High-level *save/load* system backed by save-state components\n- **save-state**: Serializes and restores *entity state* to/from persistent storage\n- **score**: Tracks and displays a *score* with increment/reset events\n- **shooter**: Handles *shooting mechanics* and projectile spawning\n- **smooth-move**: Enables *smooth movement controls* for locomotion\n- **smooth-turn**: Provides *smooth turning controls* for camera rotation\n- **snap-turn**: Implements *snap turning* for VR locomotion\n- **snap-zones**: Defines *magnetic snap zones* that attract held objects\n- **softbody**: Simple *softbody simulation* using vertex displacement\n- **spawner**: Periodically *spawns* entities from a template\n- **special-shaders**: Collection of *custom GLSL shaders* (hologram, dissolve, etc.)\n- **sprite**: Renders a *billboard sprite* with optional animation frames\n- **state-machine**: Drives entity behavior with a *finite state machine*\n- **static-body**: Defines *static physics bodies* that don't move but can collide\n- **status-effects**: Applies timed *status effects* (burn, slow, stun, etc.) to entities\n- **super-keyboard**: Enhanced *keyboard controls* with additional features\n- **swing-movement**: *Arm-swinging* locomotion using controller motion\n- **target**: Creates *interactive targets* for shooting or other interactions\n- **teleport**: *Teleport locomotion* with arc pointer and blink transition\n- **timed-spawner**: Spawns entities on a *timed schedule* with configurable intervals\n- **ui-overlay**: Renders a *2D HTML overlay* panel in world space for menus and HUDs\n- **vignette**: Applies a *vignette visual effect* to the scene\n- **wasd-plus**: WASD movement controls with *additional locomotion features*\n- **weapon**: Combines *shooter*, ammo, reload, and weapon switching logic\n- **world-building**: Tools for *procedural world generation* and block placement\n- **world-grab**: Allows *grabbing and manipulating* objects in the world\n- **zone-trigger**: Fires events when entities *enter or exit* a defined zone\n\n# References\nTo take full advantage of the project it's *necessary* to understand the basics of **aframe.js**, and **THREE.js** to some degree, so here are some links to *important resources*.\n\n- **AFRAME** - https://aframe.io/docs/master/introduction/\n- **THREE.js** - https://threejs.org/manual/#en/installation\n- **IWSDK** - https://developers.meta.com/horizon/documentation/web/iwsdk-overview\n\n# License\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffoobar404%2Fwebxr-sdk","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffoobar404%2Fwebxr-sdk","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffoobar404%2Fwebxr-sdk/lists"}