eShopSupport Reference Implementation

eShopSupport is a sample .NET application designed to showcase Generative AI use cases within a services-based architecture using .NET Aspire. It demonstrates how to build AI-driven customer support features for e-commerce.

Key AI capabilities included in the sample:

• Text classification: Applying labels to content.
• Sentiment analysis: Analyzing message content.
• Summarization: Condensing large sets of text.
• Synthetic data generation: Creating test content via the DataGenerator project.
• Chat bot interactions: Managing chat history and providing suggested responses.

The dist/ directory contains the compiled and minified assets. The structure typically looks like this:

• CSS: Located in dist/css/. Includes bootstrap.css (compiled), bootstrap.min.css (minified), and specialized files like bootstrap-grid.css and bootstrap-reboot.css.
• JS: Located in dist/js/. Includes bootstrap.js (compiled) and bootstrap.min.js (minified).
• Bundled JS: bootstrap.bundle.js and bootstrap.bundle.min.js include Popper (required for tooltips and popovers) but do not include jQuery.
• Source Maps: Files ending in .map are provided for use with browser developer tools.

bootstrap/
└── dist/
    ├── css/
    │   ├── bootstrap.css
    │   ├── bootstrap.min.css
    │   └── ...
    └── js/
        ├── bootstrap.bundle.js
        ├── bootstrap.min.js
        └── ...

To use jQuery in a Node.js environment (e.g., for testing), you must first install it via npm. Because jQuery requires a DOM (window and document) which Node.js does not provide natively, you must mock the environment using a tool like jsdom.

npm install jquery

const { JSDOM } = require( "jsdom" );
const { window } = new JSDOM( "" );
const $ = require( "jquery" )( window );

Ensure Docker is started before attempting to run the application.

Using Visual Studio (Windows)

1. Open eShopSupport.sln.
2. Set AppHost as your startup project.
3. Press Ctrl+F5 to launch via .NET Aspire.

Using the Terminal (All Platforms)

Run the AppHost project directly using the .NET CLI:

dotnet run --project src/AppHost

After running, watch the console output for the Aspire dashboard login URL, which will look like: Login to the dashboard at: http://localhost:17191/login?t=uniquelogincodeforyou.

Note: If you encounter HTTPS issues, you may need to install ASP.NET Core HTTPS development certificates: https://aka.ms/aspnet/https-trust-dev-cert.

You can include jQuery in a web page using several methods depending on your build pipeline:

• Script Tag: The simplest method for standard HTML pages.
• Babel: Use ES6 modules if you are using a compiler like Babel.
• Browserify/Webpack: Use CommonJS require syntax for module bundlers.
• AMD: Use the define syntax for Asynchronous Module Definition environments like RequireJS.

<!-- Script tag -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

<!-- Babel (ES6 Modules) -->
import $ from "jquery";

<!-- Browserify/Webpack (CommonJS) -->
var $ = require( "jquery" );

<!-- AMD -->
define( [ "jquery" ], function( $ ) {

} );

To run the Bootstrap documentation site on your local machine, follow these steps:

1. Install Ruby dependencies: Use bundle install to install Jekyll (the site builder) and other required Ruby dependencies.
2. Install Node.js dependencies: Run npm install.
3. Compile and Watch: Run npm start to compile CSS/JS files, generate the documentation, and watch for changes.
4. View Docs: Open http://localhost:9001 in your browser.

You can install Bootstrap using several package managers depending on your environment:

• npm: npm install bootstrap
• yarn: yarn add bootstrap@4.5.3
• Composer: composer require twbs/bootstrap:4.5.3
• NuGet (for .NET projects):
  • CSS: Install-Package bootstrap
  • Sass: Install-Package bootstrap.sass

Alternatively, you can download the latest release zip or clone the repository directly via Git.

npm install bootstrap
# or
yarn add bootstrap@4.5.3
# or
# NuGet (Package Manager Console)
Install-Package bootstrap

The application leverages Python projects within the .NET Aspire solution. You must install the necessary Python dependencies from the root of the cloned repository.

On most systems:

pip install -r src/PythonInference/requirements.txt

On Windows, if the above fails, use:

py -m pip install -r src/PythonInference/requirements.txt

The NameEmbedding property in the Product class uses a custom EmbeddingJsonConverter. This converter handles the conversion between a ReadOnlyMemory<float> and a Base64 encoded string in JSON.

• Serialization (Write): The float array is converted to bytes and written as a Base64 string.
• Deserialization (Read): The Base64 string is decoded into bytes and cast back into a float array.

When interacting with the API or raw JSON data for a Product, ensure that the NameEmbedding field is provided as a Base64 encoded string representing the underlying byte sequence of the float values.

{
  "ProductId": 1,
  "Brand": "ExampleBrand",
  "Model": "ExampleModel",
  "Description": "Example Description",
  "Price": 99.99,
  "NameEmbedding": "Base64EncodedBytesHere"
}