Git Product home page Git Product logo

2022-volunteermanagementapp's Introduction

Volunteer Management App

Frontend Tests Backend Tests Deployment and Release

Contributors License: GPL Vue version

Table of Contents

Overview

We're working on a website that can be used by different communities to help self organise, keep track of need and effectively deploy help. We focus on building an intuitive front-end design and a system which all users can interact with. The application uses a Django project integrated with a vue application. And here is the website page https://uob.tofro.app/index/


Contributors


1.1 Gantt Chart & Kanban


1.2 Deployment Instruction

Please see our latest release ๏ผ

1.2.1 Backend: (Using Docker)

git clone https://github.com/spe-uob/2022-VolunteerManagementApp.git 
  • There are some extre steps for windows user(mac user can skip this step)
run these commands in Application\api directory
dos2unix setup.sh
dos2unix run.sh
dos2unix run-dev.sh

Then run this command in Application\api\build_scripts
dos2unix build-frontend-assets.sh
  • Then Run the following command in the Application directory ( This downloads all required node modules for the vue app ):
cd ./Application/
docker-compose -f docker-compose.yml -f development.yml up --build

1.2.2 Frontend:

  • Direct to the helloworldvue directory and run the following commands
cd ./Application/api/helloworldvue/
npm install
npm run serve
  • Restart the tofro-django container and get running ! ! !

1.2.3 Getting Running!

To get the website running open the following url:

http://localhost:8000/

Login then direct to:

http://localhost:8000/index

This is where the Vue Application is rendered. Now all that is left is to enjoy!!!


1.3 Possible Issues & Bugs

1.3.1 Found a bug !!!

If you found a bug, you can use issue template to create an issue with the tag bug


1.4 API Guide

API URL
Request Type
Description
api/actions/ GET retreive all the action data from a server
api/actions/ POST Add actions to the database - Requires an object with Help Type, Resident, Due, Status, Date
api/volunteers/ GET retreive all the volunteers data from a server
api/referrals/ GET retreive all the referral data from a server
api/residents/ GET retreive all the resident data from a server
api/residents/ POST Add residents to the database - Requires an object with first_name, last_name, address, postcode, Date
api/volunteers/ GET retreive all the volunteers data from a server
api/organisations/ GET retreive all the organistion data from a server
api/residents/37/ DELETE Deletes a resident from the database
api/actions/7/ PATCH a set of changes described in the request entity be applied to the resource identified by the Request- URI

1.5 Continuous Integration / Continuous deployment

CI:

We decided to use GitHub actions that triggers whenever we start a pull request into main There are two tests, one for the frontend and one for the backend

  • Frontend Tests
  • Backend Tests

CD:

The deployment is achieved by pushing the code to a virtual machine, and the process of updating involves accessing the virtual machine, locating the corresponding file path, and pulling the latest code from GitHub.

The latest code is then deployed to https://uob.tofro.app/index/


1.6 UX design

To design an interactive user interface we employed general UX design methods, such as Journey Mapping, listing user personas and requirements. We aim to follow a UX design pattern.

1.6.1 Requirements:

  • The site needs to be intuitive and easy to navigate/use for the coordinator
  • The site needs to facilitate easy logging of new actions
  • The site needs to facilitate easy matching between actions and eligible volunteers
  • The site needs to facilitate efficient dealing of high priority actions
  • The site needs to facilitate easy searching of actions,residents and volunteers

1.6.2 User Personas:

User
Goal
Frustrations
Coordinator To efficiently match requests and log new data Confusing UI requiring a lot of clicks and long traversals through out the interface
Residents To quickly and efficiently give required information to coordinator Long,slow drawn out phone call
Volunteer Quick matching of volunteered action Overlooked action for long period of times

1.6.3 Use Cases & Journey Mapping:


1.7 Ethics

If coordinators use this application, we need to know their email addresses, addresses, phone numbers, and personal information. To avoid concerns about privacy and security, obtaining ethical approval is crucial. To provide a good user experience, we have established the following ethical principles:
  • We will prioritize the safety of our users.
  • We will respect the privacy of our users and will never use their data for any purpose other than the intended one.
  • We will listen to feedback and criticism from our users and will use it to improve our products and services.
  • By adhering to these principles, we hope to create a culture of respect that benefits everyone in our group.

2022-volunteermanagementapp's People

Contributors

lzm03 avatar cailinfeng123 avatar ishshogun avatar s1s1s avatar ruri22 avatar

Stargazers

 avatar

Watchers

Tom Haines avatar  avatar  avatar

Forkers

bristolapproach

2022-volunteermanagementapp's Issues

Create Gantt-chart

To know the time of meeting with the client and the client's expected completion time!!!

Meet with mentor

Take away learning points and TODO.

  1. More actively push to the github
  2. add Readme and gannt chart
  3. create more descriptive features

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.