homeranking.info Fitness SUBLIME PRODUCTIVITY PDF

Sublime productivity pdf

Sunday, February 10, 2019 admin Comments(0)

Sublime Text is a versatile text editor and a gold standard for many programmers. Our tips focus on efficient coding, but general users will. A collection of some of the best Sublime Text packages, themes, and goodies. $36 e-book (EPUB and PDF) by Wes Bos; Sublime Productivity - $22 e-book by. Code Like a Pro with Today's Premier Text Editor You fell in love with Sublime, and it changed the way you code.


Author: ANGELES ANTONIOU
Language: English, Spanish, French
Country: Bahrain
Genre: Politics & Laws
Pages: 215
Published (Last): 29.10.2015
ISBN: 742-7-41896-239-6
ePub File Size: 27.31 MB
PDF File Size: 8.20 MB
Distribution: Free* [*Regsitration Required]
Downloads: 31893
Uploaded by: JANIS

You fell in love with Sublime, and it changed the way you code. But the newness is wearing off, and you're wondering: "What else am I missing. Sublime Productivity. Code Like a Pro with Today's Premier Text Editor. Josh Earl . This book is for sale at homeranking.info Download as PDF, TXT or read online from Scribd. Flag for inappropriate . This book is for sale at homeranking.info This version was.

Environment variables should open, look for the Path variable in System variables, double-click it to open the Edit System Variable window, and add your Sublime installation path to the end of the Variable value field prefixed with a semicolon, as shown in the following screenshot: Click Selection Expand Selection to Tag. Select several non-sequential lines. Duplicate Line inserts a copy of the current line directly below the current line. Download one of the icons from Dribbble. I position the cursor in the word shows.

As a web developer, we would frequently do code editing. Below are some handy keyboard shortcuts that allow you do different types of selections in SublimeText. Furthermore, Sublime Text brings lets us select multiple lines at once, which can significantly boost your productivity. There are several ways to perform this feature:. Select a code, line, or word first the hit this combo to select the others with the same instances.

Hit this key to quickly select the next code, line, or word that has the same instances as you are currently selecting. Commonly, we do not mind how CSS properties are sorted, as CSS will give us the desired output in the browser regardless of their position.

But putting them in a particular order will make your codes more organized. You can also use a third-party plugin like CSSComb to give you more control over the property sorting rule. You can do many things quickly with Command Palette such as rename new file, set file syntax, and inserting snippets. Here are some examples. We may have many files opened when working on a project. In SublimeText, we can switch through these files or tabs quickly with the following shortcuts:.

This feature would also be very useful when we are working with multiple files. For example, say that we have several code blocks that are very similar and spread across different files in the project. To change these codes efficiently, you can:.

Put the words, sentence, or line of codes that you want to change in the Find field. Pro Tip: Put the word or code replacement in the Replace input field, and hit the Replace button.

A dialog will appear with a list of CSS selectors on the document, as you can see in the screenshot below. You can search and select the selectors that you intend to navigate to. I found this a more convenient way to search for code block than using the regular Find feature. I frequently write in code editor, and I also frequently made some mistake in the spelling. Summary By the end of this chapter we should have Sublime Text with Package Control installed on our system, and all the necessary shortcuts for Sublime commands in the CLI.

We have also learned how to navigate the user interface and had a sneak peak of some of the cool features of Sublime. In the next chapter, we are going to touch some code and learn more advanced techniques for navigating and code editing in Sublime.

We will also install two important plugins for most languages and master Sublime's Shortcuts Map. In this chapter we will cover the following topics: Sublime Text has two main search features: To take full advantage of the Search and Replace features of Sublime, you should at least know the basics of Regular Expressions, also known as regex or regexp.

Regular Expressions can be really annoying, painful, and joyful at the same time! We won't cover Regular Expressions in this book because it's an endless topic. The search panel options can be controlled using keyboard shortcuts: We can see that lines 2 and 8 still say messages and not message; that's exactly what we expected! The incremental search Incremental search is another cool feature that is here to save us keyboard clicks. The only difference between the incremental search and a regular search is the behavior of the Enter key; in incremental searches, the Enter key will select the next match and dismiss the search panel.

This saves us from pressing Esc to dismiss the regular search panel. The same shortcuts from the single file search also apply here; the difference is that we have the Where field and a … button near it. The Where field determines where the files can be searched for; we can define the scope of the search in several ways: Results will be opened in a new tab called Find Results, containing all found results separated by file paths.

