Tips & Tricks

JetBrains AI Assistant for JavaScript Developers – WebStorm

There is no doubt that the advent of AI is changing the way many of us work. Whether you choose to accept this with optimism… or skepticism… is a topic for another day. We choose optimism, as AI has incredible potential to improve how we work.

In this blog post, we’ll look at how you can speed up your workflows and simplify JavaScript and TypeScript development with the help of AI in JetBrains IDEs. We’ll use WebStorm as an example, but most of the AI features will work the same way in our other IDEs.

What is an AI coding assistant?

First, let’s clarify what AI coding assistants are. Simply put, these are tools that leverage artificial intelligence to assist you with different kinds of programming tasks – from writing code to working with Git. Some examples of popular AI coding assistants include Tabnine, GitHub Copilot, and JetBrains AI Assistant.

Why use an AI coding assistant?

Why have so many developers been adopting AI coding assistants in their workflow lately? The answer is simple – productivity. When used effectively, AI tools help you save time and reduce the amount of routine work you have to do on a daily basis. Just make sure that the tool you’re using takes data and code security seriously.

AI for JavaScript developers – how can it help?

JavaScript development has its own unexpected, often meme-able behavior that can be hard to troubleshoot. From infamous “callback hell” to the complexities of asynchronous programming, you can find yourself grappling with intricate code structures that are daunting to untangle.

AI coding assistants can help with problems like these. Let’s take the “callback hell” problem as an example. This issue arises primarily due to the heavy use of callbacks for asynchronous operations, leading to nested callbacks that are hard to read and maintain. Here’s how JetBrains AI Assistant can help you rewrite the function and replace “callback hell” with an async/await approach in just a few clicks.

Using AI Assistant to generate code to mitigate call back hell

This is just one example of how easily AI eliminates problems like this in your IDE.

Overview of JetBrains AI Assistant in WebStorm

Let’s see what AI functionality you can benefit from in WebStorm. JetBrains AI Assistant can help you with a range of tasks – from getting to know your project better to testing and working with version control. And, of course, writing code. 

Let’s take a look at the key features available in JetBrains AI Assistant. You can start with a free 7-day trial and then switch to one of the available subscription plans. For more information on how to get started, see this section

Smart chat

You can call up JetBrains AI Assistant directly from the IDE. The best part about this: Not only can you ask the AI questions from the built-in chat window, but because it’s integrated with the IDE, you can take its responses and code suggestions and apply them directly to your project.

tab-labels

AI prompts

There are a bunch of prewritten prompts that are available in the right-click context menu under AI Actions. They use AI backed by project-specific context from WebStorm to help you simplify routine tasks, such as:

  • Explain code. AI can give you a comprehensive explanation of how the code works to help you understand the logic behind it faster.
  • Find the best way to refactor code. The action for suggesting refactorings shows how you can refactor your code to make it more readable and maintainable.
  • Identify potential problems. You can also ask AI to find potential issues you may want to look into, like missing error handling or partial usage of Promise.all().
  • Generate code, documentation, and tests. The capabilities of AI don’t end at just being able to suggest code as you program. It can also generate things for you from scratch while staying in the context of the project. This is perfect for all sorts of your least favorite tasks, such as writing documentation or tests.
Using AI Assistant Suggest Refactoring Action to improve the code by modernizing it

That’s not all! You can also add your own prompts to the context menu for other actions you use often.

Help with version control

Routine version control tasks are another prime candidate for offloading onto AI. For example, JetBrains AI Assistant can generate commit messages for you or help you edit and improve the ones used for the commits you’ve already made. What’s more, it can summarize the changes from other commits.

tab-labels

Multi-line code completion

With JetBrains AI Assistant, you also get more powerful code completion. It can autocomplete entire functions or even blocks of code as you type based on the context of your project. The code it generates will be similar to how you would write the code, matching your style and naming conventions.

Name suggestions

Naming things in code is the most difficult task a human can ever undertake[citation needed], so why not let AI do it for you? When you rename a symbol, JetBrains AI Assistant will provide suitable suggestions for it based on the current context.

tab-labels

Runtime error explanation

JavaScript can be notorious for its unexpected runtime errors. With the click of a button, JetBrains AI Assistant can analyze and suggest fixes for runtime errors, which can be inserted straight into your files.

tab-labels

In essence, JetBrains AI Assistant is the ultimate augmentation of your IDE. It will enhance the features you already love with AI capabilities and provide context-aware smart assistance to help you take care of the tasks you don’t. 

Try JetBrains AI Assistant

See our documentation for more information on JetBrains AI Assistant features available in WebStorm.

Conclusion

The era of AI in JavaScript development represents a paradigm shift in how we approach coding. With AI coding assistants like JetBrains AI Assistant, you can stay more productive while reducing the amount of routine and stressful tasks to a minimum. Give it a try and see for yourself!

The WebStorm team

image description