<p align="center">METAVERSE</p>

<p align="center"> <img src="./images/Metaverse_poster.gif" alt="Metaverse Poster" /> </p> <div align="center"> <p> <a href="https://github.com/ellerbrock/open-source-badges/"> <img src="https://badges.frapsoft.com/os/v1/open-source.svg?v=103" alt="Open Source Love svg1" /> </a> <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat" alt="PRs Welcome" /> <img src="https://api.visitorbadge.io/api/visitors?path=apu52%2FMETAVERSE%20&countColor=%23263759&style=flat" alt="Visitors" /> <img src="https://img.shields.io/github/forks/apu52/METAVERSE" alt="GitHub forks" /> <img src="https://img.shields.io/github/stars/apu52/METAVERSE" alt="GitHub Repo stars" /> <img src="https://img.shields.io/github/contributors/apu52/METAVERSE" alt="GitHub contributors" /> <img src="https://img.shields.io/github/last-commit/apu52/METAVERSE" alt="GitHub last commit" /> <img src="https://img.shields.io/github/repo-size/apu52/METAVERSE" alt="GitHub repo size" /> <img src="https://img.shields.io/github/license/apu52/METAVERSE" alt="GitHub license" /> <img src="https://img.shields.io/github/issues/apu52/METAVERSE" alt="GitHub issues" /> <img src="https://img.shields.io/github/issues-closed-raw/apu52/METAVERSE" alt="GitHub closed issues" /> <img src="https://img.shields.io/github/issues-pr/apu52/METAVERSE" alt="GitHub pull requests" /> <img src="https://img.shields.io/github/issues-pr-closed/apu52/METAVERSE" alt="GitHub closed pull requests" /> </p> </div> <p align="center"> <img src="https://readme-typing-svg.herokuapp.com?color=45ffaa&size=40&width=900&height=80&lines=Welcome-to-the-METAVERSE" alt="Welcome to the METAVERSE"/> </p> <h2>✨ Project Structure</h2>

Check the project structure here Project Structure

<div> <h2>Table of Contents</h2> <ul> <li><a href="#about-metaverse">About METAVERSE</a></li> <li><a href="#announcement">Announcement</a></li> <li><a href="#achievement">Achievement</a></li> <li><a href="#available-projects">Available Projects</a></li> <li><a href="#blog">Blog</a></li> <li><a href="#what-can-you-contribute">What can you contribute?</a></li> <li><a href="#how-to-contribute">How to contribute?</a></li> <li><a href="#how-to-make-a-pull-request">How to make a pull request?</a></li> <li><a href="#quick-docker-setup">Quick Docker Setup</a></li> <li><a href="#project-contributors">Project Contributors</a></li> <li><a href="#license">License</a></li> </ul> </div> <h2>📌 Open Source Program</h2> <h3>This project is now OFFICIALLY accepted for</h3> <p align="center"> <img width="686" height="386" alt="image" src="https://github.com/user-attachments/assets/f876222a-d4a7-4c44-a587-729a3a69e48b" /> <img width="1280" height="720" alt="image" src="https://github.com/user-attachments/assets/4ad13bb0-4241-4e8f-be5f-93a0f4039fcf" /> <img width="700" height="400" alt="image" src="https://github.com/user-attachments/assets/dd66fa2b-b8fe-4633-b083-38f7e723357c" /> </p> <h3>This project was part of the following Open Source Programs</h3> <p align="center">

<img src="https://github.com/user-attachments/assets/8cb642d4-5cf5-4fc9-b979-e6d0597ec897" width="350" height="200" style="margin: 10px;"> <img src="https://github.com/user-attachments/assets/5c3ca05d-0fac-43cc-ada6-0453be9ca0e2" width="350" height="200" style="margin: 10px;"> <img src="https://github.com/user-attachments/assets/8bce67af-b1d9-477f-952a-1bcdcedfc207" width="350" height="200" style="margin: 10px;"> <img src="https://github.com/user-attachments/assets/05ad17cd-64fe-4993-adfc-78c10071b688" width="250" height="200" style="margin: 10px;"> <img src="https://github.com/apu52/METAVERSE/assets/114172928/e79eb6de-81b1-4ffb-b6ed-f018bb977e88" width="700" height="150" style="margin: 10px;"> <br> <img src="https://github.com/apu52/METAVERSE/assets/114172928/f1f1c0d2-f6ef-4a6a-b853-1822dcdcee4e" width="160" height="200" style="margin: 10px;"> <img src="images/Codepeak Pic.png" width="160" height="200" style="margin: 10px;"> <img src="images/KWOC pic.png" width="160" height="200" style="margin: 10px;"> <img src="images/Code collab carnival.png" width="160" height="200" style="margin: 10px;"> <img src="images/hack.jpeg" width="160" height="200" style="margin: 10px;"> </p> <h2 id="about-metaverse">About METAVERSE</h2> Welcome to the "Metaverse Front-End Playground" – your gateway to the future of web development in the metaverse! 🌐🚀 Metaverse Front-End Playground is an open-source repository created to empower developers to explore, innovate, and collaborate in the metaverse space. Whether you're a seasoned developer looking to showcase your metaverse projects or a newcomer eager to dive into the virtual realm, you're invited to join our dynamic community!

