Create your first ASP.NET Core 1.0 App From Scratch

A quick walk through of ASP.NET Core 1.0 on how to set up a MVC application from a “Blank” project.  Part 2, will demonstrate how to add Angular to your Core 1.0 App.

Create your web app!

Open up Visual Studio and select File > New > Project.  If you have ASP.NET Core 1.0 or higher installed (here is the .Net Core Installation guide) you should see and exciting new category under Templates > Visual C#  called .Net Core!
c1.PNG

  1. Select “ASP.NET Core Web Application”, give it a name, and click “OK”.
  2. Select the “Empty” template if asked.

Setup Project.json

Open up your project.json file. This will be new to you if you haven’t played with previous releases of vNext.

What is project.json?

Introduced in the first versions of ASP.Net vNext (which is now called ASP.NET Core), the project.json file defines your package metadata, your project dependencies and which frameworks you want to build for. (relatively similar to ASP.NET 4.x’s package.config). You can remove or add a dependency from this file. When you do, you’re solution will automatically be updated to reflect those changes. You can also set what frameworks you want your app to compile across here! Note that Microsoft has stated that project.json may go away around the time the next version of Visual Studio is released. The idea is that settings will move back to the .csproj file to enable better integration with MSBuild in that time frame.

To create a basic MVC app you will need to add the following dependencies to project.json:

  • “Microsoft.AspNetCore.Mvc”: “1.1.0”
  • “Microsoft.AspNetCore.StaticFiles”: “1.1.0”
  • “Microsoft.Extensions.Configuration.FileExtensions”: “1.1.0”
  • “Microsoft.Extensions.Configuration.Json”: “1.1.0”

And you will need to make sure “buildOptions: preserveCompilationContext” is set to true. After making these changes, your project.json should now look like this:

{
  "dependencies": {
    "Microsoft.NETCore.App": {
      "version": "1.0.1",
      "type": "platform"
    },
    "Microsoft.AspNetCore.Diagnostics": "1.0.0",
    "Microsoft.AspNetCore.Server.IISIntegration": "1.0.0",
    "Microsoft.AspNetCore.Server.Kestrel": "1.0.1",
    "Microsoft.Extensions.Logging.Console": "1.0.0",
    "Microsoft.AspNetCore.Mvc": "1.1.0",
    "Microsoft.AspNetCore.StaticFiles": "1.1.0",
    "Microsoft.Extensions.Configuration.FileExtensions": "1.1.0",
    "Microsoft.Extensions.Configuration.Json": "1.1.0"
 
  },
 
  "tools": {
    "Microsoft.AspNetCore.Server.IISIntegration.Tools": "1.0.0-preview2-final"
  },
 
  "frameworks": {
    "netcoreapp1.0": {
      "imports": [
        "dotnet5.6",
        "portable-net45+win8"
      ]
    }
  },
 
  "buildOptions": {
    "emitEntryPoint": true,
    "preserveCompilationContext": true
  },
 
  "runtimeOptions": {
    "configProperties": {
      "System.GC.Server": true
    }
  },
 
  "publishOptions": {
    "include": [
      "wwwroot",
      "web.config"
    ]
  },
 
  "scripts": {
    "postpublish": [ "dotnet publish-iis --publish-folder %publish:OutputPath% --framework %publish:FullTargetFramework%" ]
  }
}

Save and compile the project.json file and you should see that these packages have been added to your project’s references.

c2.PNG

Add the  ASP.NET Cofiguration file

Right-click your project > Add New… > Select new ASP.NET Configuration File and name it appsettings.json

c4.PNG

What is appsettings.json?

This is used to do some of what the web.config previously did.  It is hooked up to the applications Startup.cs file and can be used to set up things like database connections and logging preferences.

Setup Startup.cs

The Startup.cs file will look the same as it did in RC1.  The 3 main things we will change for our basic example application are the following:

  • Add a Startup() constructor method and link it to appsettings.js
  • Add the MVC service to ConfigureServices()
  • Configure the MVC the default routes (this replaces the old route config file) and tell the app to use static files in Configure()

After the above changes have been made, your Startup.cs should now look like this:

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using Microsoft.Extensions.Configuration;

namespace NewProject
{
    public class Startup
    {
        public Startup(IHostingEnvironment env)
        {
            var builder = new ConfigurationBuilder()
                .SetBasePath(env.ContentRootPath)
                .AddJsonFile("appsettings.json", optional: true, reloadOnChange: true)
                .AddJsonFile($"appsettings.{env.EnvironmentName}.json", optional: true)
                .AddEnvironmentVariables();

            Configuration = builder.Build();
        }

        public IConfigurationRoot Configuration { get; }

        // This method gets called by the runtime. Use this method to add services to the container.
        // For more information on how to configure your application, visit http://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddMvc();
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
        {
            loggerFactory.AddConsole();

            app.UseStaticFiles();

            app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller=Home}/{action=Index}/{id?}");
            });
        }
    }
}

Lastly, add your Controllers and Views

Right-Click your project and add 3 new folders.

  • Controllers folder
  • Views folder
  • Home folder, inside of the Views folder

Next, right-click the Home folder and add a new MVC View Page. Name it “Index.cs” and add some “Hello World” text to it.

After adding these folders and file, your project will now look like this:

c3.PNG

Finished!!!!

Check out the final project on GitHub
Build and run your application.  Congrats on keeping up with the cutting edge of .Net

Advertisements

2 thoughts on “Create your first ASP.NET Core 1.0 App From Scratch

  1. Marko Mijuskovic January 12, 2017 / 9:55 pm

    I think you are missing the following line:

    services.AddMvc();

    inside the ConfigureServices method of the Startup.cs.

    Like

    • jesse January 14, 2017 / 2:30 pm

      Thank you for pointing that out. Im not sure how I forgot that, I will update this post with the correct changes.

      Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s