1003858: Reorganized open-save and added cloud storage

Author: parthasarathy4998

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Open-from-Cloud/aws-s3-bucket.md

@@ -173,157 +173,4 @@ const openFromS3 = () => {
 
 ```
 
-N> The **AWSSDK.S3** NuGet package must be installed in your application to use the previous code example.
-
-# Save spreadsheet to AWS S3
-
-To save a file to the AWS S3, you can follow the steps below
-
-**Step 1:** Create a Simple Spreadsheet Sample in React
-
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
-
-**Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
-
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
-
-2. Open the `SpreadsheetController.cs` file in your web service project.
-
-3. Import the required namespaces at the top of the file:
-
-```csharp
-
-using Amazon;
-using Amazon.Runtime;
-using Amazon.S3;
-using Amazon.S3.Model;
-using Amazon.S3.Transfer;
-
-```
-
-4. Add the following private fields and constructor parameters to the `SpreadsheetController` class, In the constructor, assign the values from the configuration to the corresponding fields.
-
-```csharp
-
-private IConfiguration _configuration;
-public readonly string _accessKey;
-public readonly string _secretKey;
-public readonly string _bucketName;
-
-public SpreadsheetController(IWebHostEnvironment hostingEnvironment, IMemoryCache cache, IConfiguration configuration)
-{
-  _hostingEnvironment = hostingEnvironment;
-  _cache = cache;
-  _configuration = configuration;
-  _accessKey = _configuration.GetValue<string>("AccessKey");
-  _secretKey = _configuration.GetValue<string>("SecretKey");
-  _bucketName = _configuration.GetValue<string>("BucketName");
-}
-
-```
-
-5. Create the `SaveToS3()` method to open the document from the AWS S3 bucket.
-
-```csharp
-
-[HttpPost]
-[Route("SaveToS3")]
-public async Task<IActionResult> SaveToS3([FromForm] SaveSettings saveSettings)
-{
-    try
-    {
-        // Convert spreadsheet JSON to Excel file stream
-        Stream fileStream = Workbook.Save<Stream>(saveSettings);
-        fileStream.Position = 0; // Reset stream for upload
-
-        // Set AWS region and credentials
-        var region = RegionEndpoint.USEast1;
-        var config = new AmazonS3Config { RegionEndpoint = region };
-        var credentials = new BasicAWSCredentials("your-access-key", "your-secretkey");
-
-        // Define S3 bucket and file name
-        string bucketName = "your-bucket-name";
-        string fileName = saveSettings.FileName + "." + saveSettings.SaveType.ToString().ToLower();
-
-        // Initialize S3 client
-        using (var client = new AmazonS3Client(credentials, config))
-        {
-            // Use TransferUtility to upload the file stream
-            var fileTransferUtility = new TransferUtility(client);
-            await fileTransferUtility.UploadAsync(fileStream, bucketName, fileName);
-        }
-
-        // Return success message
-        return Ok("Excel file successfully saved to AWS S3.");
-    }
-    catch (Exception ex)
-    {
-    }
-}
-
-```
-
-6. Open the `appsettings.json` file in your web service project, Add the following lines below the existing `"AllowedHosts"` configuration.
-
-```json
-
-{
-  "Logging": {
-    "LogLevel": {
-      "Default": "Information",
-      "Microsoft.AspNetCore": "Warning"
-    }
-  },
-  "AllowedHosts": "*",
-  "AccessKey": "Your Access Key from AWS S3",
-  "SecretKey": "Your Secret Key from AWS S3",
-  "BucketName": "Your Bucket name from AWS S3"
-}
-
-```
-
-N> Replace **Your Access Key from AWS S3**, **Your Secret Key from AWS S3**, and **Your Bucket name from AWS S3** with your actual AWS access key, secret key and bucket name.
-
-**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#saveasjson) method to serialize the spreadsheet and send it to the backend.
-
-```tsx
-
-// Function to save the current spreadsheet to AWS S3 via an API call
-const saveToS3 = () => {
-  // Convert the current spreadsheet to JSON format
-  spreadsheet.saveAsJson().then((json) => {
-    const formData = new FormData();
-
-    // Append necessary data to the form for the API request
-    formData.append('FileName', loadedFileInfo.fileName); // Name of the file to save
-    formData.append('saveType', loadedFileInfo.saveType); // Save type
-    formData.append('JSONData', JSON.stringify(json.jsonObject.Workbook)); // Spreadsheet data
-    formData.append(
-      'PdfLayoutSettings',
-      JSON.stringify({ FitSheetOnOnePage: false }) // PDF layout settings
-    );
-
-      // Make a POST request to the backend API to save the file to S3. Replace the URL with your local or hosted endpoint URL.
-      fetch('https://localhost:portNumber/api/spreadsheet/SaveToS3', {
-        method: 'POST',
-        body: formData,
-      })
-      .then((response) => {
-        // Check if the response is successful
-        if (!response.ok) {
-          throw new Error(
-            `Save request failed with status ${response.status}`
-          );
-        }
-        window.alert('Workbook saved successfully.');
-      })
-      .catch((error) => {
-        // Log any errors that occur during the save operation
-        window.alert('Error saving to server:', error);
-      });
-  });
-};
-
-```
-
-N> The **AWSSDK.S3** NuGet package must be installed in your application to use the previous code example.
+N> The **AWSSDK.S3** NuGet package must be installed in your application to use the previous code example.

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Open-from-Cloud/azure-blob-storage.md

@@ -1,6 +1,6 @@
 ---
 layout: post
-title: Opening excel from Azure Blob Storage in React Spreadsheet control | Syncfusion
+title: Open excel from Azure Blob in React Spreadsheet control | Syncfusion
 description: Learn about how to Open an Excel file from Azure Blob Storage in React Spreadsheet control of Syncfusion Essential JS 2.
 platform: document-processing
 control: Open file from Azure Blob Storage

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Open-from-Cloud/google-cloud-storage.md

@@ -1,6 +1,6 @@
 ---
 layout: post
-title: Opening excel from Google Cloud Storage in React Spreadsheet control | Syncfusion
+title: Open excel from Google Cloud in React Spreadsheet control | Syncfusion
 description: Learn about how to Open an Excel file from Google Cloud Storage in React Spreadsheet control of Syncfusion Essential JS 2.
 platform: document-processing
 control: Open file from Google Cloud Storage

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Save-to-Cloud/aws-s3-bucket.md

@@ -116,7 +116,7 @@ public async Task<IActionResult> SaveToS3([FromForm] SaveSettings saveSettings)
 
 N> Replace **Your Access Key from AWS S3**, **Your Secret Key from AWS S3**, and **Your Bucket name from AWS S3** with your actual AWS access key, secret key and bucket name
 
-**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#saveasjson) method to serialize the spreadsheet and send it to the backend
+**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveasjson) method to serialize the spreadsheet and send it to the back-end
 
 ```tsx
 

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Save-to-Cloud/azure-blob-storage.md

@@ -1,6 +1,6 @@
 ---
 layout: post
-title: Saving excel to Azure Blob Storage in React Spreadsheet control | Syncfusion
+title: Save excel to Azure Blob in React Spreadsheet control | Syncfusion
 description: Learn about how to Save an Excel file from Azure Blob Storage in React Spreadsheet control of Syncfusion Essential JS 2.
 platform: document-processing
 control: Save file to Azure Blob Storage
@@ -90,8 +90,7 @@ public async Task<IActionResult> SaveToAzure([FromForm] SaveSettings saveSetting
 
 N> Note: Install the Azure.Storage.Blobs NuGet package in the service project. Ensure the configured connection string has permissions to read and write blobs in the specified container.
 
-**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#saveasjson) method to serialize the spreadsheet and send it to the backend
-
+**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveasjson) method to serialize the spreadsheet and send it to the back-end
 
 ```typescript
 

Document-Processing/Excel/Spreadsheet/React/Cloud-Storage/Save-to-Cloud/google-cloud-storage.md

@@ -83,7 +83,7 @@ public async Task<IActionResult> SaveToGoogleCloud([FromForm] SaveSettings saveS
 
 ```
 
-**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#saveasjson) method to serialize the spreadsheet and send it to the backend
+**Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveasjson) method to serialize the spreadsheet and send it to the back-end
 
 ```csharp
 
@@ -118,4 +118,4 @@ const saveToGoogleCloud = () => {
 
 ```
 
