Project Title

MetaGym Web Forum (FrontEnd)

Demo link:

Demo URL

Table of Content:

About The App

[MetaGym Web Forum] is a Single Page Application (SPA) that provides a platform for the fitness community to discuss fitness related topics and build a cohesive community. Individuals who are planning to start a healthy lifestyle could ask experienced members on the platform for tips. For instance, they could ask for ideal workout routines be it in weight-lifting or calisthenics. Moreover, experienced individuals would be able to expand their knowledge from other users as well. An example would be, one could start a discussion about the best and most efficient tricep exercise for hypertrophy. All these are possible through the platform where users could simply create an account and start a discussion or thread and other users could input their opinions respectively. The application also caters to various topics or categories such as body weight exercise, running, weight lifting, power lifting and more.

Screenshots

Landing Page Home Page Thread Page Profile Page

Technologies

Language:
Typescript

SPA Framework & Libraries:
React.js
Redux Toolkit
Reach Hook Form
Material UI
Axios

Tools
Figma
VSCode

Setup

  • Note: Make sure to set up and run [MetaGym Web Forum Backend API] first. Check the MetaGym Backend API Repository
  • After setting up and running the backend api download or clone this repository
  • run yarn to install the project's dependencies
  • create a .env file in the root project directory and add REACT_APP_API_ENDPOINT="<backend-url>" (if backend is ran locally, the url would be "http://localhost:8080" port can vary depening on your local configuration when starting the backend)
  • run yarn start to start the application, assuming the backend is already running.

Status / Features

[MetaGym Web Forum Frontend] currently has the following features:

Authentication System (JWT)
 - Login / Signup
 - Forgot Password (In development...)

Thread Feature
 - View Thread
 - Create Thread
 - Edit Thread
 - Delete Thread

Comment Feature
 - View Thread Comment
 - Create Thread Comment
 - Edit Thread Comment
 - Delete Thread Comment

Interests Feature
 - Thread Categorised into Interests

Search Feature
 - Search a Thread w/ Interests & Title Keyword

Upvote Feature
 - Upvote Thread
 - Downvote Thread
 - Upvote Comment
 - Downvote Comment

Profile Feature
 - View User Profile
 - View User Threads
 - View User Comments (In development...)
 - Edit Profile and Account (In development...)

More features will be out in the future like:
 - Profile Photos
 - Thread Body Formatting and Image support
 - Pagination & Sorting of Thread and Comment List
 - Search Users

Credits

List of contriubutors:

License

MIT license