diff --git a/docs/ide/media/hello-world-fs-get-member.png b/docs/ide/media/hello-world-fs-get-member.png new file mode 100644 index 00000000000..38d3b171048 Binary files /dev/null and b/docs/ide/media/hello-world-fs-get-member.png differ diff --git a/docs/ide/media/hello-world-fs-sln-explorer.png b/docs/ide/media/hello-world-fs-sln-explorer.png new file mode 100644 index 00000000000..af23e11159a Binary files /dev/null and b/docs/ide/media/hello-world-fs-sln-explorer.png differ diff --git a/docs/ide/quickstart-fsharp.md b/docs/ide/quickstart-fsharp.md new file mode 100644 index 00000000000..fb5e5dc0833 --- /dev/null +++ b/docs/ide/quickstart-fsharp.md @@ -0,0 +1,76 @@ +--- +title: "Quickstart: Create an ASP.NET Core web service in F#" +description: "Learn how to create an ASP.NET Core web service in Visual Studio with F#, step-by-step." +ms.date: 08/24/2018 +ms.prod: visual-studio-dev15 +ms.technology: vs-acquisition +ms.prod: visual-studio-dev15 +ms.topic: quickstart +author: "cartermp" +ms.author: "phcart" +manager: andrehal +dev_langs: + - FSharp +ms.workload: + - "aspnet" + - "dotnetcore" +--- +# Quickstart: Use Visual Studio to create your first ASP.NET Core web service in F# + +In this 5-10 minute introduction to F# in Visual Studio , you'll create an F# ASP.NET Core web application. + +If you haven't already installed Visual Studio, go to the [Visual Studio downloads](https://visualstudio.microsoft.com/downloads/?utm_medium=microsoft&utm_source=docs.microsoft.com&utm_campaign=button+cta&utm_content=download+vs2017) page to install it for free. + +## Create a project + +First, you'll create an ASP.NET Core Web API project. The project type comes with template files that constitute a functional web service, before you've even added anything! + +1. Open Visual Studio 2017. + +2. From the top menu bar, choose **File** > **New** > **Project**. + +3. In the **New Project** dialog box, in the left pane, expand **Visual F#**, then choose **Web**. In the middle pane, choose **ASP.NET Core Web Application**, then choose **OK**. + + If you don't see the **.NET Core** project template category, choose the **Open Visual Studio Installer** link in the left pane. The Visual Studio Installer launches. Choose the **ASP.NET and web development** workload, then choose **Modify**. + + ![ASP.NET workload in VS Installer](../ide/media/quickstart-aspnet-workload.png) + +4. In the **New ASP.NET Core Web Application** dialog box, select **ASP.NET Core 2.1** from the top drop-down menu. (If you don't see **ASP.NET Core 2.1** in the list, install it by following the **Download** link that should appear in a yellow bar near the top of the dialog box.) Choose **OK**. + +## Explore the IDE + +1. In the **Solution Explorer** toolbar, expand the **Controllers** folder, then choose **ValuesController.fs** to open it in the editor. + + ![Solution Explorer with Controllers folder expanded in F# Web API project](../ide/media/hello-world-fs-sln-explorer.png) + +2. Next, modify the `Get()` member to be the following: + + ```fsharp + [] + member this.Get() = + let values = [|"Hello"; "World"; "First F#/ASP.NET Core web API!"|] + ActionResult(values) + ``` + +The code is straightforward. An F# array of values is bound to the `values` name, and then passed to the ASP.NET Core MVC framework as an `ActionResult`. ASP.NET Core takes care of the rest for you. + +It should look like this in the editor: + +![Modified Get member](../ide/media/hello-world-fs-get-member.png) + +## Run the application + +1. Press **Ctrl**+**F5** to run the application and open it in a web browser. + +2. The page should navigate to the `/api/values` route, but if it does not, enter `https://localhost:44396/api/values` into your browser. + +The web browser will now display JSON matching what you typed earlier. + +## Next steps + +Congratulations on completing this Quickstart! We hope you learned a little bit about F#, ASP.NET Core, and the Visual Studio IDE. To see the app running on a public server, select the following button. + +> [!div class="nextstepaction"] +> [Deploy the app to Azure App Service](../deployment/quickstart-deploy-to-azure.md) + +To learn more about F#, check out the official [F# Guide](/dotnet/fsharp/index). \ No newline at end of file diff --git a/docs/index.md b/docs/index.md index 5f1fcf0ac12..78671d18cae 100644 --- a/docs/index.md +++ b/docs/index.md @@ -102,33 +102,46 @@ ms.topic: hub-page

Get started with a tutorial

Choose a programming language

-
-
+ + + + + +
+ + + +
@@ -141,34 +154,54 @@ ms.topic: hub-page

Try a 5-minute Quickstart

Build "Hello, World" in the language of your choice.

-
-
+ + + + + + +
+ + + +
diff --git a/docs/toc.yml b/docs/toc.yml index c4cef9f9f2d..2d7f60b5bb9 100644 --- a/docs/toc.yml +++ b/docs/toc.yml @@ -116,6 +116,8 @@ href: ide/quickstart-nodejs.md - name: "C#: Create a web app" href: ide/quickstart-aspnet-core.md + - name: "F#: Create a web service" + href: ide/quickstart-fsharp.md - name: "C#: Create a UWP app" href: ide/quickstart-uwp-csharp.md - name: "Visual Basic: Create a console app"