RecallRush

Study Web App with flashcards, interactive jeopeardy, and more!

Setup

Database Setup

Before running the project, we must setup the database. Database setup consists for 3 main actions, creating the database server/host, connecting to the server/host and writing the production data to the newly created database.

Database Server

Choose from either running database on a local server or hosting online. Our project currently hosts our database on freesqldatabase.com

Connecting to Server

In the Backend/ directory, create a .env file using the given environment variables inside .env.example. Fill in the MYSQL_USER, MYSQL_PASS, MYSQL_HOST, and DB_NAME based on the database server you are using. In the Backend/ directory, uncomment line 1 and replace the database name into line 1 & 2 of schema.sql

Writing Production Data

Mock Production Data is stored inside Backend/Database/data/ inside .csv files. To load the .csv files, navigate into the Backend/ directory and run python dataSetup.py. If it is the first time you are setting up the database and you wish to load the schema as well, run the script with argument --s schema.sql.

Writing Sample Data

Sample Data is stored directly in test-sample.sql. To load test-sample.sql, simply run the insertion queries. Alternatively, replace the <table>.csv files for the production data with the sample data and follow the above step to load the production <table>.csv into the database.

Execution

Backend

1. Start the backend by navigating to the Backend/ directory in the terminal
2. (Optionally) create a python virtual environment and activate it
3. Download the dependencies by running pip install -r requirements.txt
4. Start the server using flask run

Frontend

1. Start the backend by navigating to the Frontend/ direcotry in the terminal
2. Download the dependencies by running npm i
3. Start the program using npm start

Features

Creating Decks: Besides the default decks the initial database provides, users can create Decks that organize flashcards into common topics, keeping them private for personal use or sharing it with the public for others to use as well.

Frontend: Frontend/src/pages/create-deck/index.js Backend (API endpoint): Backend/app.py Database Call: Backend/Database/db.py

Creating Flashcards: Besides the default flashcards the intitial database provides, users can add their own flashcards into their decks.

Frontend: Frontend/src/pages/create-flashcard/index.js Backend (API endpoint): Backend/app.py Database Call: Backend/Database/db.py

Browsing/Flitering Decks: A user can find a deck they created or a public deck created by other by browsing through all the decks. A user can filter the decks by subject or any tag.

Frontend: Frontend/src/components/decktable.js Backend (API endpoint): Backend/app.py Database Call: Backend/Database/db.py

Flipping through Decks: Once a User finds the deck they want to study, the user can click the deck and flip through all the cards in the deck. Each card has a flippable (on-click) question and answer card.

Frontend: Frontend/src/components/cardflip.js Backend (API endpoint): Backend/app.py Database Call: Backend/Database/db.py