We also have a Discord server to discuss doubts and suggestions! Make sure to join it here: <br />

<h2 id="announcement">Announcement 📢</h2>

All of the projects of this repo can be seen in the deployment link in the about section

<h2 id="achievement">Achievement 🏆</h2>

METAVERSE repo has secured a position in top 50 maintainer repositories in QUINE HACTOBERFEST challenge 🏅

<h2 id="available-projects">Available Projects</h2> <table > <tr> <td align="center">S.No</td> <td align="center">Projects</td> <td align="center">S.No</td> <td align="center">Projects</td> <td align="center">S.No</td> <td align="center">Projects</td> <td align="center">S.No</td> <td align="center">Projects</td> </tr> <tr align="center"> <td align="center"> 1.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/AI_Image%20_Generator">AI-Images-Generator</a> </td> <td align="center"> 2.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/API_IMAGES">API_IMAGES</a></td> <td align="center"> 3.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Age_Calculator">Age_Calculator</a></td> <td align="center"> 4.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Amazon-Clone">Amazon-Clone</a></td> </tr> <tr align="center"> <td align="center"> 5.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Analog_Clock">Analog_Clock</a> </td> <td align="center"> 6.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Astronomy">Astronomy</a></td> <td align="center"> 7.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/AudioExtract">AudioExtract</a></td> <td align="center"> 8.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/BMI_Calculator">BMI_Calculator</a></td> </tr> <tr align="center"> <td align="center"> 9.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Bake_website">Bake_website</a> </td> <td align="center"> 10.</td> <td align="center"> <a href="https://github.com/apu52/METAVERSE/tree/main/Projects/Band_Name_Generator">Band_Name_Generator</a></td> </tr> </table>

& many more.......

You can find All the Projects

<h3>Live Project -- https://apu52.github.io/METAVERSE/</h3> <h2 id="blog">Blog</h> <h2>What You'll Discover Here:</h2>

• <h3>Diverse Metaverse Projects:</h3> Our repository features a wide spectrum of metaverse-related front-end projects. From HTML, CSS, and JavaScript to immersive React experiences, you'll find projects that push the boundaries of the metaverse.
• <h3>🤝 Collaboration:</h3> Metaverse Front-End Playground thrives on collaboration. You can enhance existing metaverse projects, contribute new features, or even conjure up entirely new metaverse experiences. Your creative contributions are highly valued!
• <h3>🚀Learning Opportunity:</h3> If you're new to metaverse development, this repository is an excellent launchpad. Collaborate with experienced metaverse developers, gain valuable insights, and immerse yourself in creating groundbreaking virtual worlds.

<h2 id="what-can-you-contribute">What can you contribute?</h2>

• Find All the details in CONTRIBUTING.md before contributing
• Please follow guidelines in Code_of_Conduct.md

<h2 id="how-to-contribute">How to contribute?</h2>

• Drop a Star in this repo
• Take a look at the existing Issues.
• Fork the Repo create a branch for any issue that you are working on and commit your work.
• At first raise an issue in which you want to work
• Please do not make more than 2 issues at a time , Once your PR have been merged only then go for the next issue
• Then when you are get assigned only then work on that issue & make a PR
• Please try to make a separate branch in your fork in case of PR
• Create a Pull Request, which will be promptly reviewed and given suggestions for improvements by the community.
• REMINDER: Commit inside the Projects Folder
• Find the already Existing Projects in the Projects Folder
• Add screenshots or video prototypes to your Pull Request to help us understand the effects of the changes that are included in your commits.

<h2> Installation and Setup</h2> <h3> Prerequisites</h3>

• Node.js
• npm

<h3> Steps</h3>

1. **Clo