Study Resources App

Study Resources App Screenshot

Description

The Study Resources App is an application that allows users to view and submit study resources recommended by other students. Users can search for resources, like, dislike, and comment on them, as well as add resources to their favorites section.

This project was developed as part of an immersive online training program in full-stack development and leadership training at Academy.

Features

  • View a list of study resources with likes, dislikes, and comments.
  • Search for resources by title, author, or summary.
  • Like, dislike, and comment on resources.
  • Add resources to favorites for easy access.
  • Submit new study resources with relevant details.

Tech Stack

  • Frontend: React, React Router, TypeScript, Bootstrap, React-Toastify
  • Backend: Node.js, Express.js, PostgreSQL
  • End-to-End Testing: Cypress

Technical Documentation

Architecture

The Study Resources App follows a client-server architecture, with a React-based frontend interacting with a Node.js and Express.js backend. The frontend communicates with the backend using RESTful API calls to fetch and update data.

Architecure Diagram

API Documentation

The API endpoints weere documented on notion. It provides details about the available routes, request parameters, and response formats.

API Documentation

Wireframes

The wireframes for the Study Resources App were designed using Figma.

Figma Wireframes

Database Model

The database model can be found on this Figma file. The relational database was designed to be normalised and consists of 12 different tables.

Project Board

The project board can be found through this link

Backend Repository

The backend code for the Study Resources App is available in a separate repository. You can find it here.