{"id":15019018,"url":"https://github.com/solidjs-community/solid-three","last_synced_at":"2025-08-13T18:34:34.677Z","repository":{"id":55250234,"uuid":"484911750","full_name":"solidjs-community/solid-three","owner":"solidjs-community","description":"port of @react-three/fiber for solid","archived":false,"fork":false,"pushed_at":"2025-08-12T10:22:58.000Z","size":1895,"stargazers_count":158,"open_issues_count":8,"forks_count":16,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-08-12T12:21:14.859Z","etag":null,"topics":["react-three-fiber","solid","solidjs","threejs","webgl","webxr"],"latest_commit_sha":null,"homepage":"https://solid-three.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/solidjs-community.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"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}},"created_at":"2022-04-24T03:10:42.000Z","updated_at":"2025-08-10T21:47:33.000Z","dependencies_parsed_at":"2024-04-17T17:24:07.747Z","dependency_job_id":"70745999-f364-4382-a7a8-05aa06f677a4","html_url":"https://github.com/solidjs-community/solid-three","commit_stats":{"total_commits":36,"total_committers":3,"mean_commits":12.0,"dds":0.25,"last_synced_commit":"dd794de156e6cf3868779d4cabb0ac1ec7dcfbca"},"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"purl":"pkg:github/solidjs-community/solid-three","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/solidjs-community%2Fsolid-three","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/solidjs-community%2Fsolid-three/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/solidjs-community%2Fsolid-three/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/solidjs-community%2Fsolid-three/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/solidjs-community","download_url":"https://codeload.github.com/solidjs-community/solid-three/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/solidjs-community%2Fsolid-three/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":270288760,"owners_count":24558854,"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-08-13T02:00:09.904Z","response_time":66,"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":["react-three-fiber","solid","solidjs","threejs","webgl","webxr"],"created_at":"2024-09-24T19:52:46.754Z","updated_at":"2025-08-13T18:34:34.569Z","avatar_url":"https://github.com/solidjs-community.png","language":"TypeScript","readme":"\u003cp\u003e\r\n  \u003cimg width=\"100%\" src=\"https://assets.solidjs.com/banner?type=solid-three\u0026background=tiles\u0026project=%20\" alt=\"solid-three\"\u003e\r\n\u003c/p\u003e\r\n\r\n# solid-three\r\n\r\n[![pnpm](https://img.shields.io/badge/maintained%20with-pnpm-cc00ff.svg?style=for-the-badge\u0026logo=pnpm)](https://pnpm.io/)\r\n\r\nSolid-three is a port of [React-three-fiber](https://github.com/pmndrs/react-three-fiber) to [SolidJS](https://www.solidjs.com/),\r\noriginally created by [Nikhil Saraf](https://github.com/nksaraf).\r\nIt allows you to declaratively construct a [Three.js](https://threejs.org/)\r\nscene, with reactive primitives, just as you would construct a DOM tree in SolidJS.\r\n\r\n\u003e **Note** This library has just been published to NPM from this repo.\r\n\u003e It is still in early development, and is not yet ready for production use.\r\n\u003e Please feel free to try it out and report any issues you find!\r\n\r\n## Quick start\r\n\r\nInstall it:\r\n\r\n```bash\r\nnpm i solid-three\r\n# or\r\nyarn add solid-three\r\n# or\r\npnpm add solid-three\r\n```\r\n\r\nUse it:\r\n\r\n```tsx\r\nimport { Canvas } from 'solid-three'\r\n```\r\n\r\n### Dev Container\r\n\r\nIf you are using VSCode on windows (or just prefer to develope in a container), you can use the included dev container to get started quickly.\r\n\r\n1. Clone this repo to a directory _inside of your wsl instance_ such as `~/Github`\r\n2. Navigate to the `solid-three` directory and run `code .`\r\n3. Open the workspace from the provided file.\r\n4. Make sure the [DevContainers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers) extension is installed Click the bottom left corner of the window and select `Reopen in Container` - if the extension is installed, vscode should prompt you to open the project in a dev container when you open the workspace file.\r\n\r\n#### Dev Container Notes\r\n\r\n- We clone into the `wsl` instance because the dev container is running a linux container, and the windows filesystem will cause extreme performance loss due to IO overhead.\r\n- If you are using a different shell, you may need to modify the `devcontainer.json` file to use your shell of choice.\r\n- A port will automatically be forwarded when you run the project in dev mode, so you can access the dev server from your browser on windows at `localhost:\u003cport\u003e` - the port will be displayed in the terminal when you run the project. This can be configured by you as well.\r\n\r\n## Documentation\r\n\r\n\u003e **Note**: Coming Soon!\r\n\r\n## Sample Applications\r\n\r\n\u003e **Note**: More Coming Soon!\r\n\r\n### solid-three-template\r\n\r\nThis is a template for a SolidJS application that uses solid-three.\r\n\r\nThis project is a bare-bones `Vite` project that has been configured to use `SolidJS`, `solid-three`, and `ESLint` with `Prettier` for formatting.\r\n\r\n[solid-three-template](https://github.com/ZanzyTHEbar/solid-three-template)\r\n\r\n## Contributing\r\n\r\n\u003e **Note**: Coming Soon!\r\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsolidjs-community%2Fsolid-three","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsolidjs-community%2Fsolid-three","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsolidjs-community%2Fsolid-three/lists"}