Breadcrumb arrow Back to Code Examples

Syncfusion React Spreadsheet + AWS S3 Integration

Sample date Updated on Nov 05, 2025
Browse Code Git logo Download
aws-s3 excel react spreadsheet-editor-sdk syncfusion

This repository demonstrates how to integrate the Syncfusion React Spreadsheet component with AWS S3 cloud storage using a React frontend and an ASP.NET Core Web API backend.

?? Live Demo

?? Project Structure

+-- client/       # React app with Syncfusion Spreadsheet
+-- server/       # ASP.NET Core Web API project

? Features

  • Open Excel files directly from AWS S3 into Syncfusion Spreadsheet.
  • Edit spreadsheet data in-browser.
  • Save changes back to AWS S3 with a single click.
  • Dropdown list to select files from S3.

?? Technologies Used

  • React + Syncfusion Spreadsheet
  • ASP.NET Core Web API
  • AWS SDK for .NET
  • AWS S3 for cloud storage

?? Getting Started

  1. Clone the Repository

    git clone https://github.com/SyncfusionExamples/syncfusion-react-spreadsheet-aws-s3-integration.git

  2. Setup the Client

    cd client
npm install
npm start

  3. Setup the Server

    cd server
# Open in Visual Studio or VS Code
# Restore NuGet packages

    Update the following in the controller:

    • AWS Access Key
    • AWS Secret Key
    • S3 Bucket Name
    • Region

  4. Run the Server

    Run the project and test the endpoints directly from the React app

    dotnet run

?? Notes

  • Update the fetch() URLs in the React sample to point to your local backend endpoints for OpenFromS3 and SaveToS3.

  • The React sample includes a dropdown list with three predefined Excel files:

     const fileList = [
    { name: 'Car Sales Report', extension: '.xlsx' },
    { name: 'Shopping Cart', extension: '.xls' },
    { name: 'Price Details', extension: '.csv' },
 ];
  • You can update this list to match the actual Excel files stored in your AWS S3 bucket.
  • After selecting a file, click the "Open From S3" button to load the selected Excel file into the Syncfusion Spreadsheet.
  • Once you make edits, click the "Save to S3" button to save the changes back to the same file in your S3 bucket.

?? License and copyright

This is a commercial product and requires a paid license for possession or use. Syncfusion® licensed software, including this control, is subject to the terms and conditions of Syncfusion® EULA. To acquire a license for 140+ JavaScript UI controls, you can purchase or start a free 30-day trial.

A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.

See LICENSE FILE for more info.

Feel free to fork, customize, and contribute to this project!

Up arrow