React API Integration for Solar TwinPro

Connect Existing React Solar Digital Twin Frontend to Backend APIs

Project Description

We have an existing React-based digital twin frontend called TwinPro for management and monitoring of solar power plants.

Several existing screens currently obtain their information from static JSON/dummy datasets.

We require an experienced React developer to connect the existing frontend to REST APIs while maintaining the existing UI and UX.

This assignment is primarily API integration. It is NOT a UI redesign project.

Existing Application Structure

Enterprise
↓
Portfolio
↓
Plant
↓
Block
↓
Individual assets

The frontend includes dashboards, GIS layouts, KPIs, alarms, assets and other operational modules.

Scope of Work
Review existing React project.
Identify all hard-coded/static JSON data sources.
Develop central API service layer.
Replace static JSON with backend API requests.
Implement environment-based API configuration.
Integrate JWT/Cognito authentication tokens.
Connect Enterprise dashboard.
Connect Portfolio dashboard.
Connect Plant dashboard.
Connect asset details.
Connect alarm data.
Connect GIS/asset coordinates.
Add loading states.
Add API error handling.
Add empty/no-data states.
Maintain responsive behaviour.
Document API integration.
Example Change

Current architecture:

React UI → Static JSON

Required architecture:

React UI → API Service → REST Backend → Database

Screens for Initial Integration

Initial project should cover approximately:

Login/session integration
Enterprise Overview
Portfolio Overview
Plant Overview
Plant KPI cards
Alarm panel
Asset register
Asset detail
GIS/plant map data
Historical generation chart
Work-order list
Deliverables

Milestone 1: Existing-code audit + API mapping
Milestone 2: Central API service + authentication integration
Milestone 3: Enterprise/Portfolio integration
Milestone 4: Plant/Asset/Alarm integration
Milestone 5: Testing, bug fixes and documentation

Important Requirement

Do not redesign the existing TwinPro UI unless specifically requested.

We need clean, reusable code so that additional screens can subsequently be connected using the same API service architecture.

All source code must be committed to our project repository.

What to Include in Your Bid

Please provide:

Examples of React dashboards developed
Experience connecting React with REST APIs
AWS Amplify/Cognito experience
Experience with GIS/map applications, if available
GitHub/code sample

Start your proposal with “TWINPRO REACT”.

Preferred Skills

React.js
JavaScript
RESTful API
Amazon Web Services
Frontend Development

Suggested Project Type

Fixed Price

Suggested Budget

₹5,000–₹50,000

Target Completion

7 days