Skip to content

Commit c33e9e4

Browse files
committed
add new images to vsx article
1 parent 8bd0a90 commit c33e9e4

14 files changed

+29
-25
lines changed

docs/embedded/getting-started/spembedded-for-vscode.md

Lines changed: 29 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,7 @@ ms.localizationpriority: high
77

88
# SharePoint Embedded for Visual Studio Code
99

10-
The SharePoint Embedded Visual Studio Code extension helps developers get started for free with SharePoint Embedded application development. With the extension, developers can:
11-
12-
1. Create and configure Microsoft Entra ID app registrations for use with SharePoint Embedded
13-
1. Create and manage [container types for trial use](../concepts/app-concepts/containertypes.md#trial-use)
14-
1. Create containers
15-
1. Add guest apps on a [container type for trial use](../concepts/app-concepts/containertypes.md#trial-use)
16-
1. Load SharePoint Embedded [sample apps](https://github.com/microsoft/SharePoint-Embedded-Samples) and autopopulate its runtime configuration
17-
1. Export the container type and Microsoft Entra ID app settings to a Postman Environment file for use with the [SharePoint Embedded Postman Collection](https://github.com/microsoft/SharePoint-Embedded-Samples/tree/main/Postman)
10+
The SharePoint Embedded Visual Studio Code extension helps developers get started for free with SharePoint Embedded application development.
1811

1912
> [!IMPORTANT]
2013
> To start building with SharePoint Embedded you will need administrative access to Microsoft 365 tenant.
@@ -28,7 +21,7 @@ The SharePoint Embedded Visual Studio Code extension helps developers get starte
2821
1. Press **"Install"** and the SharePoint Embedded icon will load on the activity bar.
2922
1. Select on the icon to open the SharePoint Embedded view and create a container type with trial configuration.
3023

31-
![SharePoint Embedded on Visual Studio Code Marketplace](../images/vscodelaunch.png)
24+
![SharePoint Embedded VS Extensions](../images/vsx-images/1downloadvsx.png)
3225

3326

3427
## Sign in with admin credentials
@@ -37,15 +30,15 @@ To use the extension, you need to sign into a Microsoft 365 tenant with an admin
3730
If you don't already have a tenant, you can get a tenant through the [Microsoft 365 Developer Program](https://developer.microsoft.com/microsoft-365/dev-program), [Microsoft Customer Digital Experience](https://cdx.transform.microsoft.com/), or create a free trial of an [Microsoft 365 E3 license](https://www.microsoft.com/en-us/microsoft-365/enterprise/microsoft365-plans-and-pricing).
3831

3932

40-
![Install](../images/vscodeinstall.png)
33+
![Install](../images/vsx-images/2vsx-signin.png)
4134

4235

4336
* Authentication will open a new tab in an external browser to sent to permissions
44-
* A pop-up window will prompt permissions, select **Open**
37+
* A pop-up window will prompt permissions, select **Acce[pt**
4538

4639

47-
![consentperms](../images/vscodeconsentperms.png)
48-
![login](../images/vscodelogin.png)
40+
![consentperms](../images/vsx-images/3vsx-grant-admin-consent.png)
41+
4942

5043

5144

@@ -54,13 +47,12 @@ If you don't already have a tenant, you can get a tenant through the [Microsoft
5447

5548
Once you've signed in, you will be prompted to create a [container type with trial configuration](../concepts/app-concepts/containertypes.md#trial-use). A container type lets you get started calling SharePoint Embedded APIs and building a proof-of-concept application using SharePoint Embedded. Learn more about [containertypes](../concepts/app-concepts/containertypes.md).
5649

50+
![home screen](../images/vsx-images/4vsx-home-screen.png)
51+
5752
* Click on **Create Trial Container Type**
5853
* Follow the prompts to name your container type. You can change your container type name later on
5954

60-
![Create free trial container type](https://github.com/microsoft/SharePoint-Embedded-VS-Code-Extension/assets/108372230/a8186b2b-bdf9-400b-820b-2e6ebe51d393)
61-
62-
![Name container type](https://github.com/microsoft/SharePoint-Embedded-VS-Code-Extension/assets/108372230/f465d36e-57e8-472a-9d10-7374a28b24b1)
63-
55+
![create container type](../images/vsx-images/5a-name-ct.png)
6456

6557
> [!NOTE]
6658
> SharePoint Embedded for Visual Studio Code only supports container types with trial configuration at this time. Other container types with standard or pass-through billing configurations must be created using the SharePoint Online PowerShell Module.
@@ -71,15 +63,14 @@ Every container type is owned by a Microsoft Entra ID application. The first ste
7163

7264
* Follow the prompts to name your new Entra application or select an existing application ID
7365

74-
![Create App](https://github.com/microsoft/SharePoint-Embedded-VS-Code-Extension/assets/108372230/944ecf1b-491c-4e5c-b887-73a5d709e9c5)
66+
![Create App](../images/vsx-images/6aname-app.png)
7567

7668
> [!NOTE]
7769
> If you choose an existing application, the extension will update that app's configuration settings for it to work with both SharePoint Embedded and this extension. Doing this is NOT recommended on production applications.
7870
7971

8072
After your container type is created and your application is configure, you will be able to view your Local tenant registration as a tree in the left nav-bar
8173

82-
![vscodetree](../images/vscodetree.png)
8374

8475
## Register container type
8576

@@ -88,21 +79,34 @@ After creating a container type, you will need to register that container type o
8879
* Follow the prompt and click **'Register on local tenant'**
8980
* If you do not see the prompt, right-click on your `<container-type-name>` and select **Register** from the menu
9081

91-
![register](../images/vscoderegister.png)
82+
![register](../images/vsx-images/7aregister-ct.png)
83+
84+
#### Granting permissions
9285

93-
#### Granting admin consent
86+
When registering your container type you will need to grant permissions to access your application
9487

95-
An external browser window will pop open to grant admin consent
88+
![register permissions](../images/vsx-images/8aopenconsentlink.png)
89+
90+
An external browser window will pop open for you to login and grant admin consent
91+
92+
![login permissions](../images/vsx-images/9alogin-grant-permissions.png)
9693

9794
## Create a container
9895

99-
You can create up to five containers of trial container type to upload and manage content.
96+
With your trial container type registered, you can create your first container. Only five containers of trial container type can be created to upload and manage content.
10097

10198
* Right-click on the **Containers** drop-down from the tree in the left nav-bar and select **Create container**
10299
* Enter a name for the container you would like to create
103100

104-
![create container](../images/vscodecontcreate.png)
105-
![name container](../images/vscodecontname.png)
101+
![create container](../images/vsx-images/10acreate-container.png)
102+
![name container](../images/vsx-images/11aname-first-cont.png)
103+
104+
### Recycling Containers
105+
106+
You also have the option to recycle and recover containers within the extension.
107+
108+
![recycle containers](../images/vsx-images/12arecycle-cont.png)
109+
![final home page](../images/vsx-images/a-final-home-page.png)
106110

107111

108112
### Load Sample App
Loading
Loading
Loading
1.99 MB
Loading
1.72 MB
Loading
Loading
Loading
Loading
84.7 KB
Loading

0 commit comments

Comments
 (0)