En esta sesión el asistente participara en una conversación sobre las nuevas tecnologías incluidas en Visual Studio 2012 para el desarrollo de aplicaciones modernas utilizando Sharepoint y Office como medio de acceso a la información.
37. Resumen
VS2012 ofrece VS2012 ya
alto valor para ofrece opciones
desarrollador para desarrollo
SharePoint Office y
SharePoint
VS2012 y 2013
Instálalo YA y
SP2010 sigue siendo
trabajan bien productivo
juntos
38. Actualice de Visual Studio
Professional a Visual Studio
Premium 2012 con MSDN
y ahorre 30%
Los clientes con suscripciones de Visual Studio Professional con MSDN
activas compradas antes del 1 de septiembre de 2012 pueden obtener un
descuento de 30% respecto al precio regular de actualización al actualizar a
Visual Studio Premium 2012 con MSDN
Contáctese con su revendedor local
Notes de l'éditeur
An App for Office can be seen as a Web page loaded inside an Office Application. In some cases it will appear embedded inline within the document. In other cases it might appear as a task pane or within a message in Outlook. Note that the architecture for Apps for Office has been designed to work in both Office Applications and Office Web Applications.WEF and Apps for Office allow Office applications to be extended in such as way so that they can leverage Web technologies such as HTML 5 and CSS for rendering user interface as well as JavaScript and jQuery to add behavior. When you write the JavaScript code for an App for Office, you can call REST APIs such as those added to SharePoint 2013 to retrieve and update data from across network.
There are three basic types (i.e. shapes) for Apps for Office.Task Pane Apps are document-centric and are designed to assist user working with documents. For example, a task pane app can assist they using by searching the Internet for links related to the text that is currently selected buy the user. Task pane apps can be used in Word, Excel and Project.Content Apps are document centric and are designed to add embedded content and functionality directly into document. Note that content apps are only used in Excel 2013 so the associated document will always be an Excel workbook.Mail Apps are mailbox-centric and are used in in the Outlook Application as well as in Outlook Web App (OWA) . A mail app is designed to extend Outlook items such as messages and appointments with custom UI and behaviors. Note that the use of mail apps require Exchange 2013.
The matrix on the slide above shows which types of Apps for Office are available in specific Office applications.Task Pane Apps can be created for Office Applications including Word, Excel and Project. A Task Pan App created for Excel can also be used in the Web-based version of Excel and run through the browser.Content Apps can be created for Excel. A Content App created for Excel can also be used in the Web-based version of Excel and run through the browser.Mail Apps can be created for Outlook. A Mail App can also be used in Outlook Web Access (OWA).
Every App for Office must be distributed with an XML-based manifest which contains information about the app itself. For example, the app manifest contains an address to a Web page on the Internet which is used to load the app. The app manifest also includes information which indicates which Office applications it supports. The app manifest also defines the required capabilities which represent the set of permissions that the app needs in order to run and complete its work.
This slides shows a simple content app embedded in an Excel worksheet. The user interface of this app has been created using an HTML page layout as shown in the code on top and a CSS file with style rules as seen below.
Office 2013 applications provide users with the ability to discover apps and insert them. In Word and Excel, this support is included in the Ribbon inside the Insert Tab. As you can see from the slide above, the drop-down menu for inserting apps has a caption of "Agaves" in the beta cycle and will be updated to say "Apps" before RTM.When you drop down the Apps menu from the ribbon, you can see recently selected apps. If you click "Select All", you will be prompted with a dialog that allows you to look in various app directories. Once you find an app you want to use, you can click the Start button to insert the app into the current document and start it up. After this, you can save the current document which will then include the app.
A task pane app can be designed to read and write content to and from the current document. Often a task pane app is written to react to the event when the user selects content within the document. A task pane app can react by copy the selected text into a viewable region within the task pane. The Task Pane App can then provide value by allowing the user to run a command such as Translate which will send the text to a service on the Internet such as the Bing translation service. Once the text has been translated, the app can then allow the user to insert the translated text back into the document.A Task Pane App assists the user build a document. However, the task pane app is not part of the document itself.
A content app is different than a task pane app because it is embedded in the document and this becomes part of the document. The content app can read and write content from the cells in the hosting Excel worksheet and becomes a part of the viewable (and printable) worksheet itself.
Mail Apps are specifically designed to target Outlook and Outlook Web Access (OWA). Once a mail app has activate for a particular mail item, it’s name will appear in the mal app title bar as shown in the screenshot above. If a user clicks on the mail app title, that will launch the mail app so that its code can begin to execute and provide custom functionality.
This slide shows how a mail app looks inside OWA. A key benefit to developing mail apps is that they do not need to be rewritten for a browser-based client. The same mail app runs in both Outlook, the rich client, and OWA, the browser-based client.
Mail apps can also be designed to target mobile devices which run OWA such as Windows Phone 7. When developing a mail app that you plan to run on mobile devices, you should design and test the HTML layout to make sure the user experience is a good one when running on a device with a much smaller form factor.
Visual Studio has a new project template for Apps for Office. These project types gives you a starter project with a web page and manifest.
The slide shows the initial structure of a task pane app created with the Visual Studio 2012.
This slide shows the Visual Studio designer for an app manifest in a task pane app. It will look different for other types of Apps for Office.
Each app has a source location which points to a entry point Web page somewhere on the Internet. Here is an example of a simple Web page that is used to load a task pane app. Note that this page must link to any required CSS files and JavaScript that will be adding styles or behavior behind the app. Visual Studio automatically adds the links for jQuery and ASP.NET AJAX. Also note that the page adds HTML elements which are often created with ids and/or classes.
JavaScript is the language that is used to add executable code and behavior to a App for Office. The JavaScript you write for an app will typically take advantage of the various JavaScript APIs supplied for Office.js and other JavaScript library files for specific Office applications such as Word, Excel and Outlook. In addition to the Office JavaScript APIs, the JavaScript code you write for an app for Office can also take advantage of the ASP.NET AJAX library as well as jQuery.The Office JavaScript API provide a top-level named Office which provides an initialize function. By overriding this function as shown in the code above, you can write code that will automatically execute as the end of the initialization process when an app is started. A common approach is to register a jQuery document ready event handler inside this function.
When you press the {F5} with a Visual Studio 2012 project for an task pane app or a content app, Visual Studio automatically adds a registry entry to allow Office applications such as Word and Excel to discover the app which makes it possible to add it to a document.
For the development of SharePoint apps, there is a single Visual Studio project template. All the other project templates created for SharePoint 2013 development are for solution development.
When creating a SharePoint solution, you will create a new project from one of the many project templates dedicated to solutions development. When you create a new project for a SharePoint solution, Visual Studio will prompt you to select Deploy as a sandboxed solution or Deploy as a farm solution. Remember that you choice can be changed after the project has been created by changing a project property.
You can add many differenttypes of project items to solution project. Many of these project item will be familiar to developers who have developed solutions for SharePoint 2010. Also note that many of these project item templates will not be available when developing apps. This includes any project item templates that requires adding files into the SharePoint root directory as well as any ones that are based on server-side code. Note that the project item templates that are not available in sandboxed solutions as marked as Farm Solution Only.
Visual Studio 2012 adds some new features for SharePoint development that were not available in the previous version. This includes project item templates to create site columns and to create custom list definitions using a new visual designer. The list designer makes it possible to create new lists either with or without the use of explicit content types. The best part about the visual designer is that it is able to edit the files for a list definition such as the elements.xml file and the schema.xml file behind the scenes.
Note that unlike the previous version, Visual Studio 2012 does not provide separate item templates for List Instance and List Definition. Instead, there is just a single List project item template. When you create a new project item based on the list project item template, Visual Studio prompts you to select between these two choices:Customize the list based on: [choice of list type]Reuse existing list: [choice of list type]By selecting Customize the list you are effectively creating a new list definition where you can add a custom columns. Visual Studio also creates a list instance from this list definition.By selecting Reuse existing list you are simply creating a list instance based on one of the built-in list types such as Announcement, Contacts or Tasks.
Creating a new SharePoint app project is easy. You simply create a new Visual Studio project using the SharePoint 2013 App template that is available with Visual Studio 2012. When you create a new project, Visual Studio prompts you for the URL to a test site that will be the target site for app installation when it is time to deploy, test and debug your app.
Each SharePoint app project created as a SharePoint-hosted app contains a single feature which is used to add elements to app web such as lists, pages and JavaScript files. Note that each SharePoint app project should contain exactly one feature and the scope of this feature should be equal to web which means the features activates at the site within the app web.A new SharePoint app project is created with the following modules:Content module: Used to add CSS files and images to app webImages module: Used to add image for App iconPages module: used to add pages (.aspx and .htm) to app webScripts module: used to add JavaScript source files to app webEverything SharePoint app required a manifest files which is named AppManifest.xml. The Visual Studio project template for SharePoint application automatically adds this file and provides default values for all the required settings.
When Visual Studio creates a new Visual Studio project for a SharePoint app, it automatically adds a start page named Home.aspx. Inside Home.aspx it adds two Content controls for the placeholders PlaceHolderAdditionalPageHead and PlaceHolderMain.Inside PlaceHolderAdditionalPageHead , Visual studio automatically adds links to App.css and App.js. However, PlaceHolderMain is initially empty. There is where you add the HTML to create the user interface for your start page.
While Visual Studio create the App.css file for you, this file is initially empty. This is where you add the CSS to style the HTML elements to Home.aspx as well as any other HTML page you might add to your project.Note that while you can directly edit CSS rules by hand inside App.css, there is also a visual editor that can be invoked by right-clicking the CSS file and select the Build Style… content menu command. This can provide an effective utility for those developers who are working with CSS for the first time and are not yet familiar with the syntax of CSS.
Here is a simple example of writing the “hello world” JavaScript behind Default.aspx. This code uses the jQuery document ready handler to call SP.SOD.executeFunc to register a callback function named sharePointReady which will fire when the page has loaded the script file named sp.js which is need to use the client-side object model.The code within the sharePointReady function updates the user interface of Default.aspx by updating the content of the div element with the id of message.
The application manifest file named AppManifest.xml is very important because it contains the application’s high-level metadata that is read by SharePoint during app installation. The version of AppManifest.xml shown in this example is very simples and represents the initial settings of the app after you create a new project.Note that a SharePoint application has a Name property which is used to construct the Url to the app’s start page. It also has an identifying GUID which served as the ProductID. There is also a Version number and an SharePointMinVersion attribute with a value of 15.0.0.0 that indicates the SharePoint application required SharePoint 2013 or later.The AppManifest must specify an application principal using an AppPrincipal element. The Internal setting is supplied by Visual Studio by default and can be used for SharePoint-hosted apps.
So how do you test and debug a SharePoint app project? It’s just like every other type of project in Visual Studio. You press the {F5} key to begin the process of packaging and deploying the app for testing.Note that is might take a long time such as 20 or 30 seconds to deploy your app the first time you press the {F5} key. However, it is much faster after that. When you press the {F5} for the second or third time, it often deploys in about 5-10 seconds.