# Your first Outreach web widget

Creating an Outreach web widget is a matter of creating a web application containing the [Outreach JavaScript SDK](/client-extensions/javascript-sdk).
This sample application contains a
[shell extension](/client-extensions/web-widget-extensions#shell-extension) and a
[prospect tab extension](/client-extensions/web-widget-extensions#tab-extension). Let's bring this sample app to your Outreach
organization. Do not worry, you can't break anything, and you won't disrupt your users.

## Step 1: Create your app

Head to the developer portal and create the app. In the "App name" field enter your app name. The app
identifier will be pre-populated for you based on that name. It needs to be longer than 6 characters, so edit if
necessary and then click "Create app".

## Step 2: Set up the shell extension

1. Click on "Shell extension" section in the left menu and turn on the Shell extension.
2. In "Hosting URL" specify [https://developers.outreach.io/sample-app/sample-app.html](/sample-app/sample-app.html).
3. In "Context properties" select, for example, `usr.email` and `usr.name` to forward the email and name of the currently logged-in
user to the application.


Save your changes to continue.

## Step 3: Set up the Prospect tab extension

1. Click on the "Prospect tab extension" and turn on the Prospect tab extension.
2. In "Hosting URL" specify the same
URL [https://developers.outreach.io/sample-app/sample-app.html](/sample-app/sample-app.html).
3. In "Context properties" select, for example, `pro.accnme` and `pro.accdmn` to forward the Account name and Account domain to the
application.


Save your changes to continue.

## Step 4: Install and test your app

To install the development version of your app select "Install" from the dropdown menu next to your app. The app will be
installed for your user account only and won't be visible to anyone else in your Outreach organization.

Once the app is installed, you should see a new icon appear in the bottom of the Outreach's main toolbar on the left.
That icon launches the shell extension configured in your app. To access your Prospect tab extension navigate to "
Prospects" and select any prospect. Your extension is accessible from the top tab list.

## That's it!

You have now successfully created your first Outreach application containing two extension. Now, work from
the example app source to
create a set of useful extensions. Once that work is done [release your app](/guides/managing-apps).

By the way, while you are developing your application you'll definitely want to know what features the
[Outreach Extensibility SDK](/client-extensions/javascript-sdk) offers, so check that out too.