.NET Zone is brought to you in partnership with:

I am developer and technology maniac who is working on Microsoft and PHP technologies. I have ASP.NET MVP title and I hold MCAD, MCSD and MCTS certificates. When I have free time I usually play with new technologies, hack something, read books, participate in communities and speak in events. I am also active blogger and my ASP.NET blog is the place you can find some interesting reading about my discoveries and personal thoughts. Gunnar is a DZone MVB and is not an employee of DZone and has posted 142 posts at DZone. You can read more from them at their website. View Full User Profile

First look at Visual Studio Online “Monaco”

11.19.2013
| 7085 views |
  • submit to reddit

With Visual Studio 2013 Microsoft also announced online version of Visual Studio for Windows Azure Web Sites. When I first saw SharePoint Napa tools and “powered by Vsiual Studio” slogan then I knew that soon Visual Studio is on cloud. Now Microsoft made their next step. Let’s see what Visual Studio Online with codename “Monaco” is and what you can do with it.

From Visual Studio Online November 2013 updates we can read about “Monaco” the following: “With Monaco, we want to provide developers with a lightweight, friction free companion to the Visual Studio desktop IDE that is accessible from any device on any platform. Monaco is a rich, browser based, code focused development environment optimized for the Windows Azure platform, making it easy to start building and maintaining applications for the cloud.”

Getting started

You need Windows Azure account to get started. If you just want to play with Windows Azure you can also take Windows Azure trial – it’s free until you don’t do anything too big. If you have Windows Azure account then follow this steps:

  1. Log in to Windows Azure management portal.
  2. Create new web site.
  3. Open site settings and go to Configure page.
  4. Scroll down a little bit and turn “Edit in Visual Studio Online” on.
  5. Go to web site dashboard and click on “Edit in Visual Studio Online” link.

Now Visual Studio Online opens in new browser window and you can start building your site online.

 Quick start
Visual Studio Online: Quick start.
Click on image to zoom in.

Testing with simple pages

I successfully created to test pages – one that uses classic ASP.NET mark-up and the other that uses Razor. Here’s the ASP.NET one. It has just some simple HTML and ASP.NET tags to print out current date and time.

 Simple ASP.NET page
Visual Studio Online: Simple ASP.NET page.
Click on image to zoom in.

When you are done with your modifications and you want to run your application then simply click run and you will see build messages on screen. After successful build you can open your web site and see changes.

 Console Output
Visual Studio Online: Console Output.
Click on image to zoom in.

There is no good syntax highlight and other powerful features that desktop version of Visual Studio offers you but still you can code online having just browser running on your machine.

Editor commands

Visual Studio “Monaco” supports editor commands – shortcut keys to make you some editing tasks more convenient.

 Editor Commands
Visual Studio Online: Editor Commands.
Click on image to zoom in.

Although there are is pretty small set of commands available currently we can expect more commands to come. You see, there is search box below commands. We don’t need it just for 20 commands.

Comparing files

If you want to compare files then it is easy. Just right click on files and select them for comparing. This is how you see files when comparing them.

 Comparing files
Visual Studio Online: Comparing files.
Click on image to zoom in.

WebMatrix personal site

I connected WebMatrix to my web site and created personal site based on personal site template. It illustrates better how files look in new editor.

 WebMatrix personal site
Visual Studio Online: WebMatrix personal site.
Click on image to zoom in.

Resources

Conclusion

Quick first look at Visual Studio Online “Monaco” makes me feel like WebMatrix is getting online because I don’t see there much Visual Studio desktop features that should be elementary for all developers. Still it is next big step by Microsoft towards online Visual Studio that is browser based and rund somewhere in the cloud. Let’s not forget that Windows Azure Web Sites are already integrated with Team Foundation Services and so is Visual Studio Online “Monaco”. What it means? We have online IDE with source control support!

Related Posts

The post First look at Visual Studio Online “Monaco” appeared first on Gunnar Peipman - Programming Blog.

Published at DZone with permission of Gunnar Peipman, author and DZone MVB. (source)

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)