2023 Video Game Ranking

Welcome to my 2023 Video Game Ranking project! This web application allows users to rank their favorite video games of the year, vote for top choices, and create personalized favorites lists.

Link to Project:

https://goty-ranking2023.up.railway.app/

2023 Game Of The Year Gif

How It's Made

Tech Stack

  • HTML, CSS, JavaScript: The foundation of the frontend is built using HTML for structure, CSS for styling, and JavaScript for interactivity, creating a visually appealing and responsive user interface.

  • Node.js: The backend is powered by Node.js, providing a robust and efficient server-side environment.

  • EJS: EJS is used as the templating engine to dynamically generate HTML content on the server side, facilitating the rendering of dynamic views.

  • MongoDB: CRUD functionality is implemented with MongoDB, enabling users to add, retrieve, update, and delete their favorite video games.

Building Process

I started by designing a user-friendly interface using HTML and CSS, ensuring a seamless experience for frontend users. JavaScript was then employed to add interactive features, allowing users to rank games, vote, and manage their favorites.

On the backend, Node.js served as the foundation, handling server-side logic and communication with the MongoDB database. EJS templates were used to generate dynamic HTML content, providing a personalized and responsive user experience.

Optimizations (Optional)

Throughout the development process, I focused on optimizing performance to deliver a fast and efficient application. Examples of optimizations include refining database queries for faster data retrieval and implementing client-side caching for improved responsiveness.

Lessons Learned

Building this video game ranking project provided valuable insights into frontend development, backend integration, and database management. Overcoming challenges, such as implementing CRUD functionality and ensuring a smooth user experience, highlighted the importance of meticulous planning and continuous learning.

Installation

  1. Clone repo
  2. run npm install

Usage

  1. run npm run savage
  2. Navigate to localhost:5000