Webinar Recording: Using WebStorm for Building Angular Apps
The recording of our February 6th webinar featuring Victor Savkin, Using WebStorm for Building Angular Apps, is now available on the JetBrains YouTube channel!
In this webinar, Victor Savkin, a long time WebStorm user and Angular core contributor, walks you through his IDE setup and shares his tips on using the IDE efficiently when working on Angular apps and on big projects like the Angular framework itself.
You can find out more about Victor and his company at http://nrwl.io. You can also follow him on twitter – @victorsavkin.
Here are some questions from the webinar Q&A session:
Q: Is Angular and TypeScript support available in IntelliJ IDEA Ultimate, PhpStorm, PyCharm Professional and RubyMine?
A: Yes, all WebStorm features are available in these IDEs. Make sure you have AngularJS plugin installed in Preferences | Plugins.
Q: Where can I download WebStorm 2017.1 Early access preview? What new Angular features does it have?
A: You can download WebStorm 2017.1 EAP here and install it side-by-side with the stable version. WebStorm 2017.1 brings integration with Angular language service. You can find more information about it in this blog post.
Q: How can we format the imports to use space inside curly brackets and also use single quotes instead of two?
A: You can configure that in Preferences | Editor | Code style | TypeScript – Spaces – ES6 imports and Other – Quotes style.
Q: How to enable TSLint? Is it possible to see all TSLint errors?
A: You can enable TSLint in Preferences | Languages & Frameworks | TypeScript | TSLint. You will see errors from TSLint in the editor. To lint all files in the project select Run inspection by name in the Code menu and type TSLint. You’ll see the results in a new tool window. Please note that these results won’t be updated automatically as you make changes in the project.
Plugins Victor mentioned (to install a plugin go to Preferences | Plugins – Browse repositories and search for the plugin name):
And a long list of shortcuts that Victor uses (you can also print out the default WebStorm keymap reference):
General (macOS (Windows and Linux), shortcuts for the default keymaps)
Find action – Cmd-Shift-A (Ctrl-Shift-A)
Show Terminal – Alt-F12
Hide all windows – Shift-Cmd-F12 (Shift-Ctrl-F12)
Search everything – Shift-Shift
Show bookmarks – Cmd-F3 (Shift-F11)
Toggle Bookmark with Mnemonic – Alt-F3
Navigation
Recent files – Cmd-E (Ctrl-E)
Recently edited files – Shift-Cmd-E (Shift-Ctrl-E)
Navigate – Declaration – Cmd-Click/Cmd-D (Ctrl – B)
Navigate – File – Shift-Cmd-O (Shift-Ctrl-N)
Navigate – File structure – Cmd-F12 (Ctrl-F12)
Navigate – Select in – Alt-F1
Navigate – Back – Cmd-[ (Ctrl-Alt-Left)
Show Usages – Alt-Cmd-F7 (Ctrl-Alt-F7)
Highlight usages in file – Shift-Cmd-F7
Editing
Insert Live Template – Cmd-J (Ctrl-J)
Tab to jump to edit locations in Live Template
Quick Definition – Alt-Space (Shift-Ctrl-I)
Optimize imports – Ctrl-Alt-O
Refactoring
Extract – Variable – Alt-Cmd-V (Ctrl-Alt-V)
Extract – Method – Alt-Cmd-M (Ctrl-Alt-M)
Inline Method – Alt-Cmd-N (Ctrl-Alt-N)
Your WebStorm Team
Subscribe to WebStorm Blog updates
