Alexa Skills Kit y Visual Studio Code

Analizamos el potencial de dos nuevas herramientas de Alexa: Alexa Skills Kit y Visual Studio Code.

Javi Mora Díaz
Sonara
4 min readSep 8, 2020

--

Hace muy poco vio la luz una nueva extensión para Visual Studio Code para desarrollar Skills de Alexa. Creo que esta extensión ayudará mucho a todas aquellas personas que queráis comenzar a desarrollar Skills de Alexa ya que facilita mucho el trabajo.

Comenzamos por descargar Visual Studio Code si no lo tenéis ya instalado, es un IDE de desarrollo gratuito que personalmente recomiendo, no solo por ser gratuito, sino por tener una interfaz muy limpia y agradable, además de ser un IDE muy ligero y sencillo y con infinidad de extensiones.

Visual Studio Code

Tenemos un menú donde podemos visualizar los ficheros de nuestro proyecto, realizar búsquedas, sincronizar con nuestro repositorio, ejecutar nuestra app o bien gestionar nuestras extensiones. Esta última es la que nos interesa ahora.

Seleccionamos la opción de menú y nos aparecerá un listado enorme de extensiones, buscamos la que nos interesa ahora que es Alexa Skills Kit (ASK) Toolkit y le damos a “Install”

Alexa Skill Kit

La propia extensión ofrece una documentación muy completa por si queréis echarle un ojo. Ahora os pedirá abrir un navegador para que hagáis login en vuestra cuenta de Alexa y así poder crear y gestionar Skills en vuestra propia cuenta.

En este primer ejemplo vamos a crear una nueva Skill en nuestra cuenta de Alexa.

Welcome Page

Podemos crear la Skill desde la página de welcome o bien desde el menú situado a la izquierda.

Solo nos queda introducir la información mínima necesaria para crear nuestra Skill, actualmente solo podemos crear hosted Skill en NodeJS y Python.

Nuestra Skill comenzará a crearse como podemos ver en la siguiente imagen.

Skill creation view

Una vez finalizada podéis ver como se ha creado la estructura de directorios y archivos de nuestra Skill, y además, si vamos a nuestra consola de Alexa veremos como ya nos aparece.

Todo esto hasta ahora son acciones básicas que podíamos hacer con ask cli, pero esta extensión ofrece más posibilidades.

Podemos deployar la Skill con una simple opción de menú, ejecutar los test, o también crear una capa de presentación con Alexa Presentation Language (APL).

Para crear nuestro APL podemos basarnos en una plantilla, nombramos nuestra plantilla y listo!! ya tenemos no solo nuestro APL creado sino que además podemos previsualizarlo en el mismo IDE.

Crear nuevo APL
Previsualización APL

En el caso que queráis abrir una Skill que tengáis con APL con esta nueva extensión, es posible que no visualicéis la capa de APL si no está estructurado de la misma manera que lo hace visual studio:

skill-package/response/display/test

APL directory

Esto simplemente nos crea la estructura de APL, nosotros ahora tendremos que incorporarlo en nuestra lambda para que al abrir la Skill se muestre nuestra capa visual.

Además de estas acciones podremos editar la Skill en la consola con la opción “Edit in console”, descargar una Skill que ya tengamos en nuestra cuenta (Sólo hosted Skill), abrir una Skill que tengamos en local…

En resumen creo que para aquellos que usáis Visual Studio Code os puede facilitar un poco mas la vida al hacer deploy, crear plantillas de APL, etc. Y para aquellos como yo que usamos otro tipo de IDE puede suponer un motivo de cambio.

Esperemos que evolucione esta extensión y poco a poco adquiera más funcionalidad.

¿Y vosotros que IDE usáis para desarrollar Skills de Alexa?

--

--