We love JavaScript and TypeScript just as much as the next dev, but building high-performing, highly scalable Node.js apps sure isn’t easy! In particular, determining how exactly components work and interact with each other in different libraries and frameworks can be really challenging.
Also, event-driven code execution makes it hard to understand how Node.js backend code actually works, especially when you’re working with older code that uses callbacks (callback hell or pyramid of doom, anyone?!). JavaScript’s relative lack of guardrails and not dictating design patterns as much as other languages do is great, but that increased freedom means you need solid architectural oversight and thorough code reviews.
We’ve also found that while the Node.js core is super stable, the dev tooling is a bit immature compared to other languages. If you’re not careful, you end up writing messy Node.js apps. It takes a lot of grit and discipline to write really good JavaScript and TypeScript code! This is probably why the languages can be so difficult to learn on your own, and why skilled JavaScript and TypeScript developers can be so hard to find.
So… let’s solve some of these challenges, shall we?!
We are THRILLED to announce that after many requests from our community, we’re releasing the beta version of AppMap for JavaScript!!
What’s AppMap?
Here’s the deal for those of you who aren’t yet familiar: AppMap is like Google Maps for your backend code. It works with Ruby, Java, Python - and now JavaScript and TypeScript. AppMap collects information about how your code works and what it does as your code runs, and this information is presented as interactive visualizations that you can search and navigate. It works equally well with monolithic code bases and microservices.
AppMap is free and open source, and you can use it right in your code editor (VSCode or JetBrains) so your flow isn’t ever interrupted.
What can I do with it?
AppMap is a really helpful tool for working with complex languages like JavaScript and TypeScript, because it allows you to a) understand what exactly you’ve just built and b) what other devs have built.
For example, you can use AppMap to:
- Document and explain your code – AppMap automatically documents end-to-end code and data flows, web services catalogs and your app’s database schema as you work. You can also record interactive maps of any piece of code and share it with other devs via a URL or by attaching it to a ticket in Jira or GitHub to clearly communicate your code’s behavior, logic and design.
- Understand how new-to-you code works – Instead of trying to decipher an entirely new codebase, you can use AppMap to learn and read just the code that’s relevant to your task. Source code is just a click away, so you can easily move back and forth between high-level code design views, code execution traces and source code details.
- Debug code – Since AppMap provides interactive maps of all the factors that might be contributing to a bug, you can figure out where things are going wrong. You can quickly navigate around source code, and see parameter values, HTTP server and client requests and complete SQL queries.
What are the requirements?
You’ll need Node v14, 16, 17 (latest update) to get the most out of AppMap for JavaScript.
Currently, AppMap for JavaScript is optimized to work with:
- An application that has mocha tests, mocha >= 8.0.0 (older versions are not supported)
- An application that uses the Express.js framework 4.x
- A git repository
- An application that uses one of these DB drivers: mysql, pg or sqlite3
How do I get started?
Here’s a brief video that walks you through how to install the AppMap extension for VSCode, how to install the AppMap agent for JavaScript and how to use them to visualize the architecture of a Node.js application:
Where can I find more info?
Check out our doc site for more info on how AppMap works and what you can use it for. A detailed reference guide for AppMap for JavaScript can be found here. For more AppMap tutorials, check out our blog and YouTube channel.
Let us know what you think or if you have any questions! You can chat with us 1:1 on our Slack, tweet us @getappmap or email us anytime.
Happy AppMapping!
Get AppMap