Double clicking on a result will take you to the exact location of the result in the original file. So how can we select multiple lines? We select one line like we usually do and select the second line while holding Ctrl or command on OS X. This feature is really useful and it is recommended that you play with it. The following are some shortcuts that can help us feel more comfortable with multiple selections: We can select multiple lines by pressing Shift and dragging the right mouse button on Windows and Linux, or Linux and pressing Option and dragging the left mouse button on OS X.

Here we want to remove the letter s from messages, as shown in the following screenshot: We have selected all s using Column selection; now we just need to hit backspace to delete them.

Navigating through everything Sublime is known for its ability to quickly move between and around files and lines. In this section, we are going to master how to navigate our code quickly and easily.

Go To Anything We already learned how to use the Go To Anything feature, but it can do more than just searching for filenames. We can conduct a fuzzy search inside a "fuzzily found" file. Yeah, we can. For example, we can type the following inside the Go To Anything window: It is very common to use fuzzy search inside HTML files because it immediately shows all the elements and classes that match, accelerating navigation.

Projects A project is a group of files and folders. To save a project we just need to add folders and files to the sidebar, and then from the menu, we navigate to Project Save Project As… The saved file is our projects data, and it is stored in a JSON formatted file with a. The following is a sample project file: Folders Each folder must have a valid folder path that can be absolute or relative to the project directory, which is where the project file is.

A folder can also include the following keys: This will include symlinks if set to true Settings The project-specific settings array will contain all the settings that we want to apply only to this project. These settings will override our global user settings. For more information about build systems, please visit http: Its main features are: We will then need to restart Sublime.

When it first starts, SublimeCodeIntel needs to build an index of the languages you're using.

Popular Topics

Be patient though, it will be well worth it when it's ready. SublimeCodeIntel shortcuts map: By default, this file will be an empty JSON-formatted file.

Here is an example for optional configuration: SublimeLinter is a plugin that supports linting and has the following linters built in: This lints via Perl:: This lints via xmllint Installing SublimeLinter We can install this plugin by using the Package Control that we installed earlier. Using SublimeLinter SublimeLinter can run in four different modes; the current mode is set by the sublimelinter key in the user settings: When the sublimelinter key is set to true, linting is performed constantly in the background while we modify the file.

When the sublimelinter key is set to load-save, linting will be performed when a file is loaded and after the file is saved. When the sublimelinter key is set to save-only, linting is performed only after a file is saved. When the sublimelinter key is set to false, linting will only be initiated by us.

We can also control all SublimeLinter settings and initiate an instant lint from the command palette. The must-know shortcuts map The following is a must-know shortcuts map for Sublime Text: General General shortcuts for Sublime's basic features are as follows: Here are the shortcuts for using Bookmarks: It is important to know that SublimeLinter and SublimeCodeIntel do not support all kinds of projects and languages.

They are also not the right choice for you if you are developing in a specific language; there may be a plugin that fits your requirement better. In the next chapter we are going to learn what Snippets, Macros, and Key Bindings are, and even make our own snippet! The best example of this is the following code: That's why Sublime has the snippets feature.

Snippets are smart templates that insert the right text when we need it, where we need it. Let's see this example live by using Lorem ipsum. We have this empty HTML page that we wrote using our awesome, fast fingers.

We just type the trigger letter for our snippet, in this case l, and we get all the options. Pressing Tab will insert the snippet as shown in the following screenshot: We now have a Lorem ipsum. Because we do not have other snippets starting with lore, Sublime will know exactly what we meant.

We'll make an awesome HTML snippet, better than the one in the preceding example. First, let's have a look at how snippets work in more detail. How do snippets work? Snippets must live in a Sublime package. File format and syntax Snippets are simple XML-formatted files with the extension sublime-snippet. This tag represents the actual snippet. Snippets won't work if we won't do it.

12 Most-Wanted Sublime Text Tips and Tricks - Hongkiat

The XML parser will replace any undefined variables with empty strings. This tag contains a sequence of characters that will trigger the snippet when written. After writing these characters, pressing Tab will insert the snippet immediately. This is the scope in which the snippet will be active. A short and intuitive description for the snippet, which will be shown when the snippet's menu is open.

