diff --git a/docs/tutorials/web/excel-addin-bert-js.md b/docs/tutorials/web/excel-addin-bert-js.md index 9fea83df08..544ba147ea 100644 --- a/docs/tutorials/web/excel-addin-bert-js.md +++ b/docs/tutorials/web/excel-addin-bert-js.md @@ -10,16 +10,19 @@ nav_order: 2 # ONNX Runtime Custom Excel Functions for BERT NLP Tasks in JavaScript {: .no_toc } -In this tutorial we will look at how we can create custom excel functions (`ORT.Sentiment()` and `ORT.Question()`) to implement BERT NLP models with ONNX Runtime Web to enable deep learning in spreadsheet tasks. The inference happen locally in the browser with excel on the web. +In this tutorial we will look at how we can create custom Excel functions (`ORT.Sentiment()` and `ORT.Question()`) to implement BERT NLP models with ONNX Runtime Web to enable deep learning in spreadsheet tasks. The inference happens locally, right in Excel! -
+Image of browser inferencing on sample images. + + + ## Contents {: .no_toc } @@ -40,16 +43,35 @@ Excel has many native functions like `SUM()` that you are likely familiar with. Now that we know what custom functions are lets look at how we can create functions that will inference a model locally to get the sentiment text in a cell or extract information from a cell by asking a question and the answer being returned to the cell. -- If you plan to follow along, [clone the project that we will discuss in this blog](https://github.com/cassiebreviu/bert-excel-addin-ort-web). This project was created with the template project from the Yeoman cli. [Learn more in this quickstart about the base projects](https://learn.microsoft.com/office/dev/add-ins/tutorials/excel-tutorial-create-custom-functions). +- If you plan to follow along, [clone the project that we will discuss in this blog](https://github.com/cassiebreviu/bert-excel-addin-ort-web). This project was created with the template project from the Yeoman CLI. [Learn more in this quickstart about the base projects](https://learn.microsoft.com/office/dev/add-ins/tutorials/excel-tutorial-create-custom-functions). -- Once you clone the project then you can run the project with the below command. This will start Excel web and side load the add-in to the spreadsheet that is provided in the command. +- Run the following commands to install the packages and build the project. + +```bash +npm install +npm run build +``` + +- The below commend will run the add-in in Excel web and side load the add-in to the spreadsheet that is provided in the command. ```bash // Command to run on the web. // Replace "{url}" with the URL of an Excel document. npm run start:web -- --document {url} ``` -- NOTE: You may need to `Enable Developer Mode` when prompted and accept the certificate for the side loaded add-in when you run the project for the first time. + +- Use the following command to run in the Excel client. + +```bash +// Command to run on desktop (Windows or Mac) +npm run start:desktop +``` + +- The first time you run the project there will be two prompts: + - One will ask to `Enable Developer Mode`. This is required for sideloading plugins. + - Next when prompted accept the certificate for the plugin service. + +- To access the custom function type `=ORT.Sentiment("TEXT")` and `=ORT.Question("QUESTION","CONTEXT")` in an empty cell and pass in the parameters. Now we are ready to jump into the code! @@ -62,6 +84,8 @@ Now we are ready to jump into the code! ORT ``` +Learn more about the configuration of the [mainfest file here](https://learn.microsoft.com/office/dev/add-ins/develop/configure-your-add-in-to-use-a-shared-runtime#configure-the-manifest). + ## The `functions.ts` file In the [`function.ts`](https://github.com/cassiebreviu/bert-excel-addin-ort-web/blob/main/src/functions/functions.ts) file we define the functions name, parameters, logic and return type. @@ -226,7 +250,7 @@ export async function inferenceQuestion(question: string, context: string): Prom } ``` -- The `answers` are then returned back to the `functions.ts` `question`, the resulting string is returned and populated into the excel cell. +- The `answers` are then returned back to the `functions.ts` `question`, the resulting string is returned and populated into the Excel cell. ```javascript export async function question(question: string, context: string): Promise { @@ -238,7 +262,7 @@ export async function question(question: string, context: string): Promise { @@ -326,7 +350,7 @@ export async function sentiment(text: string): Promise { } ``` -- Now you can run the below command to build and side load the add-in to your excel spreadsheet! +- Now you can run the below command to build and side load the add-in to your Excel spreadsheet! ```bash // Command to run on the web. @@ -336,7 +360,7 @@ npm run start:web -- --document {url} ## Conclusion -Here we went over the logic needed to create custom functions in an excel add-in with JavaScript leveraging ONNX Runtime Web and open source models. From here you could take this logic and update to a specific model or use case you have. Be sure to check out the full source code which includes the tokenizers and pre/post processing to complete the above tasks. +Here we went over the logic needed to create custom functions in an Excel add-in with JavaScript leveraging ONNX Runtime Web and open source models. From here you could take this logic and update to a specific model or use case you have. Be sure to check out the full source code which includes the tokenizers and pre/post processing to complete the above tasks. ## Additional resources * [Publish Add-ins in VS Code](https://learn.microsoft.com/en-us/office/dev/add-ins/publish/publish-add-in-vs-code#using-visual-studio-code-to-publish) diff --git a/images/bert-excel.gif b/images/bert-excel.gif new file mode 100644 index 0000000000..f3e82ef30b Binary files /dev/null and b/images/bert-excel.gif differ