cwilliams001 / sdi-blended-project2-scaffold

Data Annotation Project

Example Video

readme-video02.webm

Purpose

The purpose of this application is to enable users to label data for mission-critical tasks.

Kanban Board

Our Kanban Board can be found here. https://trello.com/invite/b/2G0ipzll/ATTI8ac71bc6aedae65ebf5a1225132f88596E2CCFA4/project-two

Wireframe/User Story drafts

Our Wireframe and user story drafts can be found here. https://miro.com/welcomeonboard/RlptN2NsVGl6NERTZm1XRmJUNWhrMEQyQ0pVeWFURzVKMVRkQXREREFkOFF6SzNRYnRjVUUxckZFRklCaDFJb3wzNDU4NzY0NTcxODU1MjgyNzE3fDI=?share_link_id=723961214950

Overview

This project integrates Label Studio into a React application for annotation purposes. It allows users to annotate images using Label Studio and then sends these annotations to a Node.js backend server. The server stores the annotations and provides an endpoint to view all received annotations.

Prerequisites

• Node.js
• npm (Node Package Manager)
• React.js

Installation

Frontend

1. Clone the repository:

   git clone <repository-url>

2. Navigate to the frontend directory:

   cd sdi-blended-project2-scaffold

3. Install dependencies:

   npm install

4. Set up environment variables:

   • Create a .env file in the root of the frontend directory.
   • Add your Google API Key for map snapshots:

     REACT_APP_GOOGLE_API_KEY=your_google_api_key

Backend

1. Navigate to the backend directory:

   cd backend

2. Install dependencies:

   npm install

Running the Application

Start the Backend Server

1. Navigate to the backend directory:

   cd backend

2. Start the server:

   node server.js

Start the Frontend Application

1. Open a new terminal window/tab.

2. Navigate to the frontend directory:

   cd sdi-blended-project2-scaffold

3. Start the React application:

   npm start

Usage

• Open your web browser and navigate to http://localhost:3000.
• Use the Label Studio interface to annotate images.
• Submit your annotations, which will be sent to the backend server.
• To view received annotations, navigate to http://localhost:3001/annotations in your browser.