{"id":29196176,"url":"https://github.com/srijan-petwal/hello-cocco","last_synced_at":"2026-05-06T03:35:28.560Z","repository":{"id":302344673,"uuid":"1009192912","full_name":"Srijan-Petwal/hello-cocco","owner":"Srijan-Petwal","description":"my experiments and learnings with threeJs and react-three/fibre. Follow the link below.","archived":false,"fork":false,"pushed_at":"2025-07-01T21:57:38.000Z","size":52261,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-07-01T22:22:57.053Z","etag":null,"topics":["blender","react","reactthree","reactthreefiber","threejs"],"latest_commit_sha":null,"homepage":"https://coccos-world.netlify.app/","language":"JavaScript","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/Srijan-Petwal.png","metadata":{"files":{"readme":"README.md","changelog":null,"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":"2025-06-26T18:17:09.000Z","updated_at":"2025-07-01T21:57:41.000Z","dependencies_parsed_at":"2025-07-01T22:33:04.073Z","dependency_job_id":null,"html_url":"https://github.com/Srijan-Petwal/hello-cocco","commit_stats":null,"previous_names":["srijan-petwal/hello-cocco"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Srijan-Petwal/hello-cocco","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Srijan-Petwal%2Fhello-cocco","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Srijan-Petwal%2Fhello-cocco/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Srijan-Petwal%2Fhello-cocco/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Srijan-Petwal%2Fhello-cocco/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Srijan-Petwal","download_url":"https://codeload.github.com/Srijan-Petwal/hello-cocco/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Srijan-Petwal%2Fhello-cocco/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263083547,"owners_count":23411161,"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":["blender","react","reactthree","reactthreefiber","threejs"],"created_at":"2025-07-02T06:01:02.007Z","updated_at":"2025-10-26T16:03:35.912Z","avatar_url":"https://github.com/Srijan-Petwal.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🧚‍♀️ Cocco's World (More like Hello world😄)\n\u003e[!IMPORTANT]\n\u003e 🧪 A playground of experiments and learnings with `Three.js`, `React Three Fiber`, and `Blender`.  \n\u003e A journey into the world of interactive 3D experiences — one scene at a time.\n\n#### Docker Hub repo\n[![Docker Image](https://img.shields.io/badge/Docker%20Hub-cocco--world-blue?logo=docker)](https://hub.docker.com/repository/docker/srijan5/cocco-world/general)\n\n\n---\n\n## 📸 Screenshots\n\n### 🧚 Scene Preview\n![Scene Preview-1](ScreenShot-2.png)\n![Scene Preview-2](CoccoWorld.png)\n\n\n---\n\n\n\n### 🌐 **Live Demo with Netlify**\n🚀 [coccos-world.netlify.app](https://coccos-world.netlify.app)\n\n## ☁️ **Live Demo with AWS EC2 Deployment**\n\u003e[!NOTE]\n\u003e 🚀 **Now hosted on a custom EC2 instance via Docker!**  \n\u003e This deployment showcases my growing expertise in DevOps — moving beyond platforms like Netlify for a more hands-on infrastructure experience.\n\n🔗 [http://16.171.199.186:3000](http://16.171.199.186:3000)  \n_(Hosted on AWS EC2 — may take a few seconds to wake up if idle)_\n\n---\n\n\n\n### EC2- Instance Screenshot\n\n![EC2 Dashboard](EC2-instance.png)\n\n\n---\n\n\n\n### 💡About Why AWS EC2 Deployment?\n\n- 🛠️ To **learn and practice real-world deployment**.\n- 🐳 Run the app inside a **Docker container** on a **Linux VM**.\n- 🔐 Handle **firewall settings, ports, and SSH access** manually.\n- 🌍 Gain **deeper insight** into how full-stack apps run on the cloud.\n\n---\n\n### 🧪 Tech Stack Used\n\n- Amazon EC2 (Ubuntu)\n- Docker (Containerized deployment)\n- Public IP with exposed port `3000`\n\n\n\n---\n\n### 📦 Deployed Container Command\n\n```bash\ndocker run --restart=always -p 3000:3000 srijan5/cocco-world\n\n```\n\n\n## 🎥 Project Videos\n\n### 🔹 Demo 1: Scene Interaction Preview  \n[🎞️  Watch Demo 1](https://youtu.be/G2m8G8DD-as)\n\n### 🔹 Demo 2: Animation + Tweak Controls\n[🎬  Watch Demo 2](https://youtu.be/UJzaEgI9rnQ)\n\n\u003e[!NOTE]\n\u003eCredit for all the pre-built models goes to their respective creaters.I tweaked them, gave some of them animations and optimized them a bit. All of them are under various free-use licenses.\n\n---\n\n\n\n## 🧠 About\n\nThis project is my personal **3D lab** — a place where I explore:\n\n- 🎨 Loading and animating **Blender models**\n- 🌀 Creating smooth interactions using **React Three Fiber**\n- 💡 Playing with lighting, materials, cameras, shadows, and scene depth\n- 🔁 Learning best practices for structuring 3D components in React\n\n\u003e[!NOTE]\n\u003e If it's 3D and on the web, this is where I tinker with it!\n\n\n---\n## 🚀 Tech Stack\n\n| Frontend | 3D/Rendering | Assets |\n|----------|--------------|--------|\n| `React.js` | `Three.js` | `Blender (GLTF)` |\n| `React Three Fiber` | `Drei` | `Custom shaders` *(LEARNING🧓)* |\n| `JavaScript (ES6)` | `Canvas/WebGL` | — |\n\n---\n\n\n\n## 🛠️ How to Run Locally(try playing with it yourself)\n\n```bash\ngit clone https://github.com/Srijan-Petwal/hello-cocco.git\ncd coccos-world\nnpm install\nnpm run dev\n\n```\n---\n\n\n## 🐳 Now Runs in Docker!\n\n\u003e[!TIP]\n\u003e You can now run the entire project inside a Docker container — no need to install Node, Vite, or any dependencies manually.\n\u003eThis makes previewing the project locally much easier and cleaner. Ideal for sandbox testing, sharing, or running in isolated environments.\n---\n\n## 🧰 What It Takes to Run Locally with Docker\n\nTo run this project locally using Docker, you need just a few things set up:\n\n#### ✅ Prerequisites\n\n- **Docker Desktop installed**  \n  → [Download Docker](https://www.docker.com/products/docker-desktop)  \n- **Working internet connection** (for the first-time image pull)\n\n---\n\n\n\n#### 🚀 Steps to Run in Docker\n\n```bash\n# Pull and run the container\ndocker run -it -p 3000:3000 srijan5/cocco-world\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrijan-petwal%2Fhello-cocco","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsrijan-petwal%2Fhello-cocco","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrijan-petwal%2Fhello-cocco/lists"}