Building an Alexa Skill with ASK CLI made easy
Have you ever tried to build an Alexa skill but stuck in doing too many customizations within Alexa developer console?
In this tutorial, you will build a skill faster and frictionless with the help of Alexa Skills Kit Command Line Interface (ASK CLI). This tutorial will be making use of NASA Astronomy Picture Of the Day API that generates each day a different image or photograph of our fascinating universe with a brief explanation about it.
You can request your API access key by visiting the portal: https://api.nasa.gov/
Before installing ASK CLI, you need:-
- An Amazon developer account
- Node.js and npm
- AWS IAM user setup
In case if you are a student, you can get credits of $100 on AWS by applying for AWS Educate (https://aws.amazon.com/education/awseducate/)
or within GitHub Student Developer Pack (https://education.github.com/pack).
Amazon Developers Account
If you don’t have an account yet, Create one through this link (https://developer.amazon.com)
Select amazon alexa.
Sign in or Create an account:-
LTS or Current release version of Node.js
Verify your installation with:-
node --version
AWS Account Setup
We will be using AWS Lambda to host the backend logic of our skill.
ASK CLI depends on AWS CLI for making any changes to the Lambda service, Here’s the link to install it.
Verify your installation with:-
aws --version
Configure AWS credentials
I am using my AWS Educate Account:-
Open your terminal and run:-
aws configure
Copy and paste your AWS Access Key ID and AWS Secret Access Key.
As you can see AWS Educate account offers the credentials for a session of 3 hours, so even I can’t use the above credentials again.
So, you need to setup your credentials each time after the expiration of the session when you are using the AWS CLI or ASK CLI for making any changes to the Lambda service.
Keep the region name and output format as default, just hit enter for both of them.
Install ASK CLI
open the command prompt and run:-
npm install -g ask-cli@2.0.0
Installation might require to run as administrator, On windows use PowerShell with the Run as Administrator option, On Linux or macOS use sudo.
At the time of writing this article, I found some inconsistencies with the latest release(2.13.0), hence working with the previous release would be better.
While using ASK CLI for the first time, you need to configure Amazon developer account and AWS account, run:-
ask configure
Step 1 of 2:
This will redirect you to a Sign-in window, where you need to sign in to your Amazon Developer Account.
Step 2 of 2:
We are hosting our backend logic on AWS Lambda, hence type Y to link your AWS account.
Choose your profile to be linked(default in our case).
Configuration is complete now, Let’s start building our skill.
Create a new skill
ASK CLI avails a set of starter templates to save you from the heavy lift of setting up your skill base structure.
To create a new skill, run:-
ask new
We will be using NodeJS to code our skill, AWS Lambda to host skill’s backend resources.
We are starting from the Hello world template (Alexa’s hello world skill to send the greetings to the world!) which is the most elementary template out of the available ones.
(skill name: AstroPic, folder name: AstroPic).
Navigate to your skill folder: cd AstroPic
Currently what our skill doing is:-
(You can test the skill by running ask deploy
Open skill.json
skill.json is the file where all the publishing info exists about our skill.
Update your skill.json file summary about the skill, example phrases by which the skill will be invoked, description about the skill, and image icon URL for the skill.
I already hosted the Icon image on Amazon S3 Bucket.
"smallIconUri": "https://alexaapodskill.s3.amazonaws.com/skillicon108.png", "largeIconUri": "https://alexaapodskill.s3.amazonaws.com/skillicon.png"
We also need to configure APL(Alexa Presentation Language), as our skill includes a visual experience for devices like Echo Show, Fire TV, some Fire tablets, etc.
Now open interactionModels/custom/en-US.json
Change your invocation name to astropic.
As you can observe a list of intents in the file above. An intent represents an action that fulfills a user’s spoken request. In the above list, all the intents except HelloWorldIntent are standard built-in intents. The standard intents are used for common, general actions such as stopping, canceling, and asking for help.
The only custom intent in the list is HelloWorldIntent, which is responsible for the action of responding with a message of “Hello World!”.
So, let’s customize it more to make it responsible for the action of responding with a photograph and a message on info about the photograph.
Replace the HelloWorldIntent with RequestPicIntent.
Customize the sample utterances according to our needs. The sample utterances are set of likely spoken phrases mapped to the intents.
Now, it’s time to convert our intents into actions.
Open index.js
As you can observe different request handlers to handle the different types of incoming requests to your skill in the above file.
Let’s breakdown the actions of the above code:-
- LaunchRequestHandler:- Respond to LaunchRequest when the user invokes the skill.
In the above case when the user invokes the skill with the utterance “open hello world”(open {skillname}), the skill will respond with the welcome message as shown above.
Let’s customize the welcome message according to our needs.
2. HelloWorldIntentHandler:- Respond to the sample utterances provided in en-US.json
for the HelloWorldIntent.
In the above case respond with the message of “Hello World!” when the user utters any of the sample utterances provided.
As we already replace the HelloWorldIntent with the RequestPicIntent in the en-US.json
, rename the HelloWorldIntent as RequestPicIntent everywhere in the index.js
(HelloWorldIntent is used 3 times).
As we need to hit a GET request to the endpoint of NASA APOD API to retrieve the image and info, let’s write a function that process requests and sends back responses from the server via callback.
Copy the function above the LaunchRequestIntent.
Build better voice apps. Get more articles & interviews from voice technology experts at voicetechpodcast.com
We also need https module to make our request.
var https = require('https');
Include the code above httpGet()
function.
We need to call the above function inside our RequestPicIntent handler, also before responding with a response we need to check whether our device supports APL(Alexa Presentation Language) or not (whether our device is Echo Show, Fire TV, Fire tablets(devices with display interface) or not).
If our device supports APL then our skill sends a custom directive (an arbitrary payload) that our device can understand. It’s just like defining the way to display our image and info.
If our device does not support APL then we will respond with the message of info and a skill card. Skill cards are used to display text and image on Alexa app via iOS and Android devices or Alexa app via a web browser, as they does not support APL to display our image and info.
The RequestPicIntentHandler look like:-
We also need to write the function supportsAPL()
.
You can add the above function below the httpGet()
function.
Including a card in skill’s response:-
(For devices that not supports APL)
.withStandardCard(response.title,response.explanation,response.url,response.url)
{.withStandardCard(title, content, smallImageUrl, largeImageUrl)}
RenderDocument directive:-
(For devices that supports APL)
.addDirective({type: 'Alexa.Presentation.APL.RenderDocument',document: require('./imagescreen.json'),datasources: {"imageData": {"title": response.title,"image": response.url,"explanation": response.explanation}}})
The directives of type RenderDocuent Instructs the device to display the APL content provided in the specified document
. We are providing a JSON (an object that defines a template to display on a device with a screen) to the document
property as a parameter.
datasources
used to bind content to the document. we are providing an object named imageData
as a parameter.
Response by NASA APOD API:-
{"copyright":"Robert Gendler","date":"2020-08-04","explanation":"Distorted galaxy NGC 2442 can be found in the southern constellation of the flying fish, (Piscis) Volans. Located about 50 million light-years away, the galaxy's two spiral arms extending from a pronounced central bar have a hook-like appearance in wide-field images. But this mosaicked close-up, constructed from Hubble Space Telescope and European Southern Observatory data, follows the galaxy's structure in amazing detail. Obscuring dust lanes, young blue star clusters and reddish star forming regions surround a core of yellowish light from an older population of stars. The sharp image data also reveal more distant background galaxies seen right through NGC 2442's star clusters and nebulae. The image spans about 75,000 light-years at the estimated distance of NGC 2442.","hdurl":"https://apod.nasa.gov/apod/image/2008/NGC2442_HstGendler_2400.jpg","media_type":"image","service_version":"v1","title":"NGC 2442: Galaxy in Volans","url":"https://apod.nasa.gov/apod/image/2008/NGC2442_HstGendler_960.jpg"}
We are passing the title, image, and explanation to the imageData
object.
Now, let’s design a template on APL Authoring Tool.
As we are linking our template manually, so hit a No to the dialog.
I am starting from Image Left Detail Sample Template.
After customizing our template according to our needs, the APL code will be:-
Create a JSON file in lambda
folder, and paste the above code.
As we provided the imageData
object as a parameter to datasources
, we are passing the data to our template (through imageData.title, imageData.image, imageData.explanation
).
3. HelpIntentHandler:- Respond to the sample utterances like help.
Let’s customize the help message according to our needs.
I am not making any changes to other intent handlers.
Now it’s time to deploy and test our skill.
Deploy the skill
To deploy the skill run:-
ask deploy
You can verify your newly created skill and lambda fuction through amazon developer console and AWS Lambda console.
Congrats, we build and deploy our skill through the CLI without the heavy lift of the console.
Test the skill
To test your skill from the command line, run ask dialog
and specify a locale supported by your skill:
ask dialog --locale en-US
The command opens an interactive terminal in which you can simulate a multi-turn conversation with Alexa:
For testing the skill on display interfaces, you can use alexa developer console
If you like the article and made the alexa skill without any hassle of too many customizations within Alexa developer console, please hit a clap.
You can also check out the code:-
If you are stuck at something feel free to connect with me on LinkedIn or Twitter.