How to install WebStorm on Ubuntu 20.04 [The smartest JavaScript IDE]

0 Shares

WebStorm is an Integrated Development Environment(IDE) designed specifically for modern JavaScript and related technologies. Like other JetBrains IDEs, it makes your development experience more enjoyable, automating routine work and helping you handle complex tasks with ease.

It’s an powerful and intelligent IDE that gives you the best coding assistance for JavaScript, HTML and CSS and a wide range of modern web technologies.

Developers can utilize smart completion of code, real-time error detection, JavaScript refactoring and navigation, language stylesheet, TypeScript, and leading frameworks.

The technology is lightweight yet comprehensive as it carries solutions for complex client-side development and server-side development with Node.js.

With WebStorm’s integration with VCS, developers can tap a simple unified UI to work with Git, GitHub, Mercurial, and more.

Users can commit files, review changes and resolve conflicts with a visual tool integrated within the IDE.

To make sure your code can be easily maintained, you must first be sure to make it clean and tidy. This is the part where WebStorm really helps you. It automatically refactors your code by performing functions on it, such as extraction of variables, moving files, inline variable extraction, etc.

The local history feature in Webstorm tracks all your local changes in the source code that you are making. You can use it to view changes that you’ve made to your code and roll back whenever necessary.

WebStorm is a cross platform application available for Microsoft Windows, macOS and Linux.

Table of Contents

Key Features of WebStorm:

Smart editor
Seamless tool integration
Support for React Native, PhoneGap, Cordova and Ionic and Node.js.
Built-in debugger
Customizable
Advanced coding assistance for Angular, React, Vue.js and Meteor
Plugin marketplace
Code quality tools
Coding assistance for JavaScript and compiled-to-JavaScript languages, Node.js, HTML and CSS
Project templates
Remote collaborative development
Built-in HTML preview
Local history
Built-in HTTP client
Navigation & Search: WebStorm helps you get around your code more efficiently and save time when working with large projects.
Integrated terminal

Basic system requirements for WebStorm:

These are the minimum system requirements for installing WebStorm on a Linux System.

RAM: 2 GB of Free RAM minimum, 8 GB of total system RAM (Recommended)
CPU: Any modern CPU, Multi-core CPU. WebStorm supports multithreading for different operations and processes making it faster the more CPU cores it can use.
Disk space: 2.5 GB and another 1 GB for caches, SSD drive with at least 5 GB of free space (Recommended).
Monitor resolution: 1024×768, 1920×1080 (Recommended)
GNOME or KDE desktop

Note: You do not need to install Java to run WebStorm because JetBrains Runtime is bundled with the IDE (based on JRE 11).

But if necessary you can follow the below steps to install Java:

Installing Java

Type the following command to check whether Java is already installed on your system.

$ java -version

You can skip this step if Java is already installed, and if Java is not installed then follow the steps below.

In this tutorial I will install OpenJDK 11 and the installation is pretty straightforward.

First update the package index and then Install the OpenJDK 11 package by typing the following command.

$ sudo apt update && sudo apt install openjdk-11-jdk

This article explains two methods of installing WebStorm IDE on Ubuntu 20.04.

Choose the installation method that is most appropriate for your environment.

Method 1: Installing WebStorm as a Snap Package

The easiest way to install WebStorm on Ubuntu 20.04 is by using the snap packaging system.

WebStorm snap package is distributed and maintained by JetBrain.

A snap package is a type of universal Linux package that you can enjoy irrespective of the distro. Its an self-contained software packages that include the binary all dependencies needed to run the application.

All you need is the snap service pre-configured, In the case of Ubuntu 20.04, it comes with snap pre-installed.

If snapd package is not already installed then you can install it by running following command.

$ sudo apt install snapd

Note: Snap packages can be installed from either the command-line or via the Ubuntu Software application.

This is actually the Snap version of the WebStorm. It can be used on any Linux distribution that has Snap support.

Open your terminal (Ctrl+Alt+T) and type the following command to install the WebStorm IDE package.

$ sudo snap install webstorm --classic

The --classic option is required because the WebStorm snap requires full access to the system, like a traditionally packaged application.

That’s It. Now you can open the WebStorm application with the help of Activities search bar.

Method 2: Installing WebStorm IDE from Source

Compiling WebStorm IDE from the source allows you to install the latest WebStorm version. Follow the following steps to install WebStorm using the source code method.

Step #1

Open a terminal (CTRL+ALT+T) and execute the below commands to update packages.

$ sudo apt update && sudo apt upgrade

Step #2

Download the latest WebStorm source code package from the official website. You can do so using wget Command.

$ sudo wget https://download-cdn.jetbrains.com/webstorm/WebStorm-2021.2.3.tar.gz

Or visit official website and download from there.

Step #3

Once the download is complete extract the .tar.gz file with the help of tar command.

Extract the tarball to a directory that supports file execution.

For example, to extract it to the recommended /opt directory, run the following command:

$ sudo tar -xzf WebStorm-2021.2.3.tar.gz -C /opt

Note: Do not extract the tarball over an existing installation to avoid conflicts. Always extract it to a clean directory.

Step #4

Execute the webstorm.sh script from the extracted directory to run WebStorm.

$ sudo ./webstorm.sh

As soon as you run the script the WebStorm application will start.

At this step, you have successfully installed WebStorm IDE application on Ubuntu 20.04 system.

To create a desktop entry of the application: From the main menu of IDE, click Tools -> Create Desktop Entry.

Starting WebStorm

You can launch the WebStorm IDE application with the help of the Launcher icon created on the desktop.

OR run the webstorm.sh shell script in the installation directory under bin/.

Once you launch WebStorm, you will see the Welcome screen, the starting point to your work with the IDE, and configuring its settings. This screen also appears when you close all opened projects.

Start a project in WebStorm

On the Welcome screen, you can do the following:

Create a new project
Create a project from existing local sources
Open an existing project or file
Check out an existing project from a version control system

Note: It is also possible to drag an existing project directory or a separate file to the Welcome screen and open it in WebStorm.

How to Uninstall WebStorm from Ubuntu 20.04

For some reason, If you want to uninstall WebStorm application, refer following steps.

Step #1

Delete the installation directory.

Step #2

Remove following directories.

Syntax:	
~/.config/JetBrains/<product><version>
~/.cache/JetBrains/<product><version>
~/.local/share/JetBrains/<product><version>

Example:
~/.config/JetBrains/WebStorm2021.2
~/.cache/JetBrains/WebStorm2021.2
~/.local/share/JetBrains/WebStorm2021.2

Conclusion

I hope that now you have a good understanding of How to install WebStorm on Ubuntu 20.04 LTS Focal Fossa.

If anyone does have any questions about what we covered in this guide then feel free to ask in the comment section below and I will do my best to answer those.

Source: