Today I want to share with you some tips about coding performance and workflow that might improve your efficiency. Sometimes it’s not that easy to meet deadlines but you should never give up, just brace yourself and stop thinking about useless things.

State of mind

You need to keep your focus. This is probably the most important thing in developer’s job and it’s not easy to achieve.

Things that might help you:

• Keep your workplace clean, remove useless and eye-catching things;
• Hide apps that aren’t related to coding from your taskbar. Here’re apps from my taskbar: Console2, WinSCP, Sublime Text 3, Google Chrome and Photoshop;
• Hide bookmarks from browser;
• Work on one thing at a time.

Tools

Without proper tools you can’t do too much, so here’re my 4 favorite tools that will reduce coding time:

• Sublime Text – you probably know(use) this one so I’ll just say that it’s an awesome code editor with many plugins available.
• Emmet – it’s an abbreviation expander for you editor that allows you to do some really funky shit. Go play with it here
• Emmet LiveStyle – live bi-directional (editor↔browser) CSS editing of new generation.
• extractCSS – this helps you extract css selectors from html generated by Emmet plugin.

Workflow

Assuming that you have installed all mentioned tools and you’re focused, you can start coding. It goes like this:

• Write and extend css abbreviation, sample

  ul.nav>li.nav__item*4>a{Item $}

• Copy it to extractCSS service and get css selectors

• Save your css and html files and open them in browser

• Open developer tools, go to LiveStyle tab and turn it on

• Happily change css and watch how it changes in browser without saving. You also can change css in developer tools, it will be added to your css file.