Lazy but Productive

Tools and Tips for being a productive developer

I’m a Web developer who works mostly on JS and Python.

This blog reflects my personal learning and tools that I use for being as productive as possible. Thing listed here worked for me and I hope it works for you as well. Without no further delay, let's get started.

Credit: https://www.reddit.com/r/ProgrammerHumor/comments/dsitwc/this_is_only_101_true/

Key to be productive is find mistakes as you code and not during testing.

The Mindset

Take Baby step

If you are tasked to create a program for adding of 2 numbers don’t jump to a conclusion saying a+b. Always validate your theory against the checklist. Possibly, it will be adding 2 number of range Googolplex.

So, validate your theory against the checklist.

Shred your Process

So, now you have an idea on what to code. Shred your idea in such a way it is easy to test and easy to integrate. Write some code. Now you hit a point where you think some function would return an expected result. Well, trust me test at that moment. Extract that code into a testable function and use some REPL for testing. If you do have a unit test, then it's awesome. Commit/Check-in your code with 100% confidence.

It's easy to spot a bug in small function than in a module.

Take one step at a time.

Try To Compose

Coding starts only after you know what you are trying to achieve. So, do check out your checklist before proceeding. Also, your checklist should be minimal and descriptive.

For instance, If you are tasked to create a login form.

1. Try to create inputs & buttons and other similar testable components/functions as mentioned in shred your process.
2. Test those small components as mentions in take baby step.
3. Now use those components to create a signup form. It might sound like a bottom-up approach and yes it is.

A project is composed of multiple modules so its practical to compose multiple functions to create a module.

Tools

I prefer the VS code because of better IntelliSense and rich extension support. I hate opening separate application so I would customize my IDE and browser to do it.

VS Code Extension

Apart from es-linter, beautify and basics. Here are others.

• Code spell checker (Also renames misspelt words and its references)

Credit(https://twitter.com/programmersmeme)

• Excel viewer ( I hate opening separate application just to look headers)
• GitLens (Code history without leaving vscode)
• LiveServer (Localhost in a button click)
• TODO highlighter (Wish vscode packs this internally)
• Auto rename tags (No longer needs to rename closing tag)

Chrome extension/Customization

Apart from redux, react dev tools, Grammarly and basics. Here you go…

• Grepper (Best tool in this list. Can’t stress anymore.)
• If you test 720p, 1080p, 4k. Create a custom device by its resolution.
• VsCodes shortcut work in Chrome dev tools like cmd+p or cmd+shift+p and other similar shortcuts.
• Dark reader ( Mapped shortcut to alt+shift+d on mac)
• Google Dictionary ( for meaning)
• Headless Recorder ( for lazy web dev if you have to fill out the form again and again to test a feature)
• Postman Interceptor (Sync your site cookies with postman. No longer need to copy-paste cookie or session details). I prefer swagger/curl/fetch to postman (more on that later).
• JSONView (if you are dealing with GET API)
• Hotkey for youtube/Spotify (visit chrome://extensions/shortcuts and customize your shortcut here. The global mode works only on MAC). For Ubuntu, you can add a global shortcut in system setting under media controls. Why leaving vscode if you can control youtube from there.
• Youtube Playback Speed Control (Speed up your youtube beyond 2x. Besides its convenient.)
• Gnome-shell integration (for ubuntu)
• Redirector (Testing different version of a website as an iframe when you can’t control which site to embed as an iframe)

MAC/Ubuntu Customization

• Oh my zsh Terminal. ( ctrl+r on mac/ubuntu for reserve search on history)
• Copy Clip (Mac/Ubuntu) for saving clipboard history. Windows comes pre-installed use win+v.
• cmd+f11 for toggling full screen on mac. Ref here to add yours.
• Swapping ubuntu key layout like mac (ctrl, alt, options). Ref here. It also works in 20.14.
• KDE Connect ( Similar to the mac-iPhone ecosystem but for the ubuntu-android ecosystem. Yes, it exists and it's not a rip-off. )

MISC

• cmd+alt+v to copy the active file path in vs code.
• Prefer fetch JS API to postman or swagger and if you wish to reuse the API later use curl. (Rem reverse search). You don’t need an extra application.
• VsCode tasks for launching scripts in package.json. Ref here to create yours.