The best text editor i have used till today is sublime text. I use sublime text for all my web development projects. The main reason is , it is light weight and lots and lots of plugins available for supporting variety of languages, coloring, syntax highlighting , etc, etc,.In this tutorial i will explain a few tips and tricks for sublime text 3 which will be helpful while using sublime text.
Also read : complete iOS and Swift course 75% discount
Sublime Text Editor Tips and tricks
In sublime text, by default , you wont get much options in the sidebar. To have more option like duplicating , creating anew folder etc, you can use sidebar enhancement plugin. To install the plugin , follow the steps given below.
1. Open package control using shortcut ctrl + shift + p or from the menu bar under preferences.
2. Search for “package install” option and select it. It will open a window for searching and installing packages.
3. Search “sidebar enhancement” and install it. Once installed you will have more options than you had by default.
Net we will see some useful shortcuts which you will be be using often.
Most Useful Sublime Text Shortcuts
1. ctrl + k + b for hiding and showing the sidebar.
2. F11 for using sublime in full screen mode
3. ctrl + / for commenting a selected block of code
4. ctrl+k+u for changing selected text to uppercase
5. ctrl+k+l for changing selected text to lowercase
6. shift + F11 for distraction free code editing
7. ctrl + shift + p for package control
8. ctrl + p to search for file in the current project window
9. ctrl + m for finding the matching bracket
10. ctrl + shift + ↑ for swapping a line upwards
11. ctrl + shift + ↓ for swapping a line downwards.
12. ctrl + shift + d for duplicating a line
13 ctrl + j for joining a line
14. ctrl + enter for creating a new line
15. ctrl + f for finding occurrence of string in the current file
16. ctrl + h for finding and replacing string in the current file
17 ctrl + w for closing the current tab
Next thing is to save your time in typing. There is an awesome plugin called emmet to do that work for you. Install emmet plugin as you installed sidebar enhancement plugin using the three steps mentioned before.
Using emmet you can create html code snippets very easily from short codes. Type the following short code and press tab.
.row>.small-12.columns
After pressing tab emmet will create two div’s automatically with claseed row small-12 and columns as shown below.
<div class="row"> <div class="small-12 columns"></div> </div>
Lets say you want to create an ul with 10 li’s with 5 lorem texts. The following emmet format will automatically create it for you.
ul>li*10>lorem5
After typing the above short code and if you press tab , you will see the following HTML element created with lorem dummy data.
<ul> <li>Lorem ipsum dolor sit amet.</li> <li>Recusandae asperiores voluptatibus dolore sapiente!</li> <li>Possimus saepe delectus perferendis impedit.</li> <li>Ex, architecto possimus quam porro.</li> <li>A dolore incidunt accusantium adipisci.</li> <li>Animi alias numquam beatae quis!</li> <li>Delectus numquam, inventore nesciunt ducimus.</li> <li>Veniam aliquid reprehenderit, ullam molestiae.</li> <li>Quaerat consequuntur animi nulla, praesentium.</li> <li>Alias aliquam earum, praesentium dolores.</li> </ul>
We have seen the basic shortcuts and code formatting tips and tricks for sublime text. we will see some advanced options in the next post.