DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Please enter at least three characters to search
Refcards Trend Reports
Events Video Library
Refcards
Trend Reports

Events

View Events Video Library

Zones

Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks

Last call! Secure your stack and shape the future! Help dev teams across the globe navigate their software supply chain security challenges.

Modernize your data layer. Learn how to design cloud-native database architectures to meet the evolving demands of AI and GenAI workloads.

Releasing software shouldn't be stressful or risky. Learn how to leverage progressive delivery techniques to ensure safer deployments.

Avoid machine learning mistakes and boost model performance! Discover key ML patterns, anti-patterns, data strategies, and more.

Related

  • Let’s Build an End-to-End NFT Project Using Truffle Suite
  • 3 Easy Steps for a (Dev)Containerized Microservice With Jolie and Docker
  • Remote Pair Programming with IntelliJ, Eclipse and VS Code
  • How Continuous Integration Can Help You to Make a Simple Deploy in Salesforce

Trending

  • A Developer's Guide to Mastering Agentic AI: From Theory to Practice
  • How to Convert XLS to XLSX in Java
  • Measuring the Impact of AI on Software Engineering Productivity
  • Mastering Advanced Traffic Management in Multi-Cloud Kubernetes: Scaling With Multiple Istio Ingress Gateways
  1. DZone
  2. Coding
  3. Tools
  4. New VS Code Debugging Tools for Alexa

New VS Code Debugging Tools for Alexa

Take a look at the new tools launched by the Amazon Alexa team for Visual Studio Code, and learn how to have a full development environment with these tools.

By 
Xavier Portilla Edo user avatar
Xavier Portilla Edo
DZone Core CORE ·
Nov. 16, 21 · Tutorial
Likes (1)
Comment
Save
Tweet
Share
6.2K Views

Join the DZone community and get the full member experience.

Join For Free

During the last months, the Alexa team has launched a bunch of useful tools for Visual Studio Code. The purpose of these new features is to have a single place with everything set up. Also having all these tools in the same place, we do not have to switch between multiple apps or tabs. In this article, I will show you how you can have a full dev-env for Alexa skills on Visual Studio Code.

  • New VS Code Debugging Tools for Alexa
    • Prerequisites
    • Setting up our Alexa Skill
    • Creating the Visual Studio Configuration
    • Alexa Simulator
    • Launching and debugging our Alexa Skill locally
    • Video with the full explanation
    • Resources
    • Conclusion

Prerequisites

Here are the technologies used in this project:

  • Node.js v14.x
  • Visual Studio Code
  • Alexa extension on VS Code

Setting Up Our Alexa Skill

The first step we need to do to enable local debugging on our Visual Studio Code is basically just adding 2 packages npm: ask-sdk-model and ask-sdk-local-debug. The first one you should already have, but it is worth it to upgrade it to the latest version. You should use v1.29.0 or higher!

The second package, ask-sdk-local-debug, is the most important one. This is a devDependency instead of a normal dependency. Why? Well, we just need it only for development purposes. This package is the one that we are going to use to launch our AWS Lambda locally and intercept all the calls from the Alexa Voice Service.

To install these dependencies, you have to run these commands:

  1. For npm:
JavaScript
 
    npm install --save ask-sdk-model@^1.29.0
    npm install --save-dev ask-sdk-local-debug


  1. For yarn:
JavaScript
 
    yarn add ask-sdk-model@^1.29.0
    yarn add ask-sdk-local-debug --dev


With these packages installed/updated, we have done great progress on this journey! Let's continue with the following steps.

Creating the Visual Studio Configuration

Once we have the packages we need installed/upgraded, we need to create a Visual Studio configuration to launch our AWS Lambda.

All the Visual Studio configurations should be placed down in the .vscode folder. In this folder, we are going to create a file called launch.json:

JavaScript
 
    {
        "version": "0.2.0",
        "configurations": [
            {
                "name": "Debug Alexa Skill (Node.js)",
                "type": "node",
                "request": "launch",
                "program": "${command:ask.debugAdapterPath}",
                "args": [
                    "--accessToken",
                    "${command:ask.accessToken}",
                    "--skillId",
                    "${command:ask.skillIdFromWorkspace}",
                    "--handlerName",
                    "handler",
                    "--skillEntryFile",
                    "${workspaceFolder}/lambda/index.js",
                    "--region",
                    "EU"
                ]
            }
        ]
    }


Let's explain a little bit deeper the most relevant parameters that we have in this configuration that we called Debug Alexa Skill (Node.js):

  1. program: this parameter auto-detects the launcher program that we need to run our AWS Lambda locally. This program was installed when we installed the ask-sdk-local-debug package.
  2. arguments:
    1. accessToken: this is the token we need to intercept the Alexa skill invocations locally.
    2. skillId: this is the id of our Alexa skill.
    3. handlerName: this is the name of the object created on our AWS Lambda that will get all the invocations. 
    4. skillEntryFile: where the handler is located (in which file).
    5. region; the region of YOUR Alexa developer account. I set to EU because my account is from Europe. The available values are NA (North America), FE (Far East), EU (Europe).

Creating this configuration you will be able to run your AWS directly on your VS Code from the debug tab:

Debug tag

And you will see this output on your Debug Console:

Output from Debug Console

After this, you can set up all the breakpoints you want.

Alexa Simulator

When you install the Alexa extension on your VS Code you will see the Alexa icon on the left sidebar. Clicking there you will see a lot of options that you can use for your daily development like downloading the interaction model, the APL viewer, downloading the skill manifest, deploying your Alexa skill, or directly testing your skill within VS Code:

options for daily development

If we click on the Simulator, we will have a screen very similar to the test tab on the Alexa Developer Console but now on your IDE!

Test tab

Having these nice tools properly set, it's time to launch our Alexa skill and see if the code stops on the breakpoints.

Launching and Debugging Our Alexa Skill Locally

When we invocate the Alexa skill from the Simulator and you have run your AWS Lambda locally, you will start seeing that all the interactions are intercepting:

Simulator screenshot: interactions are intercepting

So this means that the code that is executing is the code that we have on our lambda folder locally! Let's put some breakpoints and see if that works:

Putting in breakpoints

And voilà, it worked!

Video With the Full Explanation

And that's it, here you have the full explanation in an Alexa Office EU Hours session with me and Gaetano Ursomano from the Alexa team.


Resources

  • Official Alexa Skills Kit Node.js SDK — The Official Node.js SDK Documentation
  • Official Alexa Skills Kit Documentation — Official Alexa Skills Kit Documentation

Conclusion

As you can see, the Amazon team has created nice tools to have everything in the same ecosystem. Looking forward to seeing what you are going to develop!

I hope this example project is useful to you. You can find the code here.

That's all folks! Happy coding!

Virtual screening Visual Studio Code

Published at DZone with permission of Xavier Portilla Edo, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

Related

  • Let’s Build an End-to-End NFT Project Using Truffle Suite
  • 3 Easy Steps for a (Dev)Containerized Microservice With Jolie and Docker
  • Remote Pair Programming with IntelliJ, Eclipse and VS Code
  • How Continuous Integration Can Help You to Make a Simple Deploy in Salesforce

Partner Resources

×

Comments
Oops! Something Went Wrong

The likes didn't load as expected. Please refresh the page and try again.

ABOUT US

  • About DZone
  • Support and feedback
  • Community research
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Core Program
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 100
  • Nashville, TN 37211
  • support@dzone.com

Let's be friends:

Likes
There are no likes...yet! 👀
Be the first to like this post!
It looks like you're not logged in.
Sign in to see who liked this post!