Skip to content

A dynamic trivia platform for mastering bash commands, HTML tags, JS keywords, and more!

License

Notifications You must be signed in to change notification settings

opencodeiiita/GrepIt-Frontend

Repository files navigation

GrepIt-Frontend

Frontend for dynamic trivia platform to compete with you buddies with quizes! Challenge yourself, compete with others, and customize your learning experience.

📚 Table Of Contents

🌐 Features:

  • Engage in multiple-choice questions related to bash commands, HTML tags, JS keywords, and more.
  • Track your progress and compete for a spot on the leaderboard.
  • Your personal high-score will be recorded, allowing you to monitor your improvement over time.
  • Provides a stress-free and fun learning environment.
  • Helps you enhance your understanding of these topics.

⚡ Tech Stack:

  • Node.js (v20.5.0)
  • React.js
  • Material-UI

📦 Dependencies:

You need npm/yarn installed in your local machine in order to run this app.

🛠️ How To Setup

  • Make sure your machine is having internet connection.
  • Fork the repository.
  • Open shell (which ever your OS support) on your PC.
  • Change drive to the location where you want your project to be copied.
  • Clone it to your local setup by using command git clone <forked-repo-link>.
  • Once cloned, Run the following command in the root directory of the project npm install.
  • Make sure you have required enviornment variables saved in the .env file in the root of the project. A file .env.example is attached for reference.
  • After the process is completed, run the command npm start.
  • The website will be live on localhost:7777.

Tip

To change port number for the developement of this project for mac users. Kindly refer to this article: https://blog.stackademic.com/how-to-change-the-default-port-number-in-react-react-tips-1a957b54759e

  npm install
  npm start

🔗 Reference Links:

🗺️ Starters

🚀 React

🎨 Tailwind CSS

🎨 Antd

Useful Links from Backend

📁 Directory Structure:

.
├── 🧾 package.json
├── 🧾 package-lock.json
├──  ℹ️  README.md
├── 📁 public
│   ├── 📄 index.html
│   └── 🖼️ favicon.ico
└── 📁 src
    ├── 📁 assets
    │   ├── 📁 images
    │   └── 📁 styles
    │       ├── 📄 index.css
    │       └── 📄 App.css
    ├── 📁 components
    │       └── 📄 WelcomeCard.jsx
    ├── 📁 pages
    │       ├── 📄 CreateRoom.jsx
    │       ├── 📄 Quiz.jsx
    │       └── 📄 Home.jsx
    ├── 📁 services(api)
    ├── 📁 utils
    ├── 📁 hooks
    ├── 📁 routers
    │   └── 📄 AppRouter.jsx
    ├── 📄 App.jsx
    └── 📄 index.js

Note

While adding new files, it is suggested entry here. It will be helpful to new contributors. Make use of chatGPT 😉

👆 Claim an issue:

  • Comment on the issue. In case of no activity on the issue even after 2 days, the issue will be reassigned. If you have difficulty approaching the issue, feel free to ask on our discord channel.

  • Be a champ & don't hesitate if you don't know, just learn on the way and complete it.

  • It is also requested to make your entry in CONTRIBUTORS markdown file before submitting the PR.

💻 Communication:

Whether you are working on a new feature or facing a doubt please feel free to ask us on our discord channel. We will be happy to help you out.

🛡️ License

This project is licensed under the MIT License - see the LICENSE file for details.

📋 Contribution Guidelines:

Please help us follow the best practice to make it easy for the reviewer as well as the contributor. We want to focus on the code quality more than on managing pull request ethics.

  • People before code: If any of the following rules are violated, the pull-requests will be rejected. This is to create an easy and joyful onboarding process for new programmers and first-time contributors.

  • Avoid commiting after opening pull request and name the commit as something meaningful, it is highly recommened to follow.

  • Reference the issue numbers in the commit message if it resolves an open issue. Follow the pattern provided here

  • Provide relevant screenshot/short video for easier review.

  • Pull Request older than 3 days with no response from the contributor shall be marked closed.

  • Avoid duplicate PRs, if need be comment on the older PR with the PR number of the follow-up (new PR) and close the obsolete PR yourself.

  • Be polite: Be polite to other community members.

🤝 Mentors

  1. Bhupesh Dewangan
    Opencode Bot Developer
    The YT demonstrator guy ;-;
    githubID: bhupesh98
    discordID: bhupesh6726

  2. Vatsal Bhuva
    Just an ordinary guy
    githubID: VatsalBhuva11
    discordID: vbx11

💪 Thanks To All Contributors

All the upcoming contributor's github profile image will be displayed here, pick up the best one real quick.

About

A dynamic trivia platform for mastering bash commands, HTML tags, JS keywords, and more!

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published