Blood Donator

What’s the problem?

Reaching the bigger amount of blood donators using an easy to use social platform.

What’s the solution?

An app where the user(Donator) can view and search for donating stations. Get some inspiration from our inspiration page. The app provides some questions to check if the

Link to the prototype:

Figma prototype

USER STORY: What I can do as an unregistered user?

1. As an unregistered user, I can view the required blood type.
2. As an unregistered user, I can search for specific blood type/city/place.
3. As an unregistered user, I would like to share requests on social media.

What I can do as a user?

• As a registered user, I want to have my own profile and to be able to edit it.
• As a registered user, I want to be able to make account and login.

Teach-stack:

React.js Express ESlint React Route Babel Parcel Crypto Bcrypt JWT en2 MongoDB Heroku Cookie React cookie

Getting Started

1. Clone the repo:

$ git clone https://github.com/facn5/BloodDonor.git

2. Install dependencies

$ npm i

3. Install dependencies in the client folder

$ cd client
$ npm i

4. Add initial environment Variables

Create a config.env file in the root directory.

Add your 'mongodb' url to the env.

DB_URL = mongodb://[username:password@][host]:[port]/[databasename]

Add a 'secret' for password encryption.

SECRET = "[YOUR SECRET]"

Add a 'key' for password encryption.

secretOrKey = "[YOUR SECRET]"

5. Run the app

$ npm run start

• Tables Details

• Cards

  stationName, bloodType, status, street: Single line text | mapSrc: Link to Map Location | contact, openHours: Number line text

• Users

  username: Single line text| password: Multiple select | phoneNumber: Number line text | config: { bloodType: Single line text | validAge, healthStatus, recentSurgery, getNotification: Boolean}

• Inspirations

  title: Single line text | description: Long text

Pictures from our web-app:

Some pictures from our team-work: