Friday, November 8, 2013

"Hello World!" Using One ASP.NET MVC 5 From the Visual Studio 2013 Empty Template

I am in the process of learning MVC 5 and Visual Studio 2013. I am not a stranger to MVC concepts, but I am new to ASP.Net. I thought this might be helpful for new ASP.Net students who have already played with the pre-built MVC 5 template and want to start their own app from scratch.

Update 2/10/2014 
To avoid confusion, I changed the title of this post. This is not how to build a complete sample MVC 5 site from the ground up; it is just a tutorial on getting the empty template running. MVC5 books are out now that will explain site construction in extreme detail.

Create an ASP.Net 4.5 Empty MVC 5 Project
Create a new project/solution.

Choosing the MVC template will load a complete web application shell including controller, views…etc. We want an empty MVC shell with no pre-built pages. Choose Empty (C#) and check MVC.

If you try to run or debug the app immediately after creation, you’ll get an error: “Server Error in ‘/’ Application. The resource cannot be found.” The template is missing the default controller and view needed to display properly.

In the solution explorer, twist open Views and App_Start. Notice that pages are completely absent from Controllers, Models and the root. The Views folder contains a web.config file thinly stocked with Razor definitions.


App_Start contains the RouteConfig.cs file which is where you’ll find the default controller and action definition. According to line 19, the app will look for a controller named “Home” to start.

Create the Default Controller “HomeController”
Right click on Controllers and go to [Add]-->[New Scaffold Item…]

Choose “MVC 5 Controller – Empty” and click [Add]

Change the name of the controller to “HomeController” so it agrees with the default in the RouteConfig.cs file. 

Open the HomeController.cs file and notice the default code returns the view for the Index action.

Create the Default View “Index”
Now we need to create the index.cshtml view that the controller is looking for. Right-click on the Home folder under "Views" in Solution Explorer. Choose [Add] à MVC 5 View page (Razor).


Change the name of the view item to “Index” to match the ActionResult in the Controller.

Open Index.cshtml and insert “Hello World!” between the div tags on lines 13/14.

Click Save, then [Ctrl]+[Shift]+W to view your page in a browser.

Success!










Friday, November 1, 2013

Understanding Visual Studio 2013 and TFS - Projects vs Team Projects

As a developer, I left the Microsoft stack back in 2000 and am very excited to return to the fold with a cutting-edge, large scale One ASP.Net / MVC 5 app. As I am reorienting myself to the Visual Studio 2013 environment, I am learning some things that other new users might find useful.

Visual Studio Solutions and Projects
According to Microsoft, a Project in Visual Studio is "used in a solution to logically manage, build, and debug the items that make up your application... A solution includes one or more projects, plus files and metadata that help define the solution as a whole. Visual Studio automatically generates a solution when you create a new project. " [1

A project groups files for an app and a solution groups projects.


Team Foundation Service (TFS) and Team Foundation Server (also TFS)
TFS is Microsoft's answer to version control, but it is also a tool for project planning and build automation. MSDN Blogger Steve Lange has a great post on the differences between Team Foundation Server and Team Foundation Service that includes a handy PowerPoint brief summarizing the service features. In a nutshell, the service is a cloud based version of the locally hosted server. Microsoft provides the Team Foundation Service free for the first 5 users, so it is well worth checking out.

TFS Team Project
Visual Studio Project and a Team Project are completely different groupings. Reuse of the name is very confusing and, in fact, is what motivated me to create this blog post.  An Article on TFS in MSDN Magazine dated April 2011 describes a team project as a “container for artifacts, including source code (organized into folders, branched folders and branches) and containing one or more Visual Studio solutions, Team Build configuration files, Team Load Test Agents, an optional SharePoint repository containing the pertinent documents for the project…” In other words, a team project is a source control container for one or more Visual Studio solutions. [2]


A TFS team project groups Visual Studio solutions. In this diagram, a new "Web Application" as created in Visual Studio would be a project that is part of a larger solution, which is checked into a team project repository.

TFS Collection
A TFS Collection is a group of Team Projects. The default collection created when you first register with TFS is called DefaultCollection… Unfortunately, with the Team Foundation Service provided with Visual Studio only one collection is allowed per account. [3] If you are running a Team Foundation Server, it is possible to create multiple collections.

A collection groups team projects. (Multiple team projects as pictured above are not possible in the Team Foundation Service provided with Visual Studio.)

Workspaces
What is a workspace and how does it fit into this picture? “Your workspace is a local copy of your team’s codebase.” [4] It is where you actually work on the code.

Local Workspaces vs Server Workspaces
When tying your workspace to your Team Project, you have the option to work locally, which copies all files from the repository, or you can work in server mode, which only copies files one at a time.  (The MSDN article titled “Decide between using a local or a server workspace” has a great explanation of why this would be desirable.)

Team Project Settings: Speed Server Workspaces with Asynchronous Check-in
“You can reduce the time the system takes to check out files to server workspaces by selecting Enable asynchronous checkout in server workspaces. If you select this option: The PendChange permission is no longer enforced [and] Checkout locks are disabled.” [5]