Recovery Ventures

This repository holds a React app and an Express app used for the Recovery Ventures website

This repository is not being actively maintained and has known security vulnerabilities so it is being archived. Knwon vulnerabilities:

• http-cache-semantics - CVE-2022-25881
• sequelize - multiple vulnerabilities
• dns-packet - CVE-2021-23386

How to Run Recovery Ventures

On the MHC network

From Mount Holyoke's network, you should be able to access the Recovery Ventures website by simply clicking this link

Note: In order to use the account setup feature on the MHC hosted version of the website, you need to use the pin "456" for a mentor account.

Alternative Access

If you are not on the Mount Holyoke network, you will need to clone this repository, and run the code locally on your machine. To do this, follow the steps outlined below:

1. Clone the main branch of this repo to your machine. (How to Clone a Github Repo)
2. From inside the directory you just cloned (cs-316-project-primespiders), navigate to the Backend folder: cd Backend
3. Inside of Backend, run npm install.
4. If MariaDB is already installed and the database is set up, then skip these steps. Otherwise, do the following:
   • Install MariaDB (tutorial)
   • Login to MariaDB with “mariadb -u root -p” and then enter your password.
   • Create a new database “CREATE DATABASE dbName;”
   • In the Backend folder, create a .env file with the following environment variables: MYSQL_HOST=localhost, MYSQL_USER=yourUserName, MYSQL_PASSWORD=yourPassword, MYSQL_DB=dbName
5. Once all dependencies have finished installing inside the Backend folder, run 'npm start'
6. You should now be able to access the site from http://localhost:9000/. Note that once the site is running, you will need to have pins in the database to allow for the account creation feature. In order to add pins to the database, send an HTTP PUSH request to “http://localhost:9000/pins” with a JSON body containing, for example: { "account": "mentor", "num": "some number" }

Directory Structure

Frontend

Frontend contains 3 folders: the node_modules folder, the public folder, and the src folder. Src contains most of the code required to run the frontend. In the Frontend src folder is the Pages folder, which has the javascript react components that return the html elements for each page of the website. The html elements for static pages are listed all in one file, titled StaticPages.js. The Layout.js page describes which elements will be included in every page, namely the navigation bar, footer, and one element between the two to be determined by the specific page. The navigation bar is defined directly in the Layout page, connecting the links in each drop-down button to the elements for other pages. Src contains a store folder, which holds the files related to redux. There is one file defining the action and reducer for the global logged-in state. Also in the Frontend src folder is App.js and index.js, which serve as an entry point to the website, and two stylesheets. App.js defines the various routes for the website. Index creates the redux store and renders the app. The frontend public folder is automatically generated by create-react-app, and it includes the index.html file. This is the file that is eventually passed to the browser, after the correct code is injected into it using index.js and App.js.

Backend

The backend folder contains bin, config, controller, models, node_models, public, route and views. Directly in the Backend folder is app.js. The controller folder contains a controller for interacting with each database table. Bin contains the WWW file, and config configures the database. The models folder defines the different attributes of objects stored in the database, such as user bios. The public folder contains just a style sheet. The Routes folder contains lists of express routes to get, put and delete information from different tables in the database. The views folder defines 3 different views, one for error, index and layout.

Functionality

The Recovery Ventures website has a number of implemented use cases.

Use Cases

• Navigation between both static and dynamic pages
  • The user should be able to use the navagation bar to click around to different pages on the website. The following pages have been created and can currently be navigated to by the user
    • Landing Page (static page)
    • Our Model (static page)
    • Volunteer (static page)
    • Connect With Mentors (dynamic page)
    • Login (dynamic page)
    • Setup Account (dynamic page)
• Account Creation and Login
  • The user can create an account from the front end, and their account data will be stored in the database. The account creation process for users who enter the mentor pin ("123") will include a mentor profile creation page where users can enter their bio for clients to view.
  • Once an account has been created, the user can log in. The login page will check the database to confirm login credentials.
  • Both of these pages have error checking and will alert the inform the user via the help box on the right side of the screen if there is a problem.
• Mentor Profiles Display and Searching
  • The user can search mentor bios from the database based on the criteria of "expertise".
  • Bios are displayed on the screen as a grid that users can scroll through. Each bio box has a profile picture, a set of info tags about the mentor, and a written bio description of the mentor. If the user is logged in, they will be able to see the mentor's contact info amongst the other info tags.

Deviations

• The site is not mobile friendly. It is possible to navigate / use the site on a mobile phone but formatting is poor on smaller screen sizes.
• Did not complete medium or low priority use cases: contact form for volunteers, payment link for donations, google maps to show co-op location, interactive resource list, mentor-client chat functionality, translation options, etc.
• Mentor search is not as thorough as we had originally imagined - you can only search a list of drop down terms and not type in your own search term. We also originally designed a modal card that would appear if you clicked on a specific mentor.
• We originally planned to have a profile page available to both clients and mentors to create and edit profiles, but now only mentors can create profiles and only at account creation.

Known Problems

• Pins must be manually entered into the database through HTTP request. There is no way to add them from the site.
• Similarly, there is no way to edit or delete user or profile information from the site. This can only be done through HTTP requests.
• There is no mechanism to retrieve forgotten passwords or reset your password.
• Formatting for the mentor search page does not adjust given the size of the text entered.
• Footer doesn’t stay at the bottom of the page when there is not enough content to fill the page.
• There is no logout functionality
• A default name is used in the greeting after logging in