Tech Junkie Blog - Real World Tutorials, Happy Coding!: How To Create An ASP.NET Core Application From Scratch

Tuesday, July 12, 2016

How To Create An ASP.NET Core Application From Scratch

Technology has moved at a breakneck speed, after working with ASP.NET Core for a while, I realized that my ASP.NET MVC blog articles have become outdated.  Don't get me wrong, MVC is still a very big part of ASP.NET Core, but that's the thing it's just a part of it.  ASP.NET Core has decoupled the infrastructure from the application.  You can deploy your web app on Docker imagine that!  No longer is IIS your primary means of hosting your ASP.NET application.

However, with this new freedom comes added complexity.  No longer can you just drag and drop components into your design surface.  Those days are long gone.  This post ist meant to ease your way into ASP.NET Core.  I will using the release candidate version two of ASP.NET Core for this post and other subsequent posts.  Don't be surprise if I update the version midstream because the product is still pre-release.  I will be using Visual Studio 2015 for my development.  You can use the command line interface and notepad to develop your ASP.NET Core application.  But, I think that borders on insanity.



So let's begin our journey together!

Here are the steps to create an ASP.NET Core application from scratch:

1. Create an empty Visual Studio solution File → New → Project → Other Project Types → Visual Studio Solutions → Blank Solution.  In the name field call the solution "NorthwindCafe" then press "OK"



2.  Now that we have the blank solution we can add the ASP.NET Core project, right click on the "NorthwindCafe" solution, then select "Add" → New Project →  Visual C# →.NET Core → ASP.NET Core Web Application (.NET Core) .  In the "Name" field give it the name "NorthwindCafe.Web" then click "OK"


3.  On the "Select a template" screen select "Empty" then click "OK"


4.  After you click "OK" you will see the following folder structure for your project.  As you can see it's very bare bones to start with.  The first thing you will notice is that there is a "wwwroot" folder and a project.json file. The wwwroot folder represents your webroot directory remember you are not developing for just IIS anymore.  So everything in the wwwroot would work on the client side.  The other file project.json file is used to configure all of your project's dependencies.  One thing to keep in mind is that nothing has been enabled yet.  You have to configure the application to use what you need.


5.  The first thing we want to add is a bower config file into your project so that we can obtain the client dependencies that we need.  The neat thing about ASP.NET Core is that bower will put the dependencies in a folder call "lib" inside the "wwwroot" folder.  If you need a refresher on bower you can go to this post .   To add the bower configuration file right-click on the "NorthwindCafe.Web" project.  Then select Add → New Item  →.NET Core → Client-side → Bower Configuration File then click "Add"

6.  The bower.json file should have the following markup

{
 "name": "asp.net",
 "private": true,
 "dependencies": {
 }
} 
7. If you look at the project you won't see the "bower.json" file, the reason is because you haven't added to the project yet. To make the "bower.json" file appear in your project Click on the "Show All Files" icon.


This concludes the post for today.  In subsequent posts we will build on this project to make this a full blown application.  Thank you for reading!  I hope you've enjoyed this post.




ASP.NET Core Posts:
  1. How To Create An ASP.NET Core Application From Scratch
  2. ASP.NET Core : Add jQuery, Bootstrap, AngularJS Using bower.json
  3. Enable ASP.NET Core to Serve Static Files
  4. Enable MVC On ASP.NET Core Application
  5. ASP.NET Core : Create Our First Controller and View  
  6. ASP.NET Core : Adding The Default View With _ViewStart.cshtml
  7. ASP.NET Core : Create A Responsive Layout With Bootstrap
  8. ASP.NET Core : Adding Font-Awesome For Northwind Cafe Navigation Icons
  9. ASP.NET Core : Add .json Configuration Files With Microsoft.Extensions.Configuration Library
  10. ASP.NET Core : Entity Framework Core Models For Northwind Cafe
  11. ASP.NET Core : Create The NothwindContext ( EntityFrameworkCore )
  12. ASP.NET Core : Configure project.json File To Support Entity Framework Core
  13. ASP.NET Core : Add NorthwindContext To Startup Class And Create Database
  14. ASP.NET Core: Seeding The NorwindCafe Database
  15. ASP.NET Core: Add Logging To The NorthwindCafe Application

5 comments:

  1. Just one note - If you want to publish your project (for example to Azure), you should add these lines to project.jsou under publishOptions:

    "**/*.cshtml",
    "appsettings.json"

    ReplyDelete
  2. Hello, I've reached a snag.
    The file "Project.json" does not appear in my solution structure. Is there a way to fix this?

    ReplyDelete
    Replies
    1. There's an icon in Visual Studio to show all files. You can try and click on that and see if it appears. If you see it then you have to add it to your solution/project.

      Delete

Search This Blog