Develop apps by using Visual Studio 2013

Applies to Windows and Windows Phone

Microsoft Visual Studio 2013 is a collection of tools that you can use to create, code, debug, localize, package, and deploy apps that target Windows or Windows Phone 8.1. In short, Visual Studio can help you do just about anything you need to do to develop an app.

If you haven't used Visual Studio before, take a quick look around before you start writing code. Visual Studio has a lot of parts, but you don't need to know all about them to get started. After describing the basic steps of setting up a new project, we take a look at the Code Editor and other Visual Studio features.

Important  

  • To create an app, you must use Visual Studio 2013 on a computer running Windows 8.1.
  • You can't create an app by using Windows 7. In addition, developer licenses aren't available for Windows Server 2012, so you can't develop a Windows Store app on that operating system.
  • If you want to create a Windows 8 version of your Windows Store app, you must use Microsoft Visual Studio 2012. For information about maintaining a Windows 8 version of a Windows Store app app by using Visual Studio 2013, see Service the Windows 8 version of your app.
  • To create a Windows Phone Store app, you must install Microsoft Visual Studio 2013 Update 2 or later to install the development tools for Windows Phone 8.1.
  • If you want to create or maintain a Windows Phone 8 version of your Windows Phone Store app, you must install the Windows Phone SDK 8.0. This SDK is an optional component of Visual Studio 2013.

For info about what's new in Visual Studio, see What's New in Visual Studio 2013 and JavaScript IntelliSense.

For more info about the development tools for Windows Phone Store apps that are installed when you install Visual Studio 2013 Update 2 or later, see Development tools for Windows Phone apps.

Get a developer license to develop Windows Store apps

First, get a developer license. You'll need one to develop and test a Windows Store app before the Store can certify it.

When you run Visual Studio for the first time, it prompts you to obtain a developer license. Read the license terms and then click I Accept if you agree. In the User Account Control (UAC) dialog box, click Yes if you want to continue.

Register your phone to test Windows Phone Store apps

It’s important to test your Windows Phone Store app on a real phone. Before you can deploy apps to your Windows Phone, you have to register the phone for development. After you register your phone, you can install, run, and debug apps on the phone.

For more info, see Register your Windows Phone device for development.

Create a project and choose a template

Next, decide which programming language you want to use. You can choose JavaScript, Visual Basic, Visual C#, or Visual C++, and then find the Store project templates in the New Project dialog box. The New Project dialog box organizes templates into three groups: Windows Apps, Windows Phone Apps,and Universal Apps (for apps that target both Windows and Windows Phone 8.1. This image shows these groups under the Visual C# language node.

Categories of Store apps

Each group contains a list of templates. Some important templates, like Blank App, Grid App, and Split App, are shared between all four programming languages. A few templates are language-specific. To learn more about them, see Templates to speed up your app development.

  • Applies to Windows

Note  To learn more about how to migrate to new templates in Microsoft Visual Studio Express 2013 for Windows, see Retarget your Windows 8 app to Windows 8.1.

When you create a project, Visual Studio creates a solution, which is a way of managing the various source elements of your project (code files, images, style sheets, settings, and so on). A solution container can contain multiple projects, and a project container typically contains multiple items that represent the references, folders, and files that you need to create your app.

Solution Explorer displays solutions, their projects, and the items in those projects. In Solution Explorer, you can open files for editing, add new files to a project, and view solution, project, and item properties. Here's what Solution Explorer looks like for a JavaScript project:

Solution Explorer

In addition to source code files, each project also has an package.appxmanifest file, which describes the app package for Windows as well as several image files, like splashscreen.png for the splash screen image and storelogo.png, which is used for the Store. You'll also find a project source certificate (.pfx) file that's required for signing the package is also included in each project.

Design the user interface

When you plan your user interface, it's important to select the most appropriate Visual Studio project template for a starting point. You can develop your UI by writing code or by using a visual designer. A visual designer provides a designer-oriented interface for app design that includes a drag-and-drop interface for building the UI.

You can also use the visual designer provided in Blend for Microsoft Visual Studio 2013. You can open a Visual Studio project in Blend for Visual Studio by right-clicking the project in Solution Explorer and clicking Open in Blend. Alternatively, open the solution file (.sln) from within Blend for Visual Studio.

XAML Designer in Visual Studio