Knowing about snippets' features Snippets have some extra features that can be really helpful such as inserting copyrights on code, inserting default file structures, or just helping us type functions faster. We will cover all that you need to know about snippets so that you can take full advantage of them. Environment variables We learned about Sublime's environment variables in a previous chapter. Snippets can also access these variables, which can be very convenient as shown in the following example: Field markers Field Markers will let us cycle between our snippet's field markers by pressing Tab.

We'll use fields for customizing a snippet after it's been inserted. Mirrored field markers Identical field markers mirror what we write on one of them. When we edit the first mirrored field marker, the rest will change in real time to the same values.

Placeholders We can even put some default values, which are called placeholders. Let's see a full example of field markers' usage: We can put any value though. Let's go to Tools New Snippet… and Sublime will open a new snippet template for us, as shown in the following screenshot: Let's have a look at the following code: Writing doctype in a. Pressing Tab again will make the cursor jump to fill in the title, which is filled with a default value of Untitled.

We can now open any. Just like installing any other plugin, we can go to Install Package and look for snippets' packages. Here are some packages I recommend you use for web development: Recording, editing, and using macros Macros can be very helpful; they are saved with the. Before creating a new macro, we should understand what the use case is. If we find ourselves doing the same actions over and over again, we should use a macro for it.

For example, when writing C code, we always go to the end of the line to insert a semicolon and press Enter. How can we do this faster? We will notice that the status bar says Starting to record macro…, as shown in the following screenshot: Sublime will always play the last recorded macro.

Saving and editing We can also save the recorded macro and edit it manually. When opened open it for editing, we should see the following: For the full list of commands, visit http: Binding a saved macro We recorded, saved, and edited our macro.

Now, we want to make it accessible for later use, and one way of doing this is by binding the macro to a shortcut key. We will do this by defining a new key binding to our macro. Our file should look like the following screenshot: Once you save this file, you can run the macro using the specified shortcut. All commands used by shortcuts are the same commands that are used by the macros. Summary We are stocked with snippets, both our own and from the community.

We have recorded a macro, saved it, and bound it to a shortcut key. In the next chapter we are going to learn about overriding existing key bindings and how to avoid collisions. We will also learn how to customize Sublime's base settings, Colors, and Themes. We'll even create our own theme. And for dessert, we will play with Splitting Windows in Sublime. We will also customize our own color theme. And as a bonus, we will check out the Split Windows feature.

Sublime also gives us the option to bind keys to any command by adding custom key bindings; but what are key bindings exactly? In one sentence: Customization and Theme Development Platform-specific key bindings Key bindings can be different per platform; their filename has to be one of the following: Key map file structure A key map is an array of key bindings.

Each key binding contains the following elements: This contains an array of case-sensitive keys that needs to be pressed to trigger the key binding.

Pdf sublime productivity

This contains the command to be executed. This contains a dictionary of parameters to be passed to the command element. This contains an array of contexts that will enable the key binding. All contexts must be true for the key binding to be enabled. Here's an example from the Windows default key map: For a list of all available commands, visit either http: Here is the full list of all the keyboard keys that can be used with key bindings: Advanced key bindings Simple key bindings include only BoundKeys and a command.

However, we can also make more advanced key bindings by passing arguments to the command using the args key; for example: More advanced key bindings can be achieved using contexts. A context determines if the command will be executed based on the caret's position or some other state. For example: For a list of all available contexts, visit either http: Keeping our key bindings organized A big problem is that Sublime keeps track of all the key bindings we have.

So first, let's understand how Sublime knows when a key binding needs to override another key binding. Each keymap file that is being loaded will override any other key bindings that have been loaded before it in case of a key conflict. Don't be afraid to read the preceding information twice. It's important to know how Sublime handles key bindings. Lucky for us, we have an awesome plugin that can help us manage our key bindings and detect collisions and conflict.

Sublime Forum

It is called BoundKey, and can be installed using our favorite Package Control! Then, we'll choose Install Package and install the BoundKeys plugin. The FindKeyConflicts plugin is also recommended, and can be found at https: Understanding Sublime's base settings As we saw, Sublime Text can be fully customized to fit our needs.

Productivity pdf sublime

It stores its settings in JSON-formatted. Sublime will load these settings files in the same order that it loads the keymap files. The types of settings' files Each settings file has a prefix that defines its purpose. These prefixes are names that can be descriptive, such as Preferences Windows. This means that the file applies only to Windows.

