Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Introduccion a sharepoint framework

486 views

Published on

Introduccion a Sharepoint Framework

Published in: Software
  • Be the first to comment

Introduccion a sharepoint framework

  1. 1. Luis Valencia – MVP www.luisevalencia.com CTO @ Software Estratégico www.softwareestrategico.com Twitter: @levalencia
  2. 2. Code samples Guidance documentation Monthly community calls Case Studies Themes SharePoint Framework SharePoint add-ins Microsoft Graph Office 365 development “Sharing is caring” http://aka.ms/OfficeDevPnP
  3. 3. • Herramientas • Node.js • Yeoman • Gulp • Typescript • Visual Studio (Code) • Frameworks • React • Angular.js • Knockout • Etc.
  4. 4. IIS Express VS Project  New  <Template> C#
  5. 5. https://nodejs.org/en/
  6. 6. https://www.npmjs.com/
  7. 7. http://yeoman.io
  8. 8. http://gulpjs.com/
  9. 9. https://www.typescriptlang.org/
  10. 10. http://dev.office.com/fabric
  11. 11. https://msdn.microsoft.com/en-us/office/office365/howto/setup-development-environment No solo la colección de sitios debe ser de desarrollo, todo el tenant, es decir el tenant actual que tienen en sus empresas en producción no tiene la característica habilitada para desarrollar con Sharepoint Framework.
  12. 12. Navegar a SharePoint Centro de administración escribiendo el siguiente URL en su navegador. Sustituir yourtenantprefix con su prefijo de Office 365. https://yourtenantprefix-admin.sharepoint.com En la barra lateral izquierda, haga clic en el elemento de menú de aplicaciones y haga clic en App Catalog. Haga clic en el botón Aceptar para crear un nuevo sitio catálogo de aplicaciones. En la página siguiente, introduzca los siguientes datos: Título: Catalogo de aplicaciones Sitio Web Dirección sufijo: Llene sufijo preferido para catálogo de aplicaciones, por ejemplo: aplicaciones Administrador: Introduzca su nombre de usuario y haga clic en el botón de decisión para resolver el nombre de usuario Haga clic en el botón OK para crear el sitio catálogo de aplicaciones. SharePoint en este momento va a crear el sitio catálogo de aplicaciones y usted será capaz de ver su progreso en el centro de administración de SharePoint
  13. 13. Navegar a SharePoint Centro de administración escribiendo el siguiente URL en su navegador. Sustituir yourtenantprefix con su prefijo de Office 365. https://yourtenantprefix-admin.sharepoint.com En la barra de SharePoint, haga clic nuevo-> Colección de sitios privada. En el cuadro de diálogo, introduzca lo siguiente: Título: escriba un título para su colección de sitio de desarrolladores, por ejemplo: desarrollador del sitio Sitio Web Dirección sufijo común: Introduzca un sufijo para la colección de sitios desarrollador, por ejemplo: dev Selección de plantilla: Seleccione Sitio desarrollador como la plantilla colección de sitios Administrador: Introduzca su nombre de usuario y haga clic en el botón de decisión para resolver el nombre de usuario Haga clic en el botón Aceptar para crear la colección de sitios
  14. 14. Con el fin de depurar y vista previa SPF Webparts que necesitamos para cargar la página workbench.aspx, también tenemos que crear una nueva columna, las instrucciones son las siguientes: Crear la nueva columna Siga los pasos de abajo para agregar el nuevo campo a la biblioteca Documentos: Haga clic en el icono de engranajes en la parte superior derecha y haga clic en Configuración del sitio para abrir la página de configuración. Haga clic en las bibliotecas y las listas del sitio en la categoría Administración de sitios. Haga clic en Personalizar Documentos Ahora, haga clic en Crear columna en Columnas: Tipo ClientSideApplicationId como el nombre de la columna y dejar otros campos como son. Haga clic en el botón Aceptar para crear la columna. Luego sube el workbench.aspx, última versión se puede encontrar [aquí] (https://github.com/SharePoint/sp- dev-docs/wiki/Setup-SharePoint-Tenant)
  15. 15. a. Instalar nodejs LTS (Long Term Support) versión. Descargar desde aqu b. Instalar NPM Abra un símbolo del sistema y pega: npm -g install npm@next c. Si está utilizando Windows instalar este paquete: npm install --global --production windows-build-tools d. Instalar VS CODE. Descargar desde aquí e. Instalar Yeoman y gulp. Abrir y ejecutar CMD npm i -g yo gulp f. Instalar Yeoman Sharepoint generador. npm i -g @microsoft/generator-sharepoint nt
  16. 16. https://github.com/waldekmastykarz/spfx-sample-dllcode/blob/master/gulpfile.js
  17. 17. Las propiedades que tenemos en el webpart a medida que las actualizamos se ven reflejadas en la funcionalidad del webpart en tiempo real, esto se llama el Reactive Property Pane, sin embargo en algunas ocasiones puede ser necesario desactivar esto
  18. 18. www.nodejs.org www.gulpjs.com https://www.typescriptlang.org www.yeoman.io www.git-scm.com/ dev.office.com/fabric webpack.github.io facebook.github.io/react angularjs.org knockoutjs.com handlebarsjs.com
  19. 19. https://blogs.office.com/2016/05/04/the-sharepoint-framework-an-open-and- connected-platform/ http://dev.office.com/blogs/getting-started-with-web-stack-in-sharepoint- development www.luisevalencia.com

×