-N> Note: The backend requires the Google.Cloud.Storage.V1 NuGet package and a service-account key that has Storage Object Admin (or equivalent) permissions on the target bucket.
+N> Note: The back-end requires the Google.Cloud.Storage.V1 NuGet package and a service-account key that has Storage Object Admin (or equivalent) permissions on the target bucket.

Document-Processing/Excel/Spreadsheet/React/Open/open.md

@@ -133,7 +133,7 @@ public IActionResult Open(IFormCollection openRequest)
 
 When opening large Excel files with many features and data, the server response can become very large. This might cause memory issues or connection problems during data transmission. The `Chunk Response Processing` feature solves this by dividing the server response into smaller parts, called chunks, and sending them to the client in parallel. The client receives these chunks and combines them to load the Excel data smoothly into the spreadsheet.
 
-You can enable this feature by setting the [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/opensettings#chunksize) property in the [`openSettings`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#opensettings) object. Set the [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/openSettings/#chunksize) to a value greater than 0 (in bytes). The [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/opensettings#chunksize) defines how large each chunk will be. Make sure your server supports chunked responses to use this feature effectively.
+You can enable this feature by setting the [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/opensettings#chunksize) property in the [`openSettings`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#opensettings) object. Set the [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/openSettings/#chunksize) to a value greater than 0 (in bytes). The [`chunkSize`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/opensettings#chunksize) defines how large each chunk will be. Make sure your server supports chunked responses to use this feature effectively.
 
 > This feature reduces memory usage on both the server and client, ensuring that resources are managed efficiently during data transmission. By sending smaller parts of data, it prevents connection issues that could occur with large payloads, making the transmission process more reliable. Additionally, it allows large Excel files to be loaded smoothly into the spreadsheet, providing a seamless user experience even with extensive data.
 

Document-Processing/Excel/Spreadsheet/React/Save/save.md

@@ -53,7 +53,7 @@ Please find the below table for the beforeSave event arguments.
 
 ### Configure JSON serialization options
 
-Previously, when saving the Spreadsheet as a workbook JSON object using the [saveAsJson](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#saveasjson) method, the entire workbook with all loaded features were processed and saved as a JSON object. 
+Previously, when saving the Spreadsheet as a workbook JSON object using the [saveAsJson](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveasjson) method, the entire workbook with all loaded features were processed and saved as a JSON object. 
 
 Now, you have the option to selectively ignore some features while saving the Spreadsheet as a JSON object by configuring serialization options and passing them as arguments to the `saveAsJson` method. This argument is optional, and if not configured, the entire workbook JSON object will be saved without ignoring any features.
 
@@ -90,7 +90,7 @@ The following code snippet demonstrates how to configure the serialization optio
 
 ### Send and receive custom params from client to server
 
-Passing the custom parameters from client to server by using [`beforeSave`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#beforesave) event.
+Passing the custom parameters from client to server by using [`beforeSave`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#beforesave) event.
 
 {% tabs %}
 {% highlight js tabtitle="app.jsx" %}
@@ -121,7 +121,7 @@ Server side code snippets:
 
 ### Add custom header during save
 
-You can add your own custom header to the save action in the Spreadsheet. For processing the data, it has to be sent from client to server side and adding customer header can provide privacy to the data with the help of Authorization Token. Through the [`fileMenuItemSelect`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#filemenuitemselect) event, the custom header can be added to the request during save action.
+You can add your own custom header to the save action in the Spreadsheet. For processing the data, it has to be sent from client to server side and adding customer header can provide privacy to the data with the help of Authorization Token. Through the [`fileMenuItemSelect`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#filemenuitemselect) event, the custom header can be added to the request during save action.
 
 {% tabs %}
 {% highlight js tabtitle="app.jsx" %}
@@ -142,7 +142,7 @@ You can add your own custom header to the save action in the Spreadsheet. For pr
 
 ### Change the PDF orientation
 
-By default, the PDF document is created in **Portrait** orientation. You can change the orientation of the PDF document by using the `args.pdfLayoutSettings.orientation` argument settings in the [`beforeSave`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#beforesave) event.
+By default, the PDF document is created in **Portrait** orientation. You can change the orientation of the PDF document by using the `args.pdfLayoutSettings.orientation` argument settings in the [`beforeSave`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#beforesave) event.
 
 The possible values are:
 
@@ -178,7 +178,7 @@ The following list of Excel file formats are supported in Spreadsheet:
 
 ### Methods
 
-To save the Spreadsheet document as an `xlsx, xls, csv, or pdf` file, by using [save](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/#save) method should be called with the `url`, `fileName` and `saveType` as parameters. The following code example shows to save the spreadsheet file as an `xlsx, xls, csv, or pdf` in the button click event.
+To save the Spreadsheet document as an `xlsx, xls, csv, or pdf` file, by using [save](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#save) method should be called with the `url`, `fileName` and `saveType` as parameters. The following code example shows to save the spreadsheet file as an `xlsx, xls, csv, or pdf` in the button click event.
 
 {% tabs %}
 {% highlight js tabtitle="app.jsx" %}

Document-Processing/Excel/Spreadsheet/React/Server-Deployment/docker-deployment.md

@@ -11,7 +11,7 @@ documentation: ug
 
 The [**Syncfusion<sup style="font-size:70%">&reg;</sup> Spreadsheet (also known as Excel Viewer)**](https://www.syncfusion.com/spreadsheet-editor-sdk/react-spreadsheet-editor) is a feature-rich control for organizing and analyzing data in a tabular format. It provides all the common Excel features, including data binding, selection, editing, formatting, resizing, sorting, filtering, importing, and exporting Excel documents.
 
-This Docker image is the pre-defined Docker container for Syncfusion's Spreadsheet backend functionalities. This server-side Web API project targets ASP.NET Core 8.0.
+This Docker image is the pre-defined Docker container for Syncfusion's Spreadsheet back-end functionalities. This server-side Web API project targets ASP.NET Core 8.0.
 
 You can deploy it quickly to your infrastructure. If you want to add new functionality or customize any existing functionalities, create your own Docker file by referencing the existing [Spreadsheet Docker project](https://github.com/SyncfusionExamples/Spreadsheet-Server-Docker).
 
@@ -57,7 +57,7 @@ docker-compose up
 
 Now the Spreadsheet server Docker instance runs on localhost with the provided port number `http://localhost:6002`. Open this link in a browser and navigate to the Spreadsheet Web API open and save service at `http://localhost:6002/api/spreadsheet/open` and `http://localhost:6002/api/spreadsheet/save`.
 
-**Step 4:** Append the URLs of the Docker instance running services to the [`openUrl`](https://helpej2.syncfusion.com/react/documentation/api/spreadsheet/#openurl) property as `http://localhost:6002/api/spreadsheet/open` and the [`saveUrl`](https://helpej2.syncfusion.com/react/documentation/api/spreadsheet/#saveurl) property as `http://localhost:6002/api/spreadsheet/save` in the client-side Spreadsheet component. For more information on how to get started with the Spreadsheet component, refer to this [`getting started page.`](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started)
+**Step 4:** Append the URLs of the Docker instance running services to the [`openUrl`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#openurl) property as `http://localhost:6002/api/spreadsheet/open` and the [`saveUrl`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveurl) property as `http://localhost:6002/api/spreadsheet/save` in the client-side Spreadsheet component. For more information on how to get started with the Spreadsheet component, refer to this [`getting started page.`](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started)
 
 ```js
 import * as React from 'react';

Document-Processing/Excel/Spreadsheet/React/Server-Deployment/how-to-deploy-spreadsheet-server-to-azure-app-service-using-azure-cli.md

@@ -1,13 +1,13 @@
 ---
 layout: post
-title: Publish Spreadsheet Server to Azure App Service using Azure CLI
+title: Deploy Spreadsheet Server to Azure App Service using CLI | Syncfusion
 description: Learn how to deploy the Syncfusion Spreadsheet Server Docker image to Azure App Service using Azure CLI.
 control: How to deploy Spreadsheet Server Docker Image to Azure App Service using Azure CLI
 platform: document-processing
 documentation: ug
 ---
 
-# Publish Spreadsheet Server Docker Image to Azure App Service using Azure CLI in React Spreadsheet Editor component
+# Deploy Spreadsheet Server Docker Image to Azure App Service via CLI
 
 ## Prerequisites