We can also specify the file type in the descriptive name, for example, Ruby. This means that the file applies only when editing Ruby code files. Feel free to change the settings with whatever fits your style. Adding packages Let's start with adding some basic packages; download and install the following: This package adds useful file operations to the sidebar, such as a new file or new folder.

We all hate trailing whitespaces in our code! This package strips trailing whitespaces from our files. We can install these packages using Package Control. Tabs and spaces Now, let's open Sublime's settings. We can choose which file we want to edit. If we want to edit Sublime's global settings, we will open it by navigating to Preferences Settings Default, and if we want to edit specific user settings, we will open it by navigating to Preferences Settings-User.

For a full list of the settings, visit http: We can change Sublime's visual experience by changing its base settings, color schemes, and themes. Visual settings Let's start by tweaking Sublime's settings to change visual elements; for example, we can highlight the current line, change the caret style, show fold buttons, boldface folder names, and highlight modified tabs.

We are going to do this by opening our user preferences and adding some visual settings to it. The following numbered bullets refer to the labels on the next screenshot: This is cool but not enough for us; we want Sublime to be more awesome! Sublime themes modify Sublime's look and feel by changing icons and IDE colors.

Let's try downloading and installing the most popular theme, the soda theme, online. It's easy to install using Package Control.

Choose Install Package and install the Theme - Soda package. After installing the theme, we need to activate it. Let's open the user settings again by navigating to Preferences Settings User and add either "theme": The folder icons, tabs styles, and search icons have been changed! Everything looks sleek. But now, we wish to change the colors. Color schemes Color schemes are XML-formatted files with a.

Color schemes are an awesome way to fully customize Sublime's colors, while themes alter the UI Elements only. They will show up in Sublime's menu automatically. The best way to create our custom color scheme is using this great online tool available at http: A recommended color scheme is the neon color scheme that aims to make as many languages as possible look as good a possible with bright colors on black colors. It can be installed through Package Control or can be found at https: Mastering Split Windows Sublime Text includes one of the most useful productivity features that is out there—Split Windows!

We all know this from vi and Visual Studio, but how can we split our Sublime? We simply need to memorize some shortcut keys. We got a new empty column.

Productivity pdf sublime

Now, we need to move a file there. This feature is very useful when working with source and header files, or even when comparing two files.

We have learned how to bind keys to custom actions and how to split Sublime into rows and columns. The next chapter is for the vi fans among us; we will introduce Sublime's Vintage feature and learn how we can make Sublime more like vi. It allows us to use vi's commands while also having the advantage of Sublime's features, such as multiple selections that we learned before.

Vintage Mode is an open source project and can be found at http: Discovering vi vi is a an old but still very popular text editor. The original vi was written in as an open source project.

Surprisingly, it's still being used today because of its speed, small size, and portability. It is a popular command line editor for example, in server environments because it does not require a mouse. Many different vi ports have been developed since its original release. One of the most popular of them is vim vi improved , which supports customization like Sublime does, with macros, plugins, and key mappings. Unravelling Vintage Mode The following is a screenshot of a spilt-windowed vi screen, which is not as great as our customized Sublime: To enable the Vintage Mode, we'll need to remove it from the ignore packages list.

To do this, let's open the user settings by going to Preferences Settings—User. The following code is present in the user settings: Insert Mode is the mode where we can type freely. If you have used vi before, you can skip this section. Vintage editing modes Vintage has four supported modes that can be switched between: The only exceptions are: For example, if we wish to copy three lines, we will use the Yank command which is bound to the y key and press 3 for repeating the Yank command three times.

This will copy 3 lines forward from the current cursor position. To paste what we just copied, we'll press the p key. Mastering Vintage takes time and effort, but it's worth it! Here are the vi commands that are supported by Vintage Mode. These commands are the most important commands to remember, and they will boost our productivity while using Vintage Mode.

These commands will not work in Insert Mode. Command description Bound key Move left h Move down j Move up k Move right l Move to the end of the file G Move to the beginning of the file gg Move forward a paragraph.

Editing commands We can append most of the editing commands with a movement command, just like we appended Yank with 3, where 3 means three lines; we could also appended it with G for end of file. Vintageous can be downloaded using Package Control, but we must first disable the default Sublime's Vintage Mode so Vintageous can take over. For full information, visit the following link: It is important to know that vi functionality is huge and never-ending; hence, it can't be covered in one chapter and needs a whole book for it.

