docs(js): Create Azure Functions quick start guide (#15831)

<!-- Use this checklist to make sure your PR is ready for merge. You may
delete any sections you don't need. -->

## DESCRIBE YOUR PR
This branch contains the updated quick start guide for Azure Functions.

Closes: #15780 
## IS YOUR CHANGE URGENT?  

Help us prioritize incoming PRs by letting us know when the change needs
to go live.
- [ ] Urgent deadline (GA date, etc.): <!-- ENTER DATE HERE -->
- [ ] Other deadline: <!-- ENTER DATE HERE -->
- [x] None: Not urgent, can wait up to 1 week+

## SLA

- Teamwork makes the dream work, so please add a reviewer to your PRs.
- Please give the docs team up to 1 week to review your PR unless you've
added an urgent due date to it.
Thanks in advance for your help!

## PRE-MERGE CHECKLIST

*Make sure you've checked the following before merging your changes:*

- [ ] Checked Vercel preview for correctness, including links
- [ ] PR was reviewed and approved by any necessary SMEs (subject matter
experts)
- [ ] PR was reviewed and approved by a member of the [Sentry docs
team](https://github.com/orgs/getsentry/teams/docs)

## EXTRA RESOURCES

- [Sentry Docs contributor guide](https://docs.sentry.io/contributing/)

Author: inventarSarah

docs/platforms/javascript/guides/azure-functions/index.mdx

@@ -1,6 +1,6 @@
 ---
 title: Azure Functions
-description: Azure Functions is a serverless compute service offered as part of Microsoft Azure. Learn how to set it up with Sentry.
+description: Learn how to manually set up Sentry in your Azure Functions and capture your first errors.
 sdk: sentry.javascript.astro
 categories:
   - javascript
@@ -9,23 +9,27 @@ categories:
   - serverless
 ---
 
-## Features
+<PlatformContent includePath="getting-started-prerequisites" />
 
-In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also collect and analyze performance profiles from real users with [profiling](/product/explore/profiling/).
+## Step 1: Install
 
-Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below.
+Choose the features you want to configure, and this guide will show you how:
 
-## Install
+<OnboardingOptionButtons
+  options={["error-monitoring", "performance", "profiling", "logs"]}
+/>
 
-<OnboardingOptionButtons options={["error-monitoring", "performance", "profiling", "logs"]} />
+<PlatformContent includePath="getting-started-features-expandable" />
 
-Sentry captures data by using an SDK within your application's runtime. This means that you have to add `@sentry/node` as a runtime dependency to your application:
+### Install the Sentry SDK
+
+Run the command for your preferred package manager to add `@sentry/node` as a runtime dependency to your application:
 
 <PlatformContent includePath="getting-started-install" />
 
-## Configure
+## Step 2: Configure
 
-To set up Sentry error logging for an Azure Function:
+Make sure to initialize Sentry at the top of your function file before importing any other modules:
 
 ```javascript {tabTitle:async}
 const Sentry = require("@sentry/node");
@@ -35,53 +39,146 @@ const { nodeProfilingIntegration } = require("@sentry/profiling-node");
 // ___PRODUCT_OPTION_END___ profiling
 Sentry.init({
   dsn: "___PUBLIC_DSN___",
-  
+
   // Adds request headers and IP for users, for more info visit:
   // https://docs.sentry.io/platforms/javascript/guides/azure-functions/configuration/options/#sendDefaultPii
   sendDefaultPii: true,
   // ___PRODUCT_OPTION_START___ profiling
-  
-  integrations: [
-    nodeProfilingIntegration(),
-  ],
-  // ___PRODUCT_OPTION_END___ profiling
 
+  integrations: [nodeProfilingIntegration()],
+  // ___PRODUCT_OPTION_END___ profiling
   // ___PRODUCT_OPTION_START___ performance
+
   // Add Performance Monitoring by setting tracesSampleRate
   // Set tracesSampleRate to 1.0 to capture 100% of transactions
   // We recommend adjusting this value in production
   // Learn more at
   // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate
   tracesSampleRate: 1.0,
   // ___PRODUCT_OPTION_END___ performance
-
   // ___PRODUCT_OPTION_START___ profiling
+
   // Set sampling rate for profiling - this is relative to tracesSampleRate
   profilesSampleRate: 1.0,
   // ___PRODUCT_OPTION_END___ profiling
+  // ___PRODUCT_OPTION_START___ logs
+
+  // Enable logs to be sent to Sentry
+  enableLogs: true,
+  // ___PRODUCT_OPTION_END___ logs
 });
 
+// your function code
+```
+
+### Capture Errors
+
+Because Azure Functions are short-lived, you have to explicitly `flush` Sentry events after calling `captureException`, or they may be lost before being sent to Sentry.
+
+```javascript {tabTitle:async}
+const Sentry = require("@sentry/node");
+
+// your Sentry init code
+
 module.exports = async function (context, req) {
   try {
-    await notExistFunction();
+    // Your function code
   } catch (e) {
+    // use Sentry.withScope to enrich the event with request data
     Sentry.withScope((scope) => {
+      // Attach request context (requires sendDefaultPii: true)
       scope.setSDKProcessingMetadata({ request: req });
       Sentry.captureException(e);
     });
     await Sentry.flush(2000);
   }
+  // ...
+};
+```
+
+## Step 3: Add Readable Stack Traces With Source Maps (Optional)
+
+<PlatformContent includePath="getting-started-sourcemaps-short-version" />
+
+## Step 4: Verify Your Setup
+
+Let's test your setup and confirm that Sentry is working correctly and sending data to your Sentry project.
+
+### Issues
+
+First, let's verify that Sentry captures errors and creates issues in your Sentry project. Add an intentional error in your function:
+
+```javascript {tabTitle:async}
+const Sentry = require("@sentry/node");
+
+module.exports = async function (context, req) {
+  try {
+    // This function does not exist, triggering an error
+    await notExistFunction();
+  } catch (e) {
+    Sentry.withScope((scope) => {
+      scope.setSDKProcessingMetadata({ request: req });
+      Sentry.captureException(e);
+    });
+  }
+
+  // Wait for the event to be sent before the function execution ends
+  await Sentry.flush(2000);
+
+  context.res = {
+    status: 500,
+    body: "Test error sent to Sentry.",
+  };
+};
+```
+
+Deploy and trigger your function to throw an error.
+
+<OnboardingOption optionId="performance">
+### Tracing
+To test tracing, update your function to include a custom span:
+
+```javascript {tabTitle:async}
+const Sentry = require("@sentry/node");
+
+module.exports = async function (context, req) {
+  await Sentry.startSpan({ name: "My Custom Span", op: "task" }, async () => {
+    // Simulate some work
+    await new Promise((resolve) => setTimeout(resolve, 100));
+  });
+
+  // Wait for the event to be sent before the function execution ends
+  await Sentry.flush(2000);
 
   context.res = {
     status: 200,
-    body: "Hello from Azure Cloud Function!",
+    body: "Hello world!",
   };
 };
 ```
 
+Deploy and trigger your function to start a child span.
+
+</OnboardingOption>
+
+### View Captured Data in Sentry
+
+Now, head over to your project on [Sentry.io](https://sentry.io/) to view the collected data (it takes a couple of moments for the data to appear).
+
+<PlatformContent includePath="getting-started-verify-locate-data" />
+
+## Next Steps
+
+At this point, you should have integrated Sentry into your Azure Function and should already be sending data to your Sentry project.
+
+Now's a good time to customize your setup and look into more advanced topics. Our next recommended steps for you are:
 
-You can obtain the DSN using your Sentry account from your organization's _Settings > Projects > Client Keys (DSN)_ in the Sentry web UI.
+- Continue to <PlatformLink to="/configuration">customize your configuration</PlatformLink>
+- Learn how to <PlatformLink to="/usage">manually capture errors</PlatformLink>
+- Get familiar with [Sentry's product features](/) like tracing, insights, and alerts
 
-Note: You need to call both `captureException` and `flush` for captured events to be successfully delivered to Sentry.
+<Expandable permalink={false} title="Are you having problems setting up the SDK?">
+- Find various topics in <PlatformLink to="/troubleshooting">Troubleshooting</PlatformLink>
+- [Get support](https://sentry.zendesk.com/hc/en-us/)
 
-Check out Sentry's [Azure sample apps](https://github.com/getsentry/examples/tree/master/azure-functions/node) for detailed examples. Refer to the [JavaScript docs](/platforms/javascript/) for more configuration options.
+</Expandable>

platform-includes/getting-started-features-expandable/javascript.azure-functions.mdx

@@ -0,0 +1,14 @@
+<Expandable title="Want to learn more about these features?">
+
+- [**Issues**](/product/issues) (always enabled): Sentry's core error monitoring product that automatically reports errors,
+  uncaught exceptions, and unhandled rejections. If you have something that
+  looks like an exception, Sentry can capture it.
+- [**Tracing**](/product/tracing): Track software performance while seeing the
+  impact of errors across multiple systems. For example, distributed tracing
+  allows you to follow a request from the frontend to the backend and back.
+- [**Profiling**](/product/explore/profiling/): Gain deeper insight than traditional tracing without custom instrumentation, letting you discover slow-to-execute or resource-intensive functions in your app.
+- [**Logs**](/product/explore/logs): Centralize and analyze your application logs to
+  correlate them with errors and performance issues. Search, filter, and
+  visualize log data to understand what's happening in your applications.
+
+</Expandable>

platform-includes/getting-started-verify-locate-data/javascript.azure-functions.mdx

@@ -0,0 +1,8 @@
+<Expandable title="Need help locating the captured errors in your Sentry project?">
+
+1. Open the [**Issues**](https://sentry.io/orgredirect/organizations/:orgslug/issues) page and select an error from the issues list to view the full details and context of this error. For an interactive UI walkthrough, click [here](/product/sentry-basics/integrate-frontend/generate-first-error/#ui-walkthrough).
+2. Open the [**Traces**](https://sentry.io/orgredirect/organizations/:orgslug/traces) page and select a trace to reveal more information about each span, its duration, and any errors. For an interactive UI walkthrough, click [here](/product/sentry-basics/distributed-tracing/generate-first-error/#ui-walkthrough).
+3. Open the [**Profiles**](https://sentry.io/orgredirect/organizations/:orgslug/profiling) page, select a transaction, and then a profile ID to view its flame graph. For more information, click [here](/product/explore/profiling/profile-details/).
+4. Open the [**Logs**](https://sentry.io/explore/logs) page and filter by service, environment, or search keywords to view log entries from your application. For an interactive UI walkthrough, click [here](/product/explore/logs/#overview).
+
+</Expandable>