Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Adding a Controller

4:29 with James Churchill

Now that we have our project, let’s add the first controller for our Comic Book Gallery website.

Teacher's Notes
Video Transcript
Downloads

Follow Along

To follow along commiting your changes to this course, you'll need to fork the aspnet-comic-book-gallery repo. Then you can clone, commit, and push your changes to your fork like this:

git clone <your-fork>
cd aspnet-comic-book-gallery
git checkout tags/v1.5 -b adding-a-controller

Controller Scaffolding

In this video, we added a controller to our project by adding a C# class using the “Add > Class...” menu item. Using this method allowed us to understand what makes a C# class an ASP.NET MVC controller. While this method works, it’s not the typical way that developers add controllers to their ASP.NET MVC projects.

Visual Studio provides a feature called “scaffolding” that can be used to quickly and easily add items to a project. You can use scaffolding to add a controller to an ASP.NET MVC project by right-clicking on the “Controllers” folder and selecting the “Add > Controller…” menu item. That’ll open up the “Add Scaffold” dialog, which will present you with a list of controller templates to choose from.

For more information on how to add a controller to an ASP.NET MVC project use Visual Studio scaffolding see http://www.asp.net/mvc/overview/getting-started/introduction/adding-a-controller.

Additional Learning

For more information on how to perform quick actions with light bulbs in Visual Studio, checkout out this MSDN page.

Perform Quick Actions with Light Bulbs in Visual Studio

For more information about classes, access modifiers, and inheritance, check out these pages on MSDN.

Keyboard Shortcuts

CTRL+SHIFT+B - Build solution

[MUSIC] 0:00

Welcome back. 0:04

We just created our new project, but 0:06

when we tried running our website, we encountered in error. 0:08

We were able to determine that the error occurred, 0:11

because our website didn't have any controllers reviews. 0:14

We're building a comic book gallery website. 0:18

One of the main features will be the ability to view the details for 0:21

a specific comic book. 0:25

Let's call this our comic book detail page. 0:27

That seems like a great place to start. 0:30

So let's create a controller to handle the request for that page. 0:33

Looking at our project here in the solution explorer panel, 0:38

we can see that it contains a folder named controllers. 0:41

While it's not absolutely necessary, 0:45

it's a common convention to put all of your websites controllers in this folder. 0:47

And remember following conventions often makes it easier for 0:51

other developers to work on your code, which is super helpful. 0:55

Right-click on the Controllers folder and select the Add > Class menu item. 0:58

Let's name our class ComicBooksController. 1:05

Adding the suffix controller is more than a convention, it's a requirement. 1:09

Without it NVC wouldn't be able to distinguish our website's controllers 1:13

from other classes in our project. 1:18

Click the Add button to finish adding the class. 1:20

Okay, here's our class. 1:24

Let's start with talking about the public access modifier. 1:27

Visual Studio will include the public access modifier by default 1:30

when adding new classes to a project. 1:34

This makes our class accessible to code outside of our project. 1:37

You might be wondering if our class needs to be public. 1:41

For now, let's leave it as it is. 1:44

We will try an experiment in the next video to answer that question. 1:46

We need to make a couple of changes to our controller before it is usable. 1:51

To start with, 1:55

we need to update our class to inherit from the MVC controller base class. 1:56

To do that, 2:00

type a colon at the end of the class name followed by the name of the base class. 2:01

Before we go any further, let's build our project. 2:07

There are multiple ways to do this, of course. 2:10

You can click on the build build solution menu item, or 2:13

you can right click on the solution in the solution explorer panel and 2:18

select the build solution menu item. 2:22

Notice that to the right of this menu item, 2:24

you can see the keyboard shortcut for this command, control Shift B. 2:26

That's my favorite option as it keeps your hands on the keyboard. 2:31

Pressing control Shift B kicks off the build process. 2:34

Visual studio opens the output window, so that we can monitor 2:38

the progress of the build and see the results upon its completion. 2:41

Looks like we got an error. 2:46

The type or namespace name controller could not be found. 2:47

Are you missing a using directive or an assembly reference? 2:51

Luckily this error is telling us exactly what the problem is. 2:55

We need to add a using directive. 2:59

We could also see the Visual Studio is underlying the controller base class name 3:01

in an angry red squiggle. 3:06

If we hover our mouse pointer over the offending code, 3:08

Visual Studio will display a pop up containing information about the air. 3:11

Notice to the left of the pop up, there's a light bulb icon. 3:15

If we click on it, 3:18

a list of quick actions are displayed that we can take to resolve this error. 3:20

The first item in the list is using system.web.nvc. 3:24

And to the right, we can see a small visual preview of that change that 3:28

will be made if we select that action. 3:33

How cool is that? 3:36

Go ahead and click on the first item. 3:37

The using directive has been added, 3:40

the red squiggle has gone away, and our project is building again. 3:42

Adding using directives is a common activity, and 3:47

this Visual Studio quick action makes the process quick and painless. 3:50

If you're using GitHub, let's finish up by committing our changes. 3:55

Switch back to the team explore panel and 3:58

click the Home icon, if you're not already on the home panel. 4:01

Then under the project's section click on the changes button. 4:05

Enter a commit message of, 4:09

added comic books controller, and click the commit all button. 4:10

If Visual Studio prompts you to save the ComicBookGallery.sln file, 4:16

go ahead and click the Yes button to confirm the action. 4:21

In the next video, we'll continue with building out our controller. 4:25

See you then. 4:28

You need to sign up for Treehouse in order to download course files.

Sign up