Web Development 101: Part 9, Deploying your site

You've come a long way! From the beginnings when you created a simple HTML page, and then learned how to style it, you've now gone on to create a fully dynamic site, one where you can generate the page, server-side, from data in your database. You can also edit, update and delete the records in your database, to show a full scenario for a web application.

While this application is very simple, it is the foundation for what a full web application built with ASP.NET and Razor in WebMatrix will look like. I'm sure you can see just how simple it is!

Finding a Hosting Provider

But there's one last step -- and that's getting your application onto the Internet using a Web Hosting provider.

WebMatrix ships with an integrated Web Hosting gallery which helps you find the best hosting providers to suit your site. If you go to the 'Site' workspace in WebMatrix you can see this:




Alternatively, you can just go straight to http://www.microsoft.com/web/hosting where you'll find the full gallery of web hosting providers with a variety of offers to suit your needs.

Signing up with Cytanium

For this chapter, I'm going to use Cytanium, because they have a hosting offer for WebMatrix.

Just visit their site and click the friendly 'Signup' button:




You'll be asked for very some details for your account, namely your first and last name, and the email address where they can send the sign-in details.


Configuring WebMatrix to Publish to Cytanium

Click 'Register' and a few moments later, you'll get an email from noreply@cytanium.com. Scroll down through this email and you'll find a section called 'WebMatrix - WebDeploy (preferred)' -- it should look something like this:




Now, open the sites workspace in WebMatrix, and find the 'Publish' button. Drop it down by clicking the arrow at the bottom of it, and select 'Settings'



The publish settings will open. Fill out the details that you got from the email:



Click 'Validate Connection' to make sure that the settings are correct:



If they are you should see a 'Connected Successfully' tick as above.

Click 'Save' to exit the Publish Settings dialog.

Now, drop down the 'Publish' button again, and this time select 'Publish...'



You'll see a 'Publish Preview' screen where WebMatrix determines the changes on your site. Depending on what you've done recently, you may see different settings than here, particularly first time where there are lots of the file dependencies that are on your development PC that aren't on your server. If that's the case, don't worry. Just make sure the databases box is checked as it is here and click 'Continue'.



Publishing will start, and you'll see its progress in the yellow bar at the bottom of the WebMatrix window. When it's done you'll see that it's complete, and for convenience you'll get the URL of the finished site:

Using Publish Settings

You may have noticed on the settings dialog that you could import publish settings. Some hosting providers will email you a document containing publish settings that make setting up your publication even easier.

To use this, simply select the 'Import Publish Settings' link and browse to wherever you saved the file to disk. When you open it, WebMatrix will read all of the settings, including the database connections, and your site is ready to go.


Viewing your site online

Click the URL, and you'll see the site running on the internet. You'll probably just get a 'Website Coming Soon' message. This is because you don't have a default page on the site yet. For now, just select the URL and add /dataMovies.cshtml onto the end, like this:


(where kweddle.webmatrix01.cytanium.com is my site, you'll have a different address)

When you do this, you'll see your site running, live, on the Internet:



You can do everything on this site that you did with your development box. So, for example, you can select 'Add a new movie', and then fill out the form, and the movie will be added to the database, and the page updated. Here you can see I've added 'The Million Year Journey' back in to the live site.

Synchronizing your sites

This might raise an interesting conundrum. Now you have 2 separate sites - -the one on your Internet server that has the new movie, and the one on your local machine that doesn't.

Fortunately, WebMatrix helps you synchronize them with the 'Download Published Site' feature. So, for example, here's my dataMovies.cshtml, running locally:



As you can see, I've only got 5 movies, not 6. If I publish this, I'll overwrite the 6th that I just added to the 'live' site. But if I go to the 'Download Published Site' option on the 'Publish' menu:



WebMatrix will figure out all the files that have changed on my live site, and allow me to download and overwrite my local ones, including the database.



Press 'Continue' and the download will run. When it's done, you'll see the yellow bar at the bottom of the WebMatrix window.



Now, if I run the site again, I can see that all 6 movies are on my development box, and that it's in synch with what I have on the server box which is live on the Internet:


And that's it! You've now built your site using WebMatrix. You've started from a very basic, static HTML, and ended up with a fully data driven CRUD application that runs live on the Internet on a WebMatrix hosting provider. You've also seen how to keep this application synchronized between the server and your development machine!

Welcome to the wonderful world of Web Development. To learn more about WebMatrix, please visit web.ms/webmatrix.

You can discuss this article using the adjacent Facebook talkback.

For technical questions please visit our discussion forums, where we have a vibrant community of developers like you, as well as Microsoft engineers who are ready to answer your questions!