SharePoint 2010 Visual Web Parts

One of the new features in SharePoint 2010 that I’m most excited about is the ease with which developers can now create web parts. To distinguish the old from the shiny new, SharePoint 2010 provides the “Visual Web Part” project type. In this post, I’ll quickly cover the basics of getting a new web part working in debug mode--I’ll get into more detail in future posts.

Update: I have posted a video demo on the Metalogix blog showing how to create a SharePoint 2010 Taxonomy Web Part.

Obviously, you’ll need a working SharePoint 2010 development machine, so if you don’t have the set up yet, I suggest you refer to my post about SharePoint 2010 Beta 2 Install.

Once you have everything set up, the first step is to create a new project in Visual Studio 2010 Beta 2.

- Creating a new project in Visual Studio 2010 Beta 2

The new project dialog gives you the ability to choose a myriad of project types. You’ll want to choose Visual C# > SharePoint 2010 > Visual Web Part. As usual, you also have the option of choosing a project name, the path for the project files and a solution name.

- The new project dialog

When the project is created, you will see that the plumbing of your new web part is provided in the project template.

- Your blank template for web part creations

Rather than dive into the code, we’re just going to get this blank web part running, so start the debugger (F5 or click the green arrow).

At this point, you’ll be asked to create a web part page to associate with your web part. After you choose a name and template for your new web part page, you can save your choices and the page will be created.

Note: The good news is that if you delete this web page, you will be asked to created another when if you choose to debug your project again. The bad news is that it appears that overwriting the page may be necessary--even if you don't delete the first page.

Update: Thanks to Peter Holpar who pointed out that I neglected to mention that you can add the debug page URL (once you've created it) into the Debug option of the project properties. This saves the extra steps of creating the page for each subsequent debug run.

- Creating a web page to run the web part in debug mode

Depending on which template you choose, click an area where you see “Add web part” to bring up the web part picker. If you chose the default web page template, you will see four options.

- The web part page has been created

You’re new web part will appear in the “Custom” category. After you choose to add it, you’ll see the name appear on your web part page.

- Choosing the new custom web part from the available web parts

And that’s it. You now have a blank web part project that you can use to build what you want. Sure, it doesn’t actually do anything, but just enjoy how simple it is to get a working web part running in debug mode on your SharePoint server. Now you can drag and drop controls from the Toolbox just like any other ASP.NET page and start your creation.

- The new visual web part has been added

Debugging and Breakpoints

One of the new advances in web part goodness is ease of debugging. To see how easy it is to debug and step through your code, simply insert a breakpoint into your visual web part.

- A breakpoint set in the SharePoint web part

When you now run the debugger, code execution will stop at your breakpoint and let you step into/over or do whatever you desire in debug mode.

- The debugger has hit the breakpoint

Now the trick is to figure out what you want to do, but isn’t that better than worrying about the plumbing?

[Disclaimer: This information is based on SharePoint 2010 Beta 2 and may differ from the RTM build.]