Skip to content

Commit 8bbee48

Browse files
committed
work in progress
1 parent 0b9dbc5 commit 8bbee48

File tree

1 file changed

+40
-22
lines changed

1 file changed

+40
-22
lines changed

articles/azure-web-pubsub/quickstart-use-client-sdk.md

Lines changed: 40 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Quickstart: Create a client using the Azure Web PubSub client SDK (preview)
2+
title: Quickstart - Create a client using the Azure Web PubSub client SDK (preview)
33
description: Quickstart showing how to use the Azure Web PubSub client SDK
44
author: zackliu
55
ms.author: chenyl
@@ -13,15 +13,15 @@ ms.devlang: azurecli
1313
# Quickstart: Create a client using the Azure Web PubSub client SDK (preview)
1414

1515
Get started with the Azure Web PubSub client SDK for Python or JavaScript to create a pub-sub client
16-
that:
16+
that:
1717

1818
* connects to a Web PubSub service instance
1919
* subscribes a Web PubSub group.
2020
* publishes a message to the Web PubSub group.
2121

2222
[API reference documentation](https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/web-pubsub/web-pubsub-client) | [Library source code](https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/web-pubsub/web-pubsub-client/src) | [Package (JavaScript npm)](https://www.npmjs.com/package/@azure/web-pubsub-client) | [Samples](https://github.com/Azure/azure-sdk-for-js/blob/main/sdk/web-pubsub/web-pubsub-client/samples-dev/helloworld.ts)
2323

24-
[API reference documentation](https://github.com/Azure/azure-sdk-for-net#azure-sdk-for-net) | [Library source code](https://github.com/Azure/azure-sdk-for-net/tree/main/sdk/webpubsub/Azure.Messaging.WebPubSub.Client/src) | [Package (NuGet))](https://www.nuget.org/packages/Azure.Messaging.WebPubSub.Client) | [Samples](https://github.com/Azure/azure-sdk-for-net/tree/main/sdk/webpubsub/Azure.Messaging.WebPubSub.Client/samples)
24+
[API reference documentation](https://github.com/Azure/azure-sdk-for-net#azure-sdk-for-net) | [Library source code](https://github.com/Azure/azure-sdk-for-net/tree/main/sdk/webpubsub/Azure.Messaging.WebPubSub.Client/src) | [Package (NuGet)](https://www.nuget.org/packages/Azure.Messaging.WebPubSub.Client) | [Samples](https://github.com/Azure/azure-sdk-for-net/tree/main/sdk/webpubsub/Azure.Messaging.WebPubSub.Client/samples)
2525

2626

2727
> [!NOTE]
@@ -30,14 +30,13 @@ Get started with the Azure Web PubSub client SDK for Python or JavaScript to cre
3030
## Prerequisites
3131

3232
- An Azure account with an active subscription. [Create an account for free](https://azure.microsoft.com/free/?WT.mc_id=A261C142F).
33-
- A Web PubSub instance. If you haven't created one, you can follow the guidance: [Create a Web PubSub instance from Azure portal](./howto-develop-create-instance.md)
3433
- A file editor such as Visual Studio Code.
3534

3635
## Setting up
3736

3837
### Create an Azure Web PubSub service instance
3938

40-
1. In the Azure portal and from **Home**, select **Create a resource**.
39+
1. In the Azure portal **Home** page, select **Create a resource**.
4140
1. In the **Search the Marketplace** box, enter *Web PubSub*.
4241
1. Select **Web PubSub** from the results.
4342
1. Select **Create**.
@@ -47,7 +46,7 @@ Get started with the Azure Web PubSub client SDK for Python or JavaScript to cre
4746
1. Enter a **Resource Name** for the service instance.
4847
1. Select **Pricing tier**. You can choose **Free** for testing.
4948
1. Select **Create**, then **Create** again to confirm the new service instance.
50-
1. Select **Go to resource** to go to the service instance when the deployment is complete.
49+
1. Once deployment is complete, select **Go to resource**.
5150

5251
### Generate the client URL
5352

@@ -88,31 +87,44 @@ Install both the .NET Core SDK and dotnet runtime.
8887

8988
### Install the package
9089

90+
Install the Azure Web PubSub client SDK for the language you're using.
91+
9192
# [JavaScript](#tab/javascript)
9293

93-
The SDK is available as an [npm module](https://www.npmjs.com/package/@azure/web-pubsub-client)
94+
The SDK is available as an [npm module](https://www.npmjs.com/package/@azure/web-pubsub-client).
95+
96+
OPen a terminal winder and install the Web PubSub client SDK using the following command.
9497

9598
```bash
9699
npm install @azure/web-pubsub-client
97100
```
98101

102+
Note that the SDK is available as an [npm module](https://www.npmjs.com/package/@azure/web-pubsub-client).
103+
99104
# [C#](#tab/csharp)
100105

101-
The SDK is available as an [NuGet packet](https://www.nuget.org/packages/Azure.Messaging.WebPubSub.Client)
106+
Open a terminal window to create your project and install the Web PubSub client SDK.
102107

103108
```bash
109+
# create project directory
110+
mkdir webpubsub-client
111+
112+
# change to the project directory
113+
cd webpubsub-client
114+
104115
# Add a new .net project
105116
dotnet new console
106117

107118
# Add the client SDK
108119
dotnet add package Azure.Messaging.WebPubSub.Client --prerelease
109120
```
110121

122+
Note that the The SDK is available as a [NuGet packet](https://www.nuget.org/packages/Azure.Messaging.WebPubSub.Client).
123+
111124
---
112125

113126
## Code examples
114127

115-
From your terminal window, create a new directory and navigate to it.
116128

117129
### Create and connect to the Web PubSub service
118130

@@ -122,6 +134,13 @@ For this example, you can use the Client Access URL you generated in the portal.
122134

123135
# [JavaScript](#tab/javascript)
124136

137+
In the terminal window, create a new directory for your project and change to that directory.
138+
139+
```bash
140+
mkdir webpubsub-client
141+
cd webpubsub-client
142+
```
143+
125144
Create a file with name `index.js` and enter following code:
126145

127146
```javascript
@@ -145,13 +164,13 @@ var client = new WebPubSubClient(new Uri(clientURL));
145164

146165
---
147166

148-
## Subscribe to a group
167+
### Subscribe to a group
149168

150169
To receive message from a group, you need to subscribe to the group and add a callback to handle messages you receive from the group. The following code subscribes the client to a group called `group1`.
151170

152171
# [JavaScript](#tab/javascript)
153172

154-
Add this code to the `index.js` file:
173+
Add this following code to the `index.js` file:
155174

156175
```javascript
157176
// callback to group messages.
@@ -168,7 +187,7 @@ client.joinGroup("group1");
168187

169188
# [C#](#tab/csharp)
170189

171-
Add this code to the `Program.cs` file:
190+
Add the following code to the `Program.cs` file:
172191

173192
```csharp
174193
// callback to group messages.
@@ -184,23 +203,24 @@ await client.StartAsync();
184203
// join a group to subscribe message from the group
185204
await client.JoinGroupAsync("group1");
186205
```
206+
187207
---
188208

189-
## Publish a message to a group
209+
### Publish a message to a group
190210

191-
Then you can send messages to the group and as the client has joined the group before, you can receive the message you've sent.
211+
After your client has subscribed to the group, it can send messages to and receive the message from the group.
192212

193213
# [JavaScript](#tab/javascript)
194214

195-
Add this code to the `index.js` file:
215+
Add the following code to the `index.js` file:
196216

197217
```javascript
198218
client.sendToGroup("group1", "Hello World", "text");
199219
```
200220

201221
# [C#](#tab/csharp)
202222

203-
Add this code to the `Program.cs` file:
223+
Add the following code to the `Program.cs` file:
204224

205225
```csharp
206226
await client.SendToGroupAsync("group1", BinaryData.FromString("Hello World"), WebPubSubDataType.Text);
@@ -210,11 +230,11 @@ await client.SendToGroupAsync("group1", BinaryData.FromString("Hello World"), We
210230

211231
## Run the code
212232

213-
Run the client in your terminal. To verify the client is sending and receiving messages, you can open a second terminal and start the client from the same directory. You see the message you sent in the first terminal window.
233+
Run the client in your terminal. To verify the client is sending and receiving messages, you can open a second terminal and start the client from the same directory. You can see the message you sent from the second client in the first client's terminal window.
214234

215235
# [JavaScript](#tab/javascript)
216236

217-
Add this code to the `index.js` file:
237+
To start the client go the terminal and run the following command. Replace the `<Client Access URL>` with the Client Access URL you copied from the portal.
218238

219239
```bash
220240
export WebPubSubClientURL="<Client Access URL>"
@@ -223,7 +243,7 @@ node index.js
223243

224244
# [C#](#tab/csharp)
225245

226-
Copy the Client Access URL from the portal and run the following command in your terminal replacing the `<client-access-url>` with the Client Access URL you copied from the portal:
246+
To start the client, run the following command in your terminal replacing the `<client-access-url>` with the Client Access URL you copied from the portal:
227247

228248
```bash
229249
dotnet run <client-access-url>
@@ -237,9 +257,7 @@ To delete the resources you created in this quickstart, you can delete the resou
237257

238258
## Next steps
239259

240-
This quickstart provides you with a basic idea of how to connect to the Web PubSub with client SDK and how to subscribe to group messages and publish messages to groups.
241-
242-
To learn more the Web PubSub service SDKs, see the following resources:
260+
To learn more the Web PubSub service client SDKs, see the following resources:
243261

244262
# [JavaScript](#tab/javascript)
245263

0 commit comments

Comments
 (0)