/go4pets

Primary LanguageJavaScript

Project Overview

Project Name

Go4Pets-https://go4pets.netlify.app/

Project Description

Go4pets is e-commerce platform for pets suppliers that was built using Airtable(third-party) and React. It provides a service to customers who have pets. A user is able to see all available products, rating and their descriptions. Each item on home page leads to corresponding page that shows additional information. Additionally, a user is able to add their own item for sale.

Wireframes

Desktop View:

  1. https://github.com/leeuwork/go4pets/blob/main/image/desktop%20view-main.jpeg?raw=true
  2. https://github.com/leeuwork/go4pets/blob/main/image/Untitled%20Diagram-Page-2.jpg?raw=true

Phone view:

  1. https://github.com/leeuwork/go4pets/blob/main/image/phone-view.jpeg?raw=true

Tablet view:

  1. https://github.com/leeuwork/go4pets/blob/main/image/tablet.jpg?raw=true

Component Hierarchy

  1. https://github.com/leeuwork/go4pets/blob/main/image/go4pets-Diagram.jpg?raw=true

API and Data Sample

{
    "records": [
        {
            "id": "reclEKQ05Dn645j7J",
            "fields": {
                "Title": "Zesty Paws Allergy Immune Supplement for Dogs - with Omega 3",
                "Rating": 4,
                "Price": 26.9,
                "Description": "Boost the Immune System – Zesty Paws Aller-Immune Bites are grain free soft chews that support immune, histamine, and digestive health for dogs with s...",
                "Image": "https://images-na.ssl-images-amazon.com/images/I/819bgiVBleL._AC_SL1500_.jpg"
            },
            "createdTime": "2021-01-20T21:13:07.000Z"
        },
        {
            "id": "reccFvsYiSzKbwrOe",
            "fields": {
                "Title": "Dog Back Seat Cover Protector Waterproof Scratchproof Nonslip Hammock for Dogs",
                "Rating": 5,
                "Price": 33.6,
                "Image": "https://images-na.ssl-images-amazon.com/images/I/813q4c5N1vL._AC_SL1500_.jpg",
                "Description": "DIRTY BARRIER, COMFORT LAYER - Forget about those cheap dog seat covers that ruined after one time use and ruin your seats... Those days are over! Act..."
            },
            "createdTime": "2021-01-20T21:13:07.000Z"
        },
        {
            "id": "recKisMYwU4futPZA",
            "fields": {
                "Title": "Voyager Step-in Air Dog Harness - All Weather",
                "Rating": 4,
                "Price": 13.99,
                "Image": "https://images-na.ssl-images-amazon.com/images/I/81jy-V87ucL._AC_SL1500_.jpg",
                "Description": "Age range description: All Life Stages\nATTENTION: Sizing does NOT directly correspond to your pet’s breed or weight. Please MEASURE your pet and refer..."
            },
            "createdTime": "2021-01-20T21:13:07.000Z"
        }
    ],
    "offset": "recKisMYwU4futPZA"
}

MVP/PostMVP

MVP

  • A user is able to check available items for sale and their descriptions
  • A user is able to search items for sale
  • A user is able to add new item

PostMVP

  • A user is able to sign up for new account and add information
  • A user is able to update and delete items using third-party airtable
  • Add additional API to show more info about pets
  • Use third-party to store user's information
  • Make the UI user-friendly
  • Make the tab-bar clickable and let a user to check all categories

Project Schedule

Day Deliverable Status
January 20-30 Prompt / Wireframes / Priority Matrix / Timeframes Completed
January 20 Project Approval Completed
January 22 Core Application Structure (HTML, CSS, etc.) Completed
January 25 Pseudocode / actual code Completed
January 27 Initial Clickable Model Completed
January 30 MVP Completed
February 2 Presentations Completed

Timeframes

Component Priority Estimated Time Time Invested Actual Time
Airtable setup H 2hrs 4hrs 4hrs
Create react-app, and add url along with keys H 1hrs 1hrs 1hrs
Draw.io H 5hrs 10hrs 10hrs
Airtable add info H 1hrs 1hrs 1hrs
Search bar H 6hrs 10hrs 10hrs
Hamburger bar -> all categories H 10hrs 6hrs 6hrs
Main image with circles H 1hrs 1hrs 1hrs
Add Item "Post" H 2hrs 4hrs 4hrs
Brands and Facts H 2hrs 2hrs 2hrs
Add second airtable for user info and apply correct to account page H 6hrs 5hrs 5hrs
CSS H 12hrs 10hrs 10hrs
Total H 48hrs 54hrs 54hrs

SWOT Analysis

Strengths:

Weaknesses:

Opportunities:

Threats: