You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: articles/search/includes/tutorial-add-search-website-create-app.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -37,7 +37,7 @@ The static web app pulls the information and files for deployment from GitHub us
37
37
|Select a SKU| Select the free SKU for this tutorial.|
38
38
|Select a location for new resources.|For Node.js: Select `West US 2` during the Azure Function programming model (PM) v4 preview. For C# and Python, select a region near you.|
39
39
|Choose build preset to configure default project structure.|Select **Custom**|
40
-
|Select the location of your application code|`search-website-functions-v4/client-v4`<br><br>This is the path, from the root of the repository, to your static web app. |
40
+
|Select the location of your client application code|`search-website-functions-v4/client-v4`<br><br>This is the path, from the root of the repository, to your static web app. |
41
41
|Select the location of your Azure Functions code|`search-website-functions-v4/api-v4`<br><br>This is the path, from the root of the repository, to your static web app. If there are no other functions in the repository, you won't be prompted for the function code location. Currently, you'll need to perform extra steps to ensure the function code location is correct. These steps are performed after the resource is created and are documented in this article. |
42
42
|Enter the path of your build output...|`build`<br><br>This is the path, from your static web app, to your generated files.|
43
43
@@ -53,7 +53,7 @@ The static web app pulls the information and files for deployment from GitHub us
53
53
54
54
:::image type="content" source="../media/tutorial-javascript-static-web-app/visual-studio-code-azure-activity-log.png" alt-text="Screenshot of the Activity Log in Visual Studio Code." border="true":::
55
55
56
-
1. Currently, the YML file is created with erroneous path syntax for the Azure function code. Use this workaround to correct the syntax. You can perfrom this step as soon as the YML file is created. A new workflow will launch as soon as you push the updates:
56
+
1. Currently, the YML file is created with erroneous path syntax for the Azure function code. Use this workaround to correct the syntax. You can perform this step as soon as the YML file is created. A new workflow will launch as soon as you push the updates:
57
57
58
58
1. In Visual Studio Code explorer, open the `./.github/workflows/` directory.
59
59
@@ -137,7 +137,7 @@ The Azure Function app won't return search data until the search secrets are in
137
137
138
138
1. Select **Save** to save the settings.
139
139
140
-
:::image type="content" source="../media/tutorial-javascript-static-web-app/save-new-application-setting-to-static-web-app-in-portal.png" alt-text="Screenshot of browser showing Azure portal with the button to save the settings for your app..":::
140
+
:::image type="content" source="../media/tutorial-javascript-static-web-app/save-new-application-setting-to-static-web-app-in-portal.png" alt-text="Screenshot of browser showing Azure portal with the button to save the settings for your app.":::
Copy file name to clipboardExpand all lines: articles/search/includes/tutorial-add-search-website-troubleshooting.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -20,4 +20,4 @@ If the web app didn't deploy or work, use the following list to determine and fi
20
20
21
21
You should be able to interact with the client app, searching for books and filtering. If the form doesn't return any values, open the browser's developer tools, and determine if the HTTP calls to the API were successful. If the calls weren't successful, the most likely reason if the static web app configurations for the API endpoint name and Search query key are incorrect.
22
22
23
-
If the path to the Azure function code (`api_location`) isn't correct in the YML file, the application loads but won't call any of the functions that provide integration with Cognitive Search. Revisit the workaround in the deployment section for help in correcting the path.
23
+
If the path to the Azure function code (`api_location`) isn't correct in the YML file, the application loads but won't call any of the functions that provide integration with Cognitive Search. Revisit the workaround in the deployment section for help with correcting the path.
Copy file name to clipboardExpand all lines: articles/search/includes/tutorial-add-search-website-what-sample-does.md
+3-1Lines changed: 3 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,8 +9,10 @@ This sample website provides access to a catalog of 10,000 books. A user can sea
9
9
10
10
:::image type="content" source="../media/tutorial-javascript-overview/cognitive-search-enabled-book-website-2.png" alt-text="Screeshot of the sample app in a browser window.":::
11
11
12
-
The search experience includes:
12
+
The search experience includes:
13
13
14
14
* Search – provides search functionality for the application.
15
15
* Suggest – provides suggestions as the user is typing in the search bar.
16
+
* Facets and filters - provides a faceted navigation structure that filters by author or language.
17
+
* Paginated results - provides paging controls for scrolling through results.
16
18
* Document Lookup – looks up a document by ID to retrieve all of its contents for the details page.
Copy file name to clipboardExpand all lines: articles/search/tutorial-javascript-overview.md
+5-3Lines changed: 5 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -14,9 +14,11 @@ ms.devlang: javascript
14
14
15
15
# 1 - Overview of adding search to a website
16
16
17
-
In this Azure Cognitive Search tutorial, create a web app that searches through a catalog of books, and then deploy the website to an Azure Static Web Apps resource. This tutorial is for JavaScript developers who want to know more about creating a client app that includes user interactions like faceted navigation, typeahead, and pagination. It also demonstrates the `@azure/search-documents` library in the Azure SDK for JavaScript for calls to Azure Cognitive Search for indexing and query workflows.
17
+
In this Azure Cognitive Search tutorial, create a web app that searches through a catalog of books, and then deploy the website to an Azure Static Web Apps resource.
18
18
19
-
The source code is available in the [azure-search-javascript-samples](https://github.com/Azure-Samples/azure-search-javascript-samples/tree/master/search-website-functions-v4) GitHub repository.
19
+
This tutorial is for JavaScript developers who want to create a frontend client app that includes search interactions like faceted navigation, typeahead, and pagination. It also demonstrates the `@azure/search-documents` library in the Azure SDK for JavaScript for calls to Azure Cognitive Search for indexing and query workflows on the backend.
20
+
21
+
Source code is available in the [azure-search-javascript-samples](https://github.com/Azure-Samples/azure-search-javascript-samples/tree/master/search-website-functions-v4) GitHub repository.
20
22
21
23
## What does the sample do?
22
24
@@ -38,7 +40,7 @@ Install the following software in your local development environment.
38
40
39
41
-[Node.js LTS](https://nodejs.org/en/download)
40
42
- Select latest runtime and version from this [list of supported language versions](../azure-functions/functions-versions.md?pivots=programming-language-javascript&tabs=azure-cli%2clinux%2cin-process%2cv4#languages).
41
-
- If you have a different version of Node.js installed on your local computer, consider using [Node Version Manager](https://github.com/nvm-sh/nvm) (nvm) or a Docker container.
43
+
- If you have a different version of Node.js installed on your local computer, consider using [Node Version Manager](https://github.com/nvm-sh/nvm) (`nvm`) or a Docker container.
42
44
-[Git](https://git-scm.com/downloads)
43
45
-[Visual Studio Code](https://code.visualstudio.com/) and the following extensions
44
46
-[Azure Static Web App](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurestaticwebapps)
Copy file name to clipboardExpand all lines: articles/search/tutorial-javascript-search-query-integration.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -73,11 +73,11 @@ This function API is called in the React app at `\src\pages\Details\Detail.js` a
73
73
74
74
## Next steps
75
75
76
-
In this tutorial series, you learned how to create and load a search index in JavaScript, and you built a web app that provides a search experience that includes a search bar, faceted navigation and filters, suggestions, pagination, and lookup.
76
+
In this tutorial series, you learned how to create and load a search index in JavaScript, and you built a web app that provides a search experience that includes a search bar, faceted navigation and filters, suggestions, pagination, and document look up.
77
77
78
78
As a next step, you can extend this sample in several directions:
79
79
80
80
* Add [autocomplete](search-add-autocomplete-suggestions.md) for more typeahead.
81
81
* Add or modify [facets](search-faceted-navigation.md) and [filters](search-filters.md).
82
82
* Change the authentication and authorization model, using [Azure Active Directory](search-security-rbac.md) instead of [key-based authentication](search-security-api-keys.md).
83
-
* Change the [indexing methodology](search-what-is-data-import.md). Instead of pushing JSON to a search documents, preload a blob container with the good-books dataset and [set up a blob indexer](search-howto-indexing-azure-blob-storage.md) to ingest the data. Knowing how to work with indexers gives you more options for data ingestion and [content enrichment](cognitive-search-concept-intro.md) during indexing.
83
+
* Change the [indexing methodology](search-what-is-data-import.md). Instead of pushing JSON to a search index, preload a blob container with the good-books dataset and [set up a blob indexer](search-howto-indexing-azure-blob-storage.md) to ingest the data. Knowing how to work with indexers gives you more options for data ingestion and [content enrichment](cognitive-search-concept-intro.md) during indexing.
0 commit comments