{"id":13682022,"url":"https://github.com/edwinwebb/three-seed","last_synced_at":"2025-04-30T06:33:22.874Z","repository":{"id":7397078,"uuid":"42938839","full_name":"edwinwebb/three-seed","owner":"edwinwebb","description":"A Three.js starter project with ES6 and Webpack","archived":true,"fork":false,"pushed_at":"2024-01-14T02:48:25.000Z","size":5645,"stargazers_count":405,"open_issues_count":2,"forks_count":80,"subscribers_count":7,"default_branch":"main","last_synced_at":"2024-08-02T13:33:17.120Z","etag":null,"topics":["bootstrap","es6","starter","threejs","webgl","webpack"],"latest_commit_sha":null,"homepage":"","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/edwinwebb.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}},"created_at":"2015-09-22T14:26:15.000Z","updated_at":"2024-06-23T05:36:54.000Z","dependencies_parsed_at":"2024-08-02T13:21:26.965Z","dependency_job_id":null,"html_url":"https://github.com/edwinwebb/three-seed","commit_stats":{"total_commits":223,"total_committers":6,"mean_commits":"37.166666666666664","dds":0.2825112107623319,"last_synced_commit":"35d8c3bd1018fbc307c40658b41e01e69c789870"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/edwinwebb%2Fthree-seed","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/edwinwebb%2Fthree-seed/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/edwinwebb%2Fthree-seed/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/edwinwebb%2Fthree-seed/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/edwinwebb","download_url":"https://codeload.github.com/edwinwebb/three-seed/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224201808,"owners_count":17272647,"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":["bootstrap","es6","starter","threejs","webgl","webpack"],"created_at":"2024-08-02T13:01:39.301Z","updated_at":"2024-11-12T01:30:51.059Z","avatar_url":"https://github.com/edwinwebb.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Three Seed\n\nThree.js starter project boilerplate bundled with Webpack.\n\nThis project is designed to help you get started on your next three.js project. It sets up a simple scene, camera and renderer to view two imported GLTF assets.\n\n[Online Demo](http://edwinwebb.github.io/three-seed/)\n\n## Install\nBefore you begin, make sure you are comfortable with terminal commands and have [Node and NPM installed](https://www.npmjs.com/get-npm). Then either install via a download or with Git.\n\n### Install via Download\nFirst download the [zip of the project](https://github.com/edwinwebb/three-seed/archive/master.zip) and extract it. Then in terminal at that folder type `npm install` to set things up. To get going run: `npm start`.\n\n### Install with Git\nIn terminal clone the project into a directory of your choice then delete the git folder to start fresh.\n\n```bash\ngit clone --depth=1 https://github.com/edwinwebb/three-seed.git my-project\ncd my-project\nrm -rf .git\nnpm install\n```\n\n## Running the development server\nTo see the changes you make to the starter project go to the project folder in terminal and type...\n\n```bash\nnpm start\n```\n\nThis command will bundle the project code and start a development server at [http://localhost:8080/](http://localhost:8080/). Visit this in your web browser; you should see a rotating island and flower.\n\n## Editing the code\nThe first file you should open is `./objects/Scene.js`. In it you will find the three objects comprising the ThreeJS scene represented in your browser. The flower, the island, and the lights illuminating them are each represented as a javascript file in the `./object/` folder. Open these, edit them and see your changes in the browser. If something goes wrong a message will displayed in the debug console of the browser.\n\n## Importing local files\nLocal files, such as images and 3D models, are imported into the application as URLs then loaded asynchronously with three.js. Most common files that three.js uses are supported. For more information about this system see the [webpack site](https://webpack.js.org/).\n\n## Importing modules from the web\nIf you want to add additional functionality to your project, you can search and install them from the [NPM repository](https://www.npmjs.com/). Some modules you might want to consider are...\n* [three-orbit-controls](https://www.npmjs.com/package/three-orbit-controls)\n* [popmotion](https://www.npmjs.com/package/popmotion)\n* [Cannon.js Physics](https://www.npmjs.com/package/cannon).\n\nAdditions like these are best managed in the projects entry file: `./src/entry.js`. In it are the Scene, Camera, Renderer, the window event listeners and the animation loop.\n\n## Using the Three.js Examples\nWhen using this project you might bump into a few issues around using \nthe examples from three.js docs. Most of the common issues have been \nsolved with including NPM packages. However, for more complex examples \nwith custom script includes you might find yourself having to refactor \nthem. See [Issue 15](https://github.com/edwinwebb/three-seed/issues/15) \nfor an example.\n\n## About the models\nBoth the models are loaded by the GLTFLoader and were sourced from the Google Poly project.\n\n\"[Floating Island](https://poly.google.com/view/eEz9hdknXOi)\" by [sirkitree](https://poly.google.com/user/3dVB0GT8oMI) is licensed under CC BY 2.0\n\n\"[Flower](https://poly.google.com/view/9znAp0dJiS8)\" by [Poly By Google](https://poly.google.com/user/4aEd8rQgKu2) is licensed under CC BY 2.0\n\n## Building the project for the web\nOnce you are happy with your project you'll be sure to want to show it off. Running `npm run build` in terminal will bundle your project into the folder `./build/`. You can upload this directory to a web server. For more complex results read [this guide](https://webpack.js.org/guides/production/).\n\n## License\n[MIT](https://github.com/edwinwebb/three-seed/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedwinwebb%2Fthree-seed","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fedwinwebb%2Fthree-seed","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedwinwebb%2Fthree-seed/lists"}