https://github.com/panaverse/metaverse-web
Learn to Build Open Metaverse on the Web.
https://github.com/panaverse/metaverse-web
threejs typescript webgpu webxr
Last synced: over 1 year ago
JSON representation
Learn to Build Open Metaverse on the Web.
- Host: GitHub
- URL: https://github.com/panaverse/metaverse-web
- Owner: panaverse
- License: mit
- Created: 2022-08-23T08:23:59.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-09-20T11:16:12.000Z (almost 4 years ago)
- Last Synced: 2025-03-20T14:40:19.197Z (over 1 year ago)
- Topics: threejs, typescript, webgpu, webxr
- Homepage:
- Size: 47.9 KB
- Stars: 38
- Watchers: 2
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Learn to Build Open Metaverse on the Web
Curious about what Web 3D is capable of in the hands of seasoned developers? Here are some examples from around the web:
[Bruno Simons interactive portfolio](https://bruno-simon.com/)
[Cineshader](https://cineshader.com/)
[Ouigo Let’s Play](http://letsplay.ouigo.com/)
## Open Metaverse
[The Metaverse is the Web](https://www.etherealengine.com/blog-posts/the-metaverse-is-the-web)
[How the Open Metaverse Will Transform Our Online Identities](https://thenewstack.io/how-the-open-metaverse-will-transform-our-online-identities/)
[Web 3D, not Web 3.0](https://alexstlouis.medium.com/the-metaverse-or-should-i-say-the-immersive-web-b5bf7dcf6651)
## Getting Started with Three.js and TypeScript
[Explaining basic 3D theory](https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_on_the_web/Basic_theory)
[Learn Three.js - Fourth Edition, will be our textbook when available](https://www.packtpub.com/product/learn-three-js-fourth-edition/9781803233871)
[Three.js Manual](https://threejs.org/manual/#en/fundamentals)
[ThreeJS Roadmap](https://github.com/Chamepp/3D-Web-Roadmap)
[Learn Three.js for Games using TypeScript (modern way)](https://www.youtube.com/watch?v=p4BHphMBlFA)
[Three.js Types](https://www.npmjs.com/package/@types/three)
[Three.js TypeScript Boilerplate](https://github.com/Sean-Bradley/Three.js-TypeScript-Boilerplate)
## 3D Modeling
[Sketchfab](https://sketchfab.com/) is a 3D modeling platform website to publish, share, discover, buy and sell 3D, VR and AR content.
## Three.js with Next.js
[How to use ThreeJS in React & NextJS](https://dev.to/hnicolus/how-to-use-threejs-in-react-nextjs-4120)
[How to build a portfolio website using Next.js, Chakra UI, Framer Motion, and Three.js](https://www.youtube.com/watch?v=bSMZgXzC9AA)
[Load animated GLTF models in Next.js app with Three.js](https://oslavdev.medium.com/load-animated-gltf-models-in-next-js-app-with-three-js-8cf0a5d99e10)
## Three.js Learning Material
[Discover Three.js](https://discoverthreejs.com/book/)
[3D-Web-Roadmap](https://github.com/Chamepp/3D-Web-Roadmap)
## WebXR with Three.js
[Get started with Augmented Reality on the web using Three.js and WebXR | Part 1](https://medium.com/sopra-steria-norge/get-started-with-augmented-reality-on-the-web-using-three-js-and-webxr-part-1-8b07757fc23a)
[Get started with Augmented Reality on the web using Three.js and WebXR | Part 2](https://medium.com/sopra-steria-norge/get-started-with-augmented-reality-on-the-web-using-three-js-and-webxr-part-2-f10861cd1f1d)
[WebXR](https://immersiveweb.dev/)
[WebXR Resources](https://github.com/msurguy/awesome-webxr)
## WebGPU
[Web GPU Rocks](https://webgpu.rocks/)
[Awesome WebGPU](https://github.com/mikbry/awesome-webgpu)
There is a new type of Three.js renderer called WebGPURenderer for working with the WebGPU API.
[Three.js WebGPU Examples](https://threejs.org/examples/?q=webgpu)
[WebGPU Resources](https://github.com/mikbry/awesome-webgpu)
## Metaverse using Three.js
[How to Code a Metaverse with Three.js](https://www.youtube.com/watch?v=99KxEdLMT3g)
[Webaverse](https://docs.webaverse.com/docs/index)
## WebRTC for the Metaverse
[How WebRTC Is Driving New and Interesting Use Cases for the Metaverse](https://subspace.com/resources/webrtc-use-cases-for-the-metaverse)
[WebRTC Audio in the Metaverse](https://www.webrtcworld.com/topics/from-the-experts/articles/452651-webrtc-audio-the-metaverse.htm)
[WebRTC Trends for 2022](https://bloggeek.me/webrtc-trends-for-2022/)
[100ms](https://www.100ms.live/)
[Video and Audio conferencing in few minutes with React](https://blog.openreplay.com/video-and-audio-conferencing-in-few-minutes-with-react)
[Building a Video Chat App with Next.js, 100ms, and TailwindCSS](https://blog.openreplay.com/building-a-video-chat-app-with-next-js-100ms-and-tailwindcss)
[Cracking a web based metaverse experience with WebRTC](https://www.youtube.com/watch?v=_QPentc_Gv4)
Note: WebCodecs + WebTransport + WebAssembly can be viewed as a WebRTC replacement in some use cases.
## Y.js
[Watch CRDTs for Non Academics](https://www.youtube.com/watch?v=vBU70EjwGfw)
[Conflict-free replicated data type](https://en.wikipedia.org/wiki/Conflict-free_replicated_data_type)
[CRDTs solve distributed data consistency challenges](https://ably.com/blog/crdts-distributed-data-consistency-challenges)
[I was wrong. CRDTs are the future](https://josephg.com/blog/crdts-are-the-future/)
[Y.js](https://github.com/yjs/yjs)
[Docs](https://docs.yjs.dev/)
[CRDT Implementations](https://crdt.tech/implementations)
[Yjs Blogs](https://www.tag1consulting.com/yjs-podcasts-blogs-conference-presentations-more)
## Tools, Libraries, and Frameworks for Metaverse Development
[Top 7 Open-Source Tools and Frameworks for Metaverse Development](https://www.itprotoday.com/software-development/top-7-open-source-tools-and-frameworks-metaverse-development)
[Awesome Threejs](https://github.com/0xAxiome/awesome-threejs)