🎮 Gaming-Geeks

📄 Description

Welcome to Gaming Geeks!

This repository is for a gaming chatroom website where you can connect with gamers worldwide on our gaming chatroom website, Where you can chat, share tips, and discuss strategy.

Motivation

We decided to create this gaming chatroom website because we love gaming and wanted to provide a space for fellow gamers to connect and build communities around their shared passion.

User Story

• AS A gamer
• I WANT to have a gaming website where I can browse games
• SO THAT I can chat with other gamers about the games we play

Table of Contents

• Description

• Usage

• Features

• Assets

• Challenges

• Successes

• Future Development

• Credit

🔧 Usage

• Click here to navigate to the live link of this repository.

Feel free to use this account to login that has been created for your convenience:

• Email: bot@email.com
• Password: 12345

---

• When you navigate to the live link above, you are presented with the following page:

---

• You can click on Signup to make an account, or Login if you already have an account:

---

• Once logged in, you will be able to see the following tabs:

---

• Profile tab will welcome you with your logged in username and ask for your favorite games:

---

• Games tab to browse games:

---

• Chat tab with a chatroom layout:

---

• Gamers tab showing all gamers and their favorite games:

---

• Logout tab will ask you for logout confirmation with your logged in username:

---

• Install tab enables you to install the application:

---

🎊 Features

• React for the front end.
• GraphQL with a Node.js and Express.js server.
• MongoDB and the Mongoose ODM for the database.
• Using queries and mutations for retrieving, adding, updating, and deleting data.
• Component library.
• Deployed using Heroku (with data).
• Responsive.
• Interactive.
• Includes authentication (JWT).
• Team-created dataset.
• Installable.
• Favicon.
• Logo.

✨ Assets

Technologies Used

• Component Library: Chakra UI.
• Dataset: We created the Game dataset using resources from SteamDB.
• Applications: VS Code, Heroku, React, MongoDB Compass, GraphQL Sandbox.

Packages

• For a list of all npm packages used in this application, please refer to the package.json files.

Resources

• Logo: Free Logo Design | Remove bg
• Game Images and Descriptions: SteamDB.
• Wireframe: Figma
• Emojis: Emoji Cheat Sheet
• Image Resizer: Simple Image Resizer
• Installation: Here

🌪️ Challenges

• Working with Chakra's default css and implementing our code to render to the page.
• Transition from insomnia to GraphQL Sandbox on the backend

🌟 Successes

• Overcome sandbox challenege and have data work both on backend and frontend.

💡 Future Development

• Enhance UX for the Edit button
• Ensure current page displays when refreshing
• Implement a feature that allows users to follow other gamers.
• Creating a feature that allows users to input their gamertags.

🎖️ Credit

• Bootcamp Instructional Team.
• Bootcamp Materials.
• Bootcamp Video Recordings.

Thank you for visiting! 🎀