We covered the basics. I recommend having the vi graphical cheat sheet that can be found at http: Keeping a copy under your keyboard can be really helpful.

The next chapter will guide us on how to use Sublime for testing with several languages such as PHP and Ruby. The following topics will be covered in this chapter: This makes the programmer detect issues and bugs as soon as possible and fix them before something goes wrong.

Also, the sooner we fix a bug the less time and cost it takes from us. Sublime Text doesn't have any built-in features to help us test our code while developing in different languages, but the community has made plugins that work with standard testing packages for the most commonly used languages.

We can use those plugins to ease our code-testing. We will cover the following plugins: It combines a framework that lets us easily write and run tests with the facility to analyze the results. We can learn more about PHPUnit at https: After installing it, we can right-click on our code to see the new the PHPUnit option that has been added to our context menu, as shown in the following screenshot: To use the PHPUnit plugin in our project, we'll need a phpunit. These files contain all the PHPUnit configuration options.

PHPUnit will always favor phpunit. After your project is properly configured, right-clicking inside a source file should show the following: This option will run the unit tests just for this class. This option opens our tests in Sublime Text; if tests are already open in Sublime this will switch between test's tabs. This option runs all the unit tests for our code. This option just points to our phpunit. In the preceding screenshot, we can see all available commands that the PHPUnit plugin has to offer.

This will create a new test method for us to fill out These snippets can be used like any regular snippet, by typing their names and pressing the Tab key. Testing in Python development Python offers us unittest, an official unit testing framework for Python, sometimes referred as PyUnit.

For more information on how to use unittest, visit: To install the package, we'll use Package Control. Then choose Install Package and install the Unittest python package. The installed package has two main snippets: This will create a new test class for us to fill out class [Foo]TestCase unittest.

We'll call our TestSequenceFunctions class. When inserting a snippet, we will get the preceding autocomplete window. Pressing Tab will insert the snippet. After that, it will start to run all the test functions and assert if something goes wrong. Afterwards, we check if our sorted sequence is equal to range 30 , which returns a sorted sequence from 0 to If something went wrong and the sequence doesn't equal the range of 0 to 30, then this test will fail with a message of Elements missing.

We can run this code as we run every Python code: Testing in Ruby development Ruby also has its built-in unit testing library called Test:: There are two popular BBD frameworks: RSpec and Cucumber. Quote from the RSpec. Born under the banner of Behavior-Driven Development, it is designed to make Test-Driven Development a productive and enjoyable experience. Unit, RSpec, and Cucumber. It's called RubyTest and can be found on https: Choose Install Package and then install the RubyTest package.

The RubyTest package doesn't include any snippets but has some useful commands instead. Here is a list of all the commands and their shortcuts: We can see that we received 2 assertions, 1 failure, and 0 errors.

If this feature is enabled, RubyTest will automatically scan for the Gemfile and will add a prefix of bundle exec to any command it runs. To enable this feature, we'll need to add a line to the RubyTest settings. Sublime has some plugins that integrate some debugging features in them. It includes stack traces, real-time parameters' display, filenames, and line indicators. Sublime has a great plugin to help us debug our PHP code while using Xdebug.

Having Xdebug installed is mandatory for this section; for more information, please visit: We will install the Xdebug Client. Then choose Install Package and install the Xdebug Client package. After installing, we'll need to change the xdebug. We should restart the server after this.

The following screenshot is that of a debugging session: This window shows all breakpoints that have been set The following are all the commands that we will need to have for a good debugging session: If you are facing any trouble, try visiting the Troubleshoot page at: Debugging JavaScript with Web Inspector There are tons of web developers among us, and we all find our own ways of debugging our JavaScript code.

Sublime has a wonderful plugin to make it easy for us. It lets us set breakpoints, examine the console, evaluate selections, debug step-by-step, and more! This plugin requires Google Chrome to be installed.

Let's start by opening our packages directory from the Sublime Text menu by navigating to Preferences Browse Packages…. This will open up the packages directory. After we are in the packages directory, we need to clone the right branch by executing the following: If we get an error message saying The system cannot find the file specified, we'll need to change the path for our chrome installation.

We'll do it by going to the cloned directory and edit swi. Chrome won't open in the debug mode if another Chrome window is already open.