Update the app manifest

You can use a designer in Visual Studio to edit the app manifest file that describes your app package. The Manifest Designer has five tabs:

  • Application. Configure settings such as start page and the initial orientation.
  • Visual Assets. Specify the logos that appear for your app.
  • Capabilities. Specify system features or devices that your app can use, such as Internet access, current location, and Music access.
  • Declarations. Add declarations for app contracts, like search and share target contracts, and specify their properties.
  • Content URIs. Specify URIs that your app either can or can't access. This tab appears only for JavaScript projects.
  • Packaging. Set properties that identify and describe your package when it is deployed.

For more info about the app manifest settings, see Configure an app package by using the manifest designer.

To open the Manifest Designer, double-click the package.appxmanifest file in Solution Explorer, or right-click the file and click View Designer.

Write code

Visual Studio 2013 includes full-featured editors for the following languages: JavaScript, HTML/XML/XAML, CSS, C#, Visual Basic, C++, HLSL. The editors provide many language-specific features that you can customize to help create your app:

  • IntelliSense, which provides features such as statement completion and parameter Help as you type code. This illustration shows a member list in the C# Code Editor. Note that the list also displays a Quick Info box for the selected item.

    IntelliSense member list

  • Code snippet insertion, available by right-clicking in a code file and clicking Insert Snippet.
  • Navigation aids like Go To Definition, Bookmarks, and Navigate To.

    The Go To Definition command enables you to find the definition of a class or function by right-clicking the identifier and clicking Go To Definition. (Visual Basic and Visual C++ use the Object Browser to display information about Windows Runtime types.)

    This illustration shows options like Go To Definition and Insert Snippet in the JavaScript Code Editor:

    Features in the Code Editor

    To set and use Bookmarks, click Edit > Bookmarks , or use the shortcut keys shown on the Bookmarks submenu.

    Open the Navigate To window by pressing Ctrl+Comma with the Code Editor open, or by clicking Edit > Navigate To. Navigate To can find symbol definitions and file names in the solution, but not local variables.

  • Outlining, word wrap, displayed line numbers, and other features.

You can customize the behavior of the Code Editors, and enable or disable features like indentation, word wrap, and statement completion. To customize the behavior of the Code Editors, click Tools > Options, expand Text Editor, expand the appropriate Code Editor to configure, and then select the appropriate category of options.

Build your app

To build an app, click Build Solution (or press F7) or Rebuild Solution (or press Ctrl+Alt+F7) on the Build menu. You'll see the results of the build process in the Output window.

To run your new app in debug mode, click Debug > Start Debugging, or press F5. By default, this runs the app in the host computer (for Windows Store apps), and a Windows Phone emulator (for Windows Phone Store apps). You can choose to run a Windows Store apps by using the simulator or a remote device. You can choose to run a Windows Phone Store apps on other emulators or a Windows Phone that is connected to your computer. For more information, see Running Windows Store apps from Visual Studio.

Package your app

Configure the deployment package of your app by using a designer. Just double-click the package.appxmanifest file in Solution Explorer and the Manifest Designer will appear. In the designer, select the Packaging tab. For more info, see Configure an app package by using the manifest designer.

Localize the app

To localize an app in Visual Studio, we recommend that you add one or more resource files to your project, such as a .resjson file for JavaScript. You can use resource files to specify localized values for string resources that you identify in your app. For more info and tutorials related to localizing, see Globalizing your app.

Debug and test your app

Visual Studio includes a powerful debugger that has many new features to support debugging apps. You can debug an app locally, much like you'd debug a Windows desktop app. You can also debug in the simulator on the local machine, or you can debug a remote device connected directly through an Ethernet cable. For Windows Phone Store apps, you can debug your app by using one of several emulators or by connecting a Windows Phone directly to your computer. For general debugging information, see Debugging and testing apps . For info about debugging an app by using JavaScript, see Quickstart: Debug HTML, CSS, and JavaScript and How to inspect CSS rules.

Next steps

To create your first app, see Your first app.

To learn more about developing an app by using the Visual Studio templates, see these topics:

Related topics

Retarget your Windows 8 app to Windows 8.1.
Product Support and Accessibility
Accessibility in Store apps using JavaScript
Accessibility in Store apps (VB/C#/C++ and XAML)

 

 

Show:
© 2014 Microsoft