Code Monkey home page Code Monkey logo

helpseniors's Introduction

General Assembly Logo

Save the Seniors of As Salamah, Jeddah, KSA!

COVID-19 is a new illness that can affect your lungs and airways. It's caused by a virus called coronavirus.

The symptoms of coronavirus are:

  • a cough
  • a high temperature
  • shortness of breath

But these symptoms do not necessarily mean you have the illness.

The symptoms are similar to other illnesses that are much more common, such as cold and flu.

Simple measures like washing your hands often with soap and water can help stop viruses like coronavirus (COVID-19) spreading.

There's no specific treatment for coronavirus (COVID-19). Treatment aims to relieve the symptoms until you recover.

It's not known exactly how coronavirus (COVID-19) spreads from person to person, but similar viruses are spread in cough droplets.

Problem / Prompt


A curfew from 06:00Hrs - 19:00Hrs has been implemented by the Kingdom of Saudi Arabia to ensure the safety of the kingdom and cortail the spread of the virus.

As Salamah District in Jeddah, Saudi Arabia has a large population of senior citizen who can not go to the store and compete with the younger citizens in panick shopping to stock up on groceries during the curfew.

We need some way to get the list of things needed by the seniors and deliver to a location closer to them for pick up.

The King decided to call on the SEI-12 team to develop a web app which allows the seniors create a list of their required items and any registered youth can run these errands for them.

Task 1:

The Seniors should be able to register as a senior with contact details(name, address, age and phone number) and create a list with an expected delivery date. The list should contain items and a status ( 0 - free,1 - inProgress and 2 - fulfilled), each item should have a name and quantity.

Task 2:

The Helpers should be able to register as a helper with contact details(name, address, age and phone number). Helper should be able to view all lists which have status of free.

Task 3:

Helpers should also be able to view unfulfilled lists. They should also be able to see lists if they are fulfilling the list or have been fulfilled by them on their profile page.

Help the seniors

Get Started

  $ clone repo url
  $ cd into dir
  $ npm install
  $ touch .env

Requirements


  1. All Users must be registered on the web app to post and accept task.
  2. There should be 3 types of users:
    • Admin
    • Senior
    • Helper
  3. All users should only login with phone number and password.
  4. Anyone should be able to view the Seniors lists
  5. Only helpers can accept / deliver grocery items
  6. Items should be stored in seperate collection if needed.

Hints


  • User Model can have the following fields as booleans to restrict what is seen by the end user:

    • isAdmin
    • isHelper
    • isSenior
  • Query by in Mongoose

  • Grid styled CSS: I have added system which allows for a maximum of 12 columns, in my example below col-4 means of size 4 and 4 x 3 = 12

<div class="container">
  <div class="row">
    <div class="col-4">Left column</div>
    <div class="col-4">Center column</div>
    <div class="col-4">Right column</div>
  </div>
</div>

  • box
<div class="box" style="width: 18rem;">
  <div class="box-body">
    <h5 class="box-title">Card title</h5>
    <h6 class="box-subtitle mb-2 text-muted">Card subtitle</h6>
    <p class="box-text">
      Some quick example text to build on the card title and make up the bulk of
      the card's content.
    </p>
    <a href="#" class="box-link">Card link</a>
    <a href="#" class="box-link">Another link</a>
  </div>
</div>

  • Button
<button class="btn btn-primary">Primary</button>
<button class="btn btn-success">Success</button>
<button class="btn btn-danger">Danger</button>

  • Forms
<form>
  <div class="row">
    <div class="col-6">
      <label for="inputAddress">Email</label>
      <input type="text" class="form-input" placeholder="Email" />
    </div>
    <div class="col-6">
      <label for="inputAddress">Password</label>
      <input type="text" class="form-input" placeholder="Password" />
    </div>
  </div>
  <div class="row">
    <div class="col-12">
      <label for="inputAddress">Address</label>
      <input
        type="text"
        class="form-input"
        id="inputAddress"
        placeholder="1234 Main St"
      />
    </div>
  </div>
</form>

Bonus


  1. Include JQuery for validation on client side
  2. Add some animations, to view full details as a modal popup
To Chip In

Information for users


{
    firstname: "",
    lastname:"",
    dateOfBirth: "",
    address: {
        houseNumber: 0,
        street: "",
        city : "",
        district: ""
    },
    lists:[]
}

List information


{
   lists: [
       {
          items:[
              {
                  item: "",
                  quantity: 0
              }
          ],
          deliveryDate:"",
          status: 0 // 0/ 1 / 2
       }
  ]
}

Credits


References


helpseniors's People

Contributors

metildachee avatar

Watchers

 avatar

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.