diff --git a/site/sigmaguides/src/embedding_15_embed_sdk/embedding_15_embed_sdk.md b/site/sigmaguides/src/embedding_15_embed_sdk/embedding_15_embed_sdk.md index c1aa2fba..98b95a72 100644 --- a/site/sigmaguides/src/embedding_15_embed_sdk/embedding_15_embed_sdk.md +++ b/site/sigmaguides/src/embedding_15_embed_sdk/embedding_15_embed_sdk.md @@ -15,7 +15,7 @@ Duration: 5 Sigma provides many methods to allow users and developers to interact with its systems including web-ui, [REST API,](https://help.sigmacomputing.com/reference/get-started-sigma-api) [Javascript Embed API](https://help.sigmacomputing.com/docs/example-embed-api-and-url) and an SDK for the [React](https://react.dev/) framework. -The Embed-SDK for React provides an addition avenue, targeted at software developers who prefer to use a software development kit (SDK), as opposed to using the Sigmas JavaScript Embed-API, which can require writing additional code. +The Embed-SDK for React offers a higher-level, developer-friendly interface that simplifies integration into applications, in contrast to Sigma’s lower-level JavaScript Embed-API, which provides more granular control but may require additional coding There are some reasons why developers might choose one over the other. Each method offers distinct advantages depending on the project requirements, developer expertise, and desired level of control or simplicity.2 @@ -76,7 +76,114 @@ Open VSCode and make sure it loads without error. ![Footer](assets/sigma_footer.png) -## Clone Embed-SDK Repository (repo) +## Simple React Project +Duration: 5 + +For experienced developers who just want to see how to use the SDK in a React project, we will demonstrate in this section. + + + +### Step 1: Install Node.js and npm +Ensure that Node.js and npm (Node Package Manager) are installed on your machine. You can download them from [Node.js official website.](https://nodejs.org/) + +Verify the are installed: +```code +node -v +npm -v +``` + +### Step 2: Create a New React Application +In `Terminal (or command prompt)` and navigate to the directory where you want to create your React app and run the following command: +``` +sudo npx create-react-app sigma-sdk-react +``` + +#### Enable read/wite on project (if required) +```code +sudo chown -R $(whoami) sigma-sdk-react +``` + +### Step 3: Install the Sigma SDK +``` +npm install @sigmacomputing/react-embed-sdk +``` + +### Step 4: Open the project in your code editor (e.g., VSCode). +In the src folder, open the App.js file and modify it as follows: +```code +import React from 'react'; +import './App.css'; + +function App({ embedUrl }) { + return ( +