{"id":6045,"date":"2018-12-21T09:05:34","date_gmt":"2018-12-21T09:05:34","guid":{"rendered":"https:\/\/www.appservgrid.com\/paw92\/?p=6045"},"modified":"2018-12-28T22:32:06","modified_gmt":"2018-12-28T22:32:06","slug":"how-to-install-jetbrains-webstorm-on-ubuntu-linux-hint","status":"publish","type":"post","link":"https:\/\/www.appservgrid.com\/paw92\/index.php\/2018\/12\/21\/how-to-install-jetbrains-webstorm-on-ubuntu-linux-hint\/","title":{"rendered":"How to Install JetBrains WebStorm on Ubuntu \u2013 Linux Hint"},"content":{"rendered":"<p>WebStorm is an awesome IDE for working with JavaScript web and app development. WebStorm has support for many JavaScript frameworks. It has native support for NodeJS, AngularJS, ReactJS, VueJS and many more. It has intelligent auto completion and very easy to use UI. Overall, it\u2019s a must have tool for JavaScript developers.<\/p>\n<p>In this article, I will show you how to install WebStorm on Ubuntu. Let\u2019s get started.<\/p>\n<p>You can download WebStorm from the official website of JetBrains. First, go to the official website of JetBrains at <a href=\"https:\/\/www.jetbrains.com\">https:\/\/www.jetbrains.com<\/a> from your favorite web browser. Once the page loads, hover over Tools and click on WebStorm as marked in the screenshot.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/1-23.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>Now, click on Download.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/2-21.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>Make sure Linux is selected. Now, click on DOWNLOAD as marked in the screenshot below.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/3-21.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>Your browser should prompt you to save the file. Select Save File and click on OK.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/4-19.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>Your download should start. It should take a while to finish.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/5-20.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<h2>Installing WebStorm:<\/h2>\n<p>Once the WebStorm archive is downloaded, you\u2019re ready to install it.<\/p>\n<p>First, navigate to the ~\/Downloads directory where the WebStorm archive is saved.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/6-19.png\" alt=\"\" width=\"1003\" height=\"112\" \/><\/p>\n<p>As you can see, WebStorm tar.gz archive is here.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/7-20.png\" alt=\"\" width=\"995\" height=\"167\" \/><\/p>\n<p>Now, run the following command to extract the WebStorm archive to \/opt directory.<\/p>\n<p>$ sudo tar xzf WebStorm-2018.3.1.tar.gz -C \/opt<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/8-19.png\" alt=\"\" width=\"1001\" height=\"100\" \/><\/p>\n<p>It should take a while for the archive to be extracted. Once the archive is extracted, a new directory should be created in \/opt directory as you can see in the marked section of the screenshot below.<\/p>\n<p><u>NOTE:<\/u> The directory name in my case is WebStorm-183.4588.66. It may be different for you. Make sure you replace it with yours from now on.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/9-18.png\" alt=\"\" width=\"1004\" height=\"148\" \/><\/p>\n<p>The first time, you have to run WebStorm from the command line. To do that, run the following command:<\/p>\n<p>$ \/opt\/WebStorm-183.4588.66\/bin\/webstorm.sh<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/10-20.png\" alt=\"\" width=\"1016\" height=\"97\" \/><\/p>\n<p>As you\u2019re running WebStorm for the first time, you have to do a little bit of initial configuration. As you don\u2019t have any WebStorm configuration yet, you have nothing to import. So, select Do not import settings and click on OK.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/11-18.png\" alt=\"\" width=\"610\" height=\"207\" \/><\/p>\n<p>Now, select a UI theme of your choice. You can either select the dark theme Darcula or the Light theme. Once you\u2019re done selecting a UI theme, click on Next: Desktop Entry.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/12-19.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>Now, you have to create a desktop entry for WebStorm. This way, you can easily access WebStorm from the Application Menu of Ubuntu.<\/p>\n<p>To do that, make sure both of the checkboxes are checked. Once you\u2019re done, click on Next: Launcher Script.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/13-18.png\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>If you want to open WebStorm projects from the command line, check Create a script for opening files and projects from the command line. Once you\u2019re done, click on Next: Featured plugins.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/14-17.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<p>Now, WebStorm will suggest you some important plugins that you can install if you want. If you like any of the plugins from here, just click on Install to install it. Once you\u2019re done, click on Start using WebStorm.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/15-17.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<p>Now, type in your login password and click on Authenticate.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/16-16.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<p>JetBrains WebStorm is not free. You have to buy a license from JetBrains in order to use it. From here, you can activate WebStorm.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/17-13.png\" alt=\"\" width=\"992\" height=\"456\" \/><\/p>\n<p>If you want to try out WebStorm before you buy a license, then you can try it out for 30 days for free without any feature restriction. Just select Evaluate for free and click on Evaluate.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/18-11.png\" alt=\"\" width=\"898\" height=\"466\" \/><\/p>\n<p>WebStorm is being started.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/19-1.jpg\" alt=\"\" width=\"1140\" height=\"644\" \/><\/p>\n<p>WebStorm has started as you can see.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/20-10.png\" alt=\"\" width=\"1004\" height=\"525\" \/><\/p>\n<p>From now on, you can start WebStorm from the Application Menu of Ubuntu.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/21-10.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<h3>Creating a New Project:<\/h3>\n<p>In this section, I will show you how to create a new project in WebStorm. First, start WebStorm and click on Create New Project.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/22-9.png\" alt=\"\" width=\"848\" height=\"508\" \/><\/p>\n<p>Now, select a project type and a path for your project where all the project files will be saved.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/23-9.png\" alt=\"\" width=\"1360\" height=\"768\" \/><\/p>\n<p>Let\u2019s say, you\u2019re creating a Node.js Express App project. Here you can change the Node.js interpreter version if you have multiple versions of the interpreter installed.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/24-9.png\" alt=\"\" width=\"977\" height=\"512\" \/><\/p>\n<p>As you can see, I also have options to change the Template and CSS.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/25-9.png\" alt=\"\" width=\"908\" height=\"548\" \/><\/p>\n<p>The options should be different depending on the type of project you\u2019re creating. Once you\u2019re done setting up the options, click on Create.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/26-8.png\" alt=\"\" width=\"1002\" height=\"515\" \/><\/p>\n<p>As you can see, the project is created.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/27-8.png\" alt=\"\" width=\"1132\" height=\"633\" \/><\/p>\n<p>The project has some default files. You can click on the Play button on the top right corner to run the project.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/28-7.png\" alt=\"\" width=\"1124\" height=\"642\" \/><\/p>\n<p>As you can see, the express app is running on port 3000.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/29-6.png\" alt=\"\" width=\"1116\" height=\"643\" \/><\/p>\n<p>I can also access the express app from the web browser.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/linuxhint.com\/wp-content\/uploads\/2018\/12\/30-6.png\" alt=\"\" width=\"896\" height=\"388\" \/><\/p>\n<p>So, that\u2019s how you install WebStorm on Ubuntu. Thanks for reading this article.<\/p>\n<p><a href=\"https:\/\/linuxhint.com\/install_jetbrains_webstorm_ubuntu\/\" target=\"_blank\" rel=\"noopener\">Source<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>WebStorm is an awesome IDE for working with JavaScript web and app development. WebStorm has support for many JavaScript frameworks. It has native support for NodeJS, AngularJS, ReactJS, VueJS and many more. It has intelligent auto completion and very easy to use UI. Overall, it\u2019s a must have tool for JavaScript developers. In this article, &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/www.appservgrid.com\/paw92\/index.php\/2018\/12\/21\/how-to-install-jetbrains-webstorm-on-ubuntu-linux-hint\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;How to Install JetBrains WebStorm on Ubuntu \u2013 Linux Hint&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-6045","post","type-post","status-publish","format-standard","hentry","category-linux"],"_links":{"self":[{"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/posts\/6045","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/comments?post=6045"}],"version-history":[{"count":1,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/posts\/6045\/revisions"}],"predecessor-version":[{"id":6674,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/posts\/6045\/revisions\/6674"}],"wp:attachment":[{"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/media?parent=6045"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/categories?post=6045"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.appservgrid.com\/paw92\/index.php\/wp-json\/wp\/v2\/tags?post=6045"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}