Animal Sighting Tracker

This app is a full-stack app with a React frontend, Node/Express backend, and Postgres database.

Table of Contents

• Technologies Used
• Features
• Screenshots
• Setup
• Project Structure
• Room for Improvement

Technologies Used

• React
• Node
• Express
• Postgres
• CSS
• REST API

Features

• User can see the list of Animal Sightings
• User can filter Healthy and Unhealthy Individuals
• User can go to Detail Page to get more information about the individual
• User can add new sightings
• User can delete Individual Sightings

Project Structure

This app has two packages: one for the React Frontend and another for nodejs Server Backend. Here all the React app resides under the client folder and nodejs API resides under the server folder.

Screenshots

Home Page

Detail Page

Add Sighting Form Page

Setup

First, clone the project and move inside the directory

next move into the server and install dependencies and start the server

cd server
npm install
npm run server

Open another terminal then cd into the client, install dependencies and start the server

cd client
npm install
npm start

Create the database in postgres terminal and create table. You can refer seed.psql file. In this project mock data is created using mockaroo

Later create the .env file and add all credentials. You can refer .env.example file.

If everything goes well you can see the running app at http://localhost:3000/.

Room for Improvement

• Validate the form
• write unit test