Part 1: Setting up the development environment – Create an EPiServer site from scratch

Posted on December 4, 2009 by Frederik Vig in EPiServer

In this first part I’m taking you through setting up everything on a new computer. Most likely you’ll have done some of this before, in that case feel free to skip to the parts that interest you. If all this is new to you, I would install everything in the order described.

Update 08.12.2009

Ted Nyberg posted a nice blog post: How to set up an EPiServer website, that you should definitely check out (after you’ve read this one of course :)).

Installing IIS, ASP.NET, SQL Server 2008, and Visual Studio

Microsoft as a great tool for quickly installing everything you need, its called the Web Platform Installer. Download and install it, after its installed, launch it and choose Web Platform. Here you’ll be able to choose the web server, frameworks and runtimes, and database server, that you’ll need.

Web Platform Installer

For more information about the Web Platform Installer see Scott Guthrie’s introduction post and the official site.

I’m using Visual Studio 2008 Professional in this series, but you can use any version you like, including the free Visual Web Developer 2008.

Installing EPiServer

Go to EPiServer World and download the latest version of EPiServer, I’m using EPiServer CMS 6.

Unzip, and click setup to start. When asked choose Application Files (we’re adding the site later).

Choose Application Files

Subversion

Subversion is a popular open source version control system. It will help us get the latest version of our code, track changes, and a whole lot of other things. For more information I recommend taking a look at the free book: Version Control with Subversion.

Throughout this series I’ll update and keep all the code in EPiCode’s subversion repository. To work with EPiCode’s repository we need a Subversion client. My favorite is TortoiseSVN, but you can use any you like. You’ll need to download and install it (or any other subversion client). After the installation and restart you should have a few new options in Windows Explorer.

TortoiseSVN shell extension in Windows Explorer

When following this series I recommend building your own project, and just use the project on EPiCode for reference when you’re stuck. Or just want to copy some files/folders.

To do a checkout of the repository, right click in Windows Explorer inside the folder you’d like to place the code, and choose SVN Checkout. Type in the URL https://www.coderesort.com/svn/epicode/JungleLand (note: you need to register on EPiCode first, if you don’t already are).

SVN Checkout of JungleLand from EPiCode

Other tools

My main development browser is Firefox, the reason for that is that you have access to a ton of great extensions that’ll help you a lot when developing a new site. One of those extensions is Firebug. Download and install both Firefox and Firebug if you don’t already have them. For more information, take a look at this screencast: Introduction to Firebug.

With Visual Studio I have two other tools: VisualSVN and ReSharper. VisualSVN to help me with Subversion, and ReSharper for helping me with the code. You don’t need all these tools to follow along with this series, but I recommend trying them out.

Also install UnleashIt. UnleashIt is used for removing subversion files (hidden files that Subversion uses to keep track), code-behind, class files etc, when deploying to our production server (everything is compiled inside .dll files).

The last program we need is Reflector. This is one of my favorite tools when working with EPiServer. It’ll allow you to open up any .dll file and inspect the code it contains. This is great for when you’re stuck on a problem and need to see how something behaves, or for just having fun and peeking inside EPiServer :).

Reflector in action

Installing the site

Start the deployment center: go to Start, EPiServer, and EPiServer Deployment Center. Choose the EPiServer version you’d like to install (I’m using 6.0.382.1), and click, “Install site and SQL Server database”.

Step 1

Nothing special here, I’m using http://jungle as my local site url – for that to work I need to update my hosts file, located under C:\Windows\System32\drivers\etc\hosts (edit it with notepad or any other code editor). I’ve added the line: 127.0.0.1 jungle

Step 2

If you have a local SQL Server Express instance you can most likely just type .\SQLEXPRESS. If that doesn’t work, open up services (under Administrative tools in control panel) and check what your local SQL Server instance is called.

If you have other problems connecting, make sure that TCP/IP is enabled for your SQL Server instance. Open up Configuration Manager: go to Start, SQL Server 2008, Configuration tools, and SQL Server Configuration Manager.

Step 3

I just used the default VPP path suggested.

Step 4

Make sure to install the Public Templates with only the English content.

Step 5

If you like you can order a developer license, I’m just going to continue without adding a license file.

Step 6

Great, we’re now ready to install everything!

Time for a little coffee break – when we come back everything should be installed!

After installation

When the installation completes you should see something like this in your default browser.

Project folder structure

Great, we now have most of our environment configured and setup. Lets go to our projects root folder (C:\EPiServer\Sites\JungleSite) and rename PublicTemplates.csproj to JungleSite.csproj. Then open it in Visual Studio (double-click on JungleSite.csproj). You should have a structure similar to this:

Lets expand the Templates folder, and add a new folder called Jungle. Under Jungle, add the following folders:

  • Images
  • MasterPages
  • Pages
  • Scripts
  • Styles
  • Units
  • Util

Next step is deleting the App_Data and Service_References folders. After you’ve done that expand Properties and open up AssemblyInfo.cs, and update the information here.

// General Information about an assembly is controlled through the following 
// set of attributes. Change these attribute values to modify the information
// associated with an assembly.
[assembly: AssemblyTitle("JungleSite")]
[assembly: AssemblyDescription("")]
[assembly: AssemblyConfiguration("")]
[assembly: AssemblyCompany("Frederik Vig")]
[assembly: AssemblyProduct("JungleSite")]
[assembly: AssemblyCopyright("� 2009-2010 by Frederik Vig. All rights reserved")]
[assembly: AssemblyTrademark("")]
[assembly: AssemblyCulture("")]
 
// Setting ComVisible to false makes the types in this assembly not visible 
// to COM components.  If you need to access a type in this assembly from 
// COM, set the ComVisible attribute to true on that type.
[assembly: ComVisible(false)]
 
// Version information for an assembly consists of the following four values:
//
//      Major Version
//      Minor Version 
//      Build Number
//      Revision
//
// You can specify all the values or you can default the Revision and Build Numbers 
// by using the '*' as shown below:
[assembly: AssemblyVersion("1.0.0.0")]

Last step is renaming the assembly and default namespace. Right click JungleSite and choose Properties.

Make sure it builds by pressing either ctrl + shift + b, or going to: Build, Build JungleSite. It should build fine (since we didn’t change any of the code). Last thing to remember is to delete the old dll file. Go to your bin folder and delete the file called EPiServer.Templates.Public.dll.

All the code is also available on EPiCode for you to checkout and download.

That’s it! In the next post, we’ll start building the site by implementing our sites foundation.

Related Posts: