README.md

Sterling Family Artefact

Sterling Family Artefacts is a home for all your artefacts. Easily preserve all of your family legacy and memories. Stay organised with Sterling Family Artefacts.

Table of Contents

• Project Background
  • Description
  • Requirements
  • Accomplished
• Documentation
• Technical Details
  • Folder Structure
  • Tech Stack
• Installation
  • Local Development
  • Running Serverside
  • Running Clientside
• Contributors

About The Project

Description

Sterling Family Artefact, a project by Group 098 (Five Fingers) of University of Melbourne's COMP30022 IT Project, is a CRUD (Create, Read, Update, Delete) interface web application to store photos of our client's family artefacts. Sterling Family Artefact offers a personalised experience for our client, developed with robustness in mind, and shared in DNA many similarities with our client’s site – from the colour scheme to the font usage. This application enables users to create records of artefacts, read it in various different formats and styles, edit and delete existing artefacts, and is compatible on both mobile and desktop devices to conveniently show artefact records to the user's friends and family anytime, anywhere.

This gave us the following requirements:

Requirements

Required Features	Stretch Features
Log in and Log out Functionalieis	Implement a folder system
View Partial Data of the Artefact	Add multiple images for one artefact record
View Full Data of the Artefact	Search artefacts by name and description
View Artefacts in a table format	Search artefacts by cateogies and association
Add Artefacts	Do ontology searches
Add speicfic cateogries or assocaition for an artefact	Do fuzzy searches
Edit previous registered artefact	Implement a pagination feature
Delete existing artefacts

(back to top)

Accomplished

1. Log in and Log out Functionalieis
2. View Partial Data of the Artefact
3. View Full Data of the Artefact
4. View Artefacts in a table format
5. Add Artefacts
6. Add speicfic cateogries or assocaition for an artefact
7. Edit previous registered artefact
8. Delete existing artefacts
9. Implement a pagination feature
10. Search artefacts by cateogies and association

(back to top)

Documentation

• Project Roadmap
• Low Fidelity Prototype
• High Fidelity Prototype
• User Stories
• Motivational Model
• Architecture Diagram
• Database Schema Model
• API Documentation

(back to top)

Technical details

Folder Structure

/
├── client/    
│   │           // Project root
│   ├── src/
│   │           // Main code
│   └── src/components/__tests__/
│               // Frontend unit tests
├── models/
│               // Code for Mongoose
└── tests/
                // Code for stress tests

Built With

This section lists any major frameworks/libraries used to bootstrap this project.

• 
• 
• 
• 
• 
• 
• 

(back to top)

Installation

Local Development

Because this app is made of two npm projects, there are two places to run npm commands:

1. Node API server in server/
2. React UI in client/ directory.

Test the app:

# in root directory
npm run dev

Test the built app:

# in root directory
npm build
npm start

# to test the whole app
npm test

Run Serverside

In a terminal:

# Change directory first!
cd server

# Initial setup
npm install

# Start the server
npm start

# Test the server
npm test

Install new npm packages for Server

Note: server and client are separate. cd to the correct directory (/ or client/) before doing this.

cd
npm install package-name --save

If the package you want to add is a development package, use the command

npm install package-name --save-dev

Run Clientside

The React app is configured to proxy backend requests to the local Node server. (See "proxy" config)

In a separate terminal from the API server, start the UI:

# Always change directory, first
cd client/

# Initial setup
npm install

# Start the client
npm start

# Test the client
npm test

Install new npm packages for React UI

It's the same as server, just cd client first.

(back to top)

Contributors

Name	Student No	Email
Leoni Angela	1179015	leonia@student.unimelb.edu.au
Nadya Aurelia Herryyanto	1185814	nherryyanto@student.unimelb.edu.au
Nicholas Riykco Widjaya	1179000	riykco.widjaya@unimelb.edu.au
Tahmin Ahmed	1146663	tahmin@student.unimelb.edu.au
Vincent Kurniawan	1110090	vkurniawan@student.unimelb.edu.au

Supervisor
Stephanie Brooke

Client
Professor Leon Sterling

(back to top)