Yelp Facebook YouTube Twitter Instagram

Noble Blog

Articles on: Coding Tips

Paste From Recent History in Sublime Text

Sublime Text remembers the last 15 items you’ve copied and you can paste any one of them!

Hit Cmd–Option–V (Mac) or Ctrl–K then Ctrl–V in quick succession (Windows) to access the list of copied items. Use the arrow keys to select an item and hit Return/Enter to paste.

Paste From Recent History in Sublime Text

Coding Tips

Join Lines in Sublime Text

Sublime Text allows you to quickly join lines together. Select the lines and hit Cmd–J (Mac) or Ctrl–J (Windows).

If nothing is selected, Sublime Text will join the line below to the current line.

Join Lines in Sublime Text

Coding Tips

Sort Lines in Sublime Text

Sublime Text allows you to quickly sort lines alphabetically. Select the lines you want to sort and choose Edit > Sort Lines. You can also use the keystroke F5 (Mac) or F9 (Windows).

Sort Lines in Sublime Text

Coding Tips

Multiple Text Cursors with Arrow Keys in Sublime Text

While you can place multiple text cursors in Sublime Text with Cmd–Click (Mac) or Ctrl–Click (Windows), here's another technique that comes in handy.

Hold Ctrl–Shift (Mac) or Ctrl–Alt (Windows) and hit Up or Down Arrow to place an additional text cursor above or below the current cursor.

Multiple cursors coding tip

Coding Tips

Change Text Case in Sublime Text

Sublime text allows you to quickly convert selected text to upper case or lower case.

- To convert to upper case: In quick succession, hit Cmd–K then Cmd–U (Mac) or Ctrl–K then Ctrl–U (Windows). 
- To convert to lower case: In quick succession, hit Cmd–K then Cmd–L (Mac) or Ctrl–K then Ctrl–L (Windows).

You can also convert to title case by choosing Edit > Convert Case > Title Case (there’s no keyboard shortcut).

Convert case coding tip

Coding Tips

Increase & Decrease Numbers in Sublime Text

Sublime Text with Emmet allows you to quickly adjust numbers in your code.

For example, you want to change 20px to 22px. Instead of selecting and typing the new number, click on the number and hit Ctrl–Up Arrow (Mac and Windows) to increase it 1px at a time. Increments of 0.1 and 10 also work:

Increase/Decrease by 0.1: Hold Option (Mac) or Alt (Windows) and hit Up or Down Arrow 
Increase/Decrease by 1: Hold Ctrl (Mac or Windows) and hit Up or Down Arrow 
Increase/Decrease by 10: Hold Cmd–Option (Mac) or Shift–Alt (Windows) and hit Up or Down Arrow

Coding Tips

Place Multiple Text Cursors in Sublime Text

Some text editors only allow one text cursor, but Sublime Text allows multiple. This is really useful, for example, if you want to insert the same word in multiple places.

Click anywhere in the code to place the text cursor. Cmd–Click (Mac) or Ctrl–Click(Windows) to place an additional text cursor. You can place as many cursors as you want!

Coding Tips

Quickly Select Everything Inside a Tag

With Sublime Text you can quickly select everything inside an HTML tag. Just click anywhere inside the tag and hit Cmd–Shift–A (Mac) or Ctrl–Shift–A (Windows).

Coding Tips

Quickly Delete a Word in Any Text Editor

Hit Option–Delete (Mac) or Ctrl–Backspace (Windows) to delete the word to the left of the cursor. This is an operating system feature so it should work in any text editor. 

This same technique can be also be used in the opposite direction. Hit Option–Fn–Delete (Mac) or Ctrl–Delete (Windows) to delete the word to the right of the text cursor.

Coding Tips

Video Tutorial: Modern Web & Mobile Design Techniques

There are newer design apps like Sketch or Adobe XD, and existing design apps like Photoshop have changed dramatically in ways that many designers have not kept up with. Whether you’re new to web design, transitioning from print to web design, or have been designing websites but want to update your skills, join us for this informative live stream event.

View the Presentation Slides

LEARN MORE:
Photoshop for Web Design & UI Class
Sketch in a Day Class
Adobe Experience Design (XD) in a Day Class

 

Coding Tips