Football Dimes

Football Dimes is a football-themed social media web application built upon the MERN stack.
It allows users to post about their favourite football players, like posts made by other users, get player-specific news, and create sections for discussing players, leagues, and clubs.

🗂 Project Breakdown

1. API Server (Backend)

Directory server

Football Dimes Backend supports the following API endpoints:

View the complete API documentation here.

GET /players

GET /players/:id

GET /players/search

POST /players

POST /players/:id/commentPlayer

PATCH /players/:id

PATCH /players/:id/likePlayer

DELETE /players/:id

Authentication Endpoints:

POST /user/signup

POST /user/signin

2. React Client (Frontend)

Directory client

Features:

1. Complete CRUD functionality

   • Supports create, read, update, and delete (CRUD) operations for player cards.

2. Player profiles

   • Profile features include fetching player-specific news, getting player suggestions, commenting, and more.

3. Search feature

   • Search a player by name / tags.

4. Liking

   • Like / unlike a player card. (Authentication required for liking)

5. Pagination

   • Pagination feature for fast and smooth user experience.

6. Others

   • Player cards support time stamps, edit & delete options, image (base64) & tags, and liking feature. News articles are clickable and direct you to the news source.

3. MongoDB + Mongoose Models (Database)

The website uses MongoDB cloud database for storing the data fields efficiently. Mongoose is used for creating playerCard schema and user schema (for authentication).

🖼 Website Images

▶ Run the project locally

1. Clone the Football-Dimes repository

git clone https://github.com/Aihab1/Football-Dimes.git
# cd into server and client one by one and refer .env.example file to create your own .env file for storing environment variables. Please make sure you complete this step before running the application.

2. Install package dependencies

Open two terminals to run commands parallely.

First terminal (client):

cd client
npm install

Second terminal (server):

cd server
npm install

3. Start development servers

Continue where you left off (two terminals opened).

First terminal (client):

npm start

Second terminal (server):

npm start

Backend server runs on localhost:5000 and the client-side runs on localhost:3000 by default.