{"id":4556,"date":"2017-10-12T12:22:02","date_gmt":"2017-10-12T11:22:02","guid":{"rendered":"https:\/\/www.bronco.co.uk\/our-ideas\/?p=4556"},"modified":"2017-10-12T14:11:17","modified_gmt":"2017-10-12T13:11:17","slug":"sublime-text-3-tips-and-tricks-to-improve-productivity","status":"publish","type":"post","link":"https:\/\/www.bronco.co.uk\/our-ideas\/sublime-text-3-tips-and-tricks-to-improve-productivity\/","title":{"rendered":"Sublime Text 3: Tips and Tricks to Improve Productivity"},"content":{"rendered":"

In the past I have used a variety of different editors, but over the last four or five years, I have stuck with Sublime Text. There are various reasons for this: it’s fast, reliable, extendable and feature rich.
\nI\u2019m hoping over the course of this post, you will learn something new or think of ways to improve productivity whilst using\u00a0it.<\/p>\n

Sublime Shortcuts<\/h2>\n

The following shortcuts will help eliminate the use of the mouse and get to where you want faster.\u00a0 I wasn\u2019t convinced to begin with, but now I\u2019m sold and I love it.<\/p>\n

Opening Files Quickly<\/h4>\n

This shortcut is extremely useful and quick way opening files, especially on big projects with lots of nested directories.<\/p>\n

    \n
  1. Firstly, Press Ctrl + p<\/li>\n
  2. Now type in the filename or file path and filename<\/li>\n
  3. A list of files will appear, use the up\/down arrow keys and then press enter to open it<\/li>\n<\/ol>\n

    Find\/Jump to a Function<\/h4>\n
      \n
    1. Press Ctrl + p, then @<\/li>\n
    2. A list of functions will appear, start typing the function name or use the up\/down arrows to highlight the correct function and click enter to jump to it.<\/li>\n<\/ol>\n

      Search Within the File<\/h4>\n
        \n
      1. Press Ctrl + p, then #<\/li>\n
      2. A list of words will appear, type the word you want to find and they will highlight<\/li>\n<\/ol>\n

        Go To A Line Number<\/h4>\n
          \n
        1. Press Ctrl + p, then :<\/li>\n
        2. Then type in the line number. Press enter.<\/li>\n<\/ol>\n

          The above three methods as described will just affect the current page you are on, you can enter the filename before the operator to perform the action on other files. This can be extremely useful if you have an error on a page.<\/p>\n

          \"finding-error-line-number\"<\/p>\n

          Other Shortcuts<\/h4>\n

          Here are some other shortcuts that I use regularly:<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n
          Shortcut<\/td>\nFunction<\/td>\n<\/tr>\n
          Crtl + r<\/td>\nFind\/Jump to a function on the current file<\/td>\n<\/tr>\n
          Crtl + h<\/td>\nOpens the search\/replace box<\/td>\n<\/tr>\n
          Ctrl + o<\/td>\nOpen a file with the file explorer<\/td>\n<\/tr>\n
          Ctrl + g<\/td>\nGoto a line number on \u00a0the current file<\/td>\n<\/tr>\n
          Ctrl + l<\/td>\nSelects the current line<\/td>\n<\/tr>\n
          Ctrl + n<\/td>\nOpens a new file<\/td>\n<\/tr>\n
          Ctrl + \/<\/td>\nComments out the current line when the cursor is at any point on the line<\/td>\n<\/tr>\n
          Ctrl + -\/+<\/td>\nDecreases and increases text size on the current file<\/td>\n<\/tr>\n
          Ctrl + [ \/ ]<\/td>\nIncrease and decreases the current lines indentation when the cursor is at any point on the line<\/td>\n<\/tr>\n
          Crtl + Shift + k<\/td>\nDelete current line<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

          Refactoring<\/h4>\n

          I always try to refactor code to keep improving it, and sometimes that includes renaming variables so they make more sense.\u00a0 One way to do it would be find and replace, another way is highlight a variable, then press Ctrl + d, this will then highlight the next occurrence of that variable, keep pressing Ctrl + d until all the variables are selected and change as required:<\/p>\n

          \"Refactoring\"<\/p>\n

          Multiple Cursors<\/h4>\n

          Another feature of sublime is multiple cursors. They are extremely useful when performing repetitive actions. For example making a quick array.<\/p>\n

          To do this select all the lines<\/p>\n

          Press Ctrl + Shift + l<\/p>\n

          \"Making<\/p>\n

          So once you have your line of code, highlight it all and then press the [ key, and that will put square brackets around it.<\/p>\n

          You can also create multiple cursors by holding the ctrl key down and clicking where you want the additional cursors.<\/p>\n

          Code Folding<\/h4>\n

          I don\u2019t use this too much, but when looking at new code, I use the code folding to make it easier to look at all the methods, especially if there is a lot of code.\u00a0 Then you can unfold individual methods that you are interested in.<\/p>\n

          Full List of Shortcuts<\/h4>\n

          Above are\u00a0 just a few of the shortcuts, there are a lot more out there.\u00a0 To see them all go to “Preferences > Key Bindings”.\u00a0 As I mentioned above, a reason I like Sublime is because you can customise the editor, so on the Key Bindings section you can overwrite the bindings by pasting the relevant overwrite on the right hand pane.<\/p>\n

          Settings<\/h2>\n

          Just like Key Bindings you can customise the settings, so go to “Preferences > Settings”.\u00a0 On the left hand pane you can see all the default settings.\u00a0 It’s worth having a look and seeing which to customise.\u00a0 Below are a few I do:<\/p>\n

          Line Length<\/h4>\n

          My first framework was Zend framework<\/a> which had its own style guide, and is also covered in PSR-2 standard<\/a>. I try to keep the line length to respectable length. To make this easier you can set rulers. To do this add<\/p>\n

          \"rulers\":\r\n[\r\n    80,\r\n    120\r\n]\r\n<\/pre>\n
          Others<\/h4>\n
          \"show_encoding\": true,\r\n\"show_line_endings\": true,\r\n\"tab_size\": 4,\r\n\"translate_tabs_to_spaces\": true,\r\n\"trim_trailing_white_space_on_save\": true,\r\n\"word_wrap\": \"true\"\r\n\r\n<\/pre>\n
          I’ve seen people customise the theme, the fonts, sizes etc, but to be honest I’m happy with what comes as default, especially the new theme recently added.<\/p>\n
          Packages<\/h2>\n
          One of the biggest features of sublime is its packages. I always install plugins using the “Package Control” plugin.<\/p>\n
          To install this visit the following site and follow the instructions<\/a><\/p>\n
          Then to install the package:<\/p>\n
            \n
          1. Press Ctrl + Shift+ p<\/li>\n
          2. Type install<\/li>\n
          3. Then click on<\/li>\n
          4. Package Control: Install Package<\/li>\n
          5. A list of packages will appear, again use the autocomplete to search for the plugin, click the correct one from the dropdown and it will install automatically.<\/li>\n<\/ol>\n
            Some of the packages I use are:<\/p>\n
            Trailing Spaces<\/h4>\n
            Another one from PSR-2 standards “There MUST NOT be trailing whitespace at the end of non-blank lines.” This package<\/a> is really good for seeing and removing trailing spaces.<\/p>\n
            DocBlocks<\/h4>\n
            For php doc blocks i use DocBlockr<\/a>. There is an option section in the documentation where you can customise the package even more.<\/p>\n
            Sidebar Enhancements<\/h4>\n
            I\u2019ve seen some people remove the sidebar and just use shortcuts, but I still find it useful.\u00a0 The context menu on the side bar out of the box on sublime is not the best, but this package<\/a> enhances it a lot.<\/p>\n
            Snippets<\/h2>\n
            One massive time saving part of sublime is snippets. \u00a0I’ve got various set up. \u00a0Lets walk through a quick example.<\/p>\n
            So let’s just create a really simple multiplier method for php.<\/p>\n
            private function multiplier(int $multiplier, float $value): float {\r\n\treturn $multiplier * $value;\r\n}\r\n<\/pre>\n
            to manually type this out would take some time, sublime already had some autocomplete features installed but you can do more to automate this. Create a new snippet:
            \nTools > Developer > New Snippet<\/p>\n
            and paste the following code in:<\/p>\n
            <snippet>\r\n    <content><![CDATA[\r\n${1:private} function $2($3): ${4:string} {\r\n    $5\r\n}\r\n]]><\/content>\r\n    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->\r\n    <tabTrigger>cm<\/tabTrigger>\r\n    <!-- Optional: Set a scope to limit where the snippet will trigger -->\r\n    <scope>source.php<\/scope>\r\n<\/snippet>\r\n<\/pre>\n
            Then save this is in the following location (this is part of the path as it can differ from machine to machine) \\Sublime Text 3\\Packages\\User
            \nUsing the extension .sublime-snippet, so i’ve just called mine method.sublime-snippet.<\/p>\n
            So now in your project type cm and then press tab and you will get the following:<\/p>\n
            private function (): string {\r\n    \r\n}\r\n<\/pre>\n
            private should be highlighted, so you can change to public if required, then just keep tabbing to the next section, adding or changing as required.<\/span><\/p>\n
            \"snippet-method\"<\/p>\n
            Above is a coding php example but it can be used for any other language, especially front end development.\u00a0 If you use a particular templating framework then what about using a snippet for form fields or columns? Anything basically that you type\/copy regularly.<\/p>\n
            Other Features<\/h2>\n
            Split Screen<\/h4>\n
            You can split sublime screen into a grid view, columns or rows by looking at \u201cView > Layout\u201d however I don\u2019t tend to use this feature, although could be very useful when templating.<\/p>\n
            Vintage Mode<\/h4>\n
            If you like Vi then switch this mode on (more information here<\/a>)<\/p>\n
            Conclusion<\/h4>\n
            <\/i>This is a quick overview of how I have my editor setup.\u00a0 I\u2019m sure I\u2019m probably just using a fraction of what Sublime is capable of though.\u00a0 If you have an time saving methods or packages then why don\u2019t you comment below?<\/p>\n","protected":false},"excerpt":{"rendered":"
            In the past I have used a variety of different editors, but over the last four or five years, I have stuck with Sublime Text. There are various reasons for this: it’s fast, reliable, extendable and feature rich. I\u2019m hoping over the course of this post, you will learn something new or think of ways […]<\/p>\n","protected":false},"author":24,"featured_media":4591,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2],"class_list":["post-4556","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-and-ux"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/posts\/4556","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/comments?post=4556"}],"version-history":[{"count":0,"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/posts\/4556\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/media\/4591"}],"wp:attachment":[{"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/media?parent=4556"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bronco.co.uk\/our-ideas\/wp-json\/wp\/v2\/categories?post=4556"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}