My Top 22 Chrome Extensions [Week 32/2020 in Review]
Tags: chrome, browser, react, javascript
Published: 2020-08-11 16:02:33

_If you like my [articles](https://dev.to/natterstefan), you probably like my [tweets](https://twitter.com/natterstefan) and [newsletter](https://newsletter.natterstefan.me/) too. Let's connect on [_LinkedIn_](http://www.linkedin.com/in/natterstefan). 🚀_

---

Hello 👋🏻.

Welcome to my "Week in Review" series. Each week I will share what I discovered, learned, and tested with you.

Over the years I have tried lots and lots of **extensions for Chrome**. Some of them are helpful during development, they optimize the experience on GitHub and Reddit or perform other tasks. In this week's "Week in Review" episode I am going to show you a collection of my favorite Chrome extensions. Many of them are available for other browsers as well. I would be pleased if you would publish your recommendations in the comments below.

Then let's see what I have prepared for you this week.

---

## Highlights

Some tweets you don't expect to perform, perform the most. Last week a tweet I wrote during breakfast went viral. Moral of the story: don't overthink tweets to many. Some of them will outperform others out of pure luck.

{% twitter 1290550059730456576 %}

A few weeks ago **I started hanging out in Google Meet and Zoom sessions with famous people on Twitter**. This includes [Bernd Artmüller](https://twitter.com/berndartmueller), the Dark Meme Lord [Francesco](https://twitter.com/FrancescoCiull4), and last week [Jack Herrington](https://twitter.com/jherr). This is something I want to invest more time into and focus on: getting to know YOU better. Stay tuned to see how this plays out.

Another highlight was the release of Catalin's ebook ["Improve Your Online Presence"](https://gumroad.com/a/921269363). I applied some of his strategies and was able to **increase my newsletter signups by 25%** - in just one week. And this is just the tip of the iceberg. There is more listed in his ebook I did not even try out yet. Did you learn and see changes from applying his tips already too? Let me know in the comments below.

---

## My Top 22 Chrome Extensions

[Chrome](https://www.google.com/intl/de/chrome/) is my browser of choice. Especially the DevTools make my life as a Web-Developer easier. If you are not really into Chrome for various reasons, you can try [Brave](https://brave.com) or [Edge](https://www.microsoft.com/en-us/edge). They both built upon Chromium, the same as Chrome, but are more privacy-focused.

So here you go - this is my list of 22 Chrome extensions:

### Extensions for Productivity & Work

- [Awesome Screenshot & Screen Recorder](https://chrome.google.com/webstore/detail/awesome-screenshot-screen/nlipoenfbbikpbjkfpfillcgkoblgpmj)
- [Checker Plus for Gmail](https://chrome.google.com/webstore/detail/checker-plus-for-gmail/oeopbcgkkoapgobdbedcemjljbihmemj)
- [OneTab](https://chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall) (save memory and reduce tab clutter)
- [Pushbullet](https://chrome.google.com/webstore/detail/pushbullet/chlffgpmiacpedhhbkiomidkjlcfhogd) (send custom push notifications to your own devices)
- [The Great Suspender](https://chrome.google.com/webstore/detail/the-great-suspender/klbibkeccnjlkjkiokjodocebajanakg) (suspend unused tabs to increase the battery life)
- [Toggl Button: Productivity & Time Tracker](https://chrome.google.com/webstore/detail/toggl-button-productivity/oejgccbfbmkkpaidnkphaiaecficdnfn) (start tracking time without leaving Chrome)

### Extensions for Writing

- [Grammarly for Chrome](https://chrome.google.com/webstore/detail/grammarly-for-chrome/kbfnbcaeplbcioakkpcpgfkobkghlhen)
- [ProWritingAid Grammar Checker & Writing Coach](https://chrome.google.com/webstore/detail/prowritingaid-grammar-che/npnbdojkgkbcdfdjlfdmplppdphlhhcf)

### Extensions for Shopping

- [Honey](https://chrome.google.com/webstore/detail/honey/bmnlcjabgnpnenekpadlanbbkooimhnj) (automatically find and apply coupons)
- [Keepa - Amazon Price Tracker](https://chrome.google.com/webstore/detail/keepa-amazon-price-tracke/neebplgakaahbhdphmkckjjcegoiijjo) (never miss a price drop on Amazon again)

### Extensions for Development

- [Apollo Client Developer Tools](https://chrome.google.com/webstore/detail/apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm)
- [Clear Cache](https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn)
- [Google Analytics Debugger](https://chrome.google.com/webstore/detail/google-analytics-debugger/jnkmfdileelhofjcijamephohjechhna)
- [JSON Viewer](https://chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh)
- [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi)
- [Sizzy](https://chrome.google.com/webstore/detail/sizzy/nfhlbmjiiogoelaflfclodlkncbdiefo) ([browser made for responsive development](https://a.paddle.com/v2/click/49831/107029?link=1947))

### Extensions for Privacy

- [Ghostery - Privacy Ad Blocker](https://chrome.google.com/webstore/detail/ghostery-%E2%80%93-privacy-ad-blo/mlomiejdfkolichcflejclcbmpeaniij)
- [HTTPS Everywhere](https://chrome.google.com/webstore/detail/https-everywhere/gcbommkclmclpchllfjekcdonpmejbdp)
- [Privacy Badger](https://chrome.google.com/webstore/detail/privacy-badger/pkehgijcmpdhfbdbbnkijodmdjhbjlgp) (I can recommend this one!)

### Other Extensions

- [Dark Reader](https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh) (turn on dark mode on any website)
- [Reddit Enhancement Suite](https://chrome.google.com/webstore/detail/reddit-enhancement-suite/kbmfpngjjgdllneeigpgjifpgocmfgmb)
- [Refined GitHub](https://chrome.google.com/webstore/detail/refined-github/hlepfoohegkhhmjieoechaddaejaokhf)

## 📗 Books

I am almost done with ["Thinking, Fast and Slow" written by Daniel Kahneman](https://amzn.to/2ZlCSk2). Only 3.5 hours left on Audible.

Catalin released his ebook ["Improve Your Online Presence"](https://gumroad.com/a/921269363). It covers lots of tips about how to improve your social media skills. I wrote [a book review](https://dev.to/natterstefan/improve-your-online-presence-by-catalin-pit-book-review-1558) about it.

And don't forget to take a look and buy the impressive ["HOW TO GET FOLLOWERS ON TWITTER! How I went from 0 to 30k Followers in 90 Days!" course by Danny Thompson](https://gumroad.com/a/108459123)! Together with Catalin's book, you will rock Twitter!

What are you reading? Share your recommendations in the comments below. 🙏🏻

## ⛓ Links of the Week

- For my own URL shortener [nttr.st](https://nttr.st/) I use [bitly](https://bitly.com/) under the hood. I never build my own shortener (yet). But I started researching how to export all URLs from bitly. If you ever want to export your links from bitly, check out ["How to export links from your free Bitly account."](https://geniuslink.com/blog/how-to-export-links-from-your-free-bitly-account/).
- Did you know that [Twitter got a patent for "Pull to Refresh"](https://venturebeat.com/2013/05/21/twitter-granted-pull-to-refresh-patent-that-everyone-already-uses-and-sort-of-gives-it-away) back in 2013?
- Speaking of pull to refresh, this article explains [how to implement a pull to refresh animation with vanilla JavaScript](https://dev.to/vijitail/pull-to-refresh-animation-with-vanilla-javascript-17oc). It also provides a [CodePen example](https://codepen.io/Vijit_Ail/pen/pmbypw).
- Are you looking for resources for your side projects? Well, then this gold nugget is for you: ["My favourite resources being a freelancer as a side hustle 💎"](https://dev.to/leomjaques/my-fav-resources-being-a-freelancer-as-a-side-hustle-15ml).
- In my [last review](https://dev.to/natterstefan/three-cli-tools-i-use-every-day-week-31-2020-in-review-5g7), I shared Bannerbear with you. This week I've got an open-source alternative for you: [github.com/vercel/og-image](https://github.com/vercel/og-image). It enables you to create Open Graph images on the fly with dynamic text inputs.
- [VS Code](https://code.visualstudio.com/) is THE IDE for me. So it is no wonder, I am constantly looking for ways to improve my experience and productivity using it. I have installed many extensions (read more about in my [week review 26/20](https://dev.to/natterstefan/my-top-5-vs-code-extensions-week-in-review-week-26-20-4p9h)), but some of them are not necessary. That is what I learned when I found and read ["VS Code: You don't need that extension"](https://dev.to/robole/vs-code-you-don-t-need-that-extension-18d7). For instance, automatically and periodically fetch the latest data from git with the [`git.autofetch`](https://code.visualstudio.com/docs/editor/versioncontrol#_remotes) setting. Awesome!
- I have already told you [I am in love with Alfred](https://dev.to/natterstefan/week-in-review-week-23-20-33g0). It has noticeably improved my productivity. So no wonder I am constantly looking for new workflows. Besides having [lorem ipsum](https://github.com/raarellano/alfred-lorem-ipsum-workflow) texts at my fingertips I installed [CharCounter](https://github.com/ibnuh/alfred-character-counter-workflow) last week. Previously I visited sites like [charcounter.com](https://charcounter.com/en/) to count chars and words of a text. Not anymore!
- Last but not least, I am a fan of [NextJS](https://nextjs.org/). My new website (not launched yet) is built with NextJS. If you don't know what NextJS is and want to learn more about it, I can recommend [masteringnextjs.com](https://masteringnextjs.com/). Besides that, NextJS has fantastic docs too.
- Are you looking for good looking animations and transitions ion React? Then you should give [React Transition Group](https://reactcommunity.org/react-transition-group/) a try. Looks awesome and just works! If you want to learn more about this topic check out ["Animating Between Views in React"](https://css-tricks.com/animating-between-views-in-react/).
- Deploy your static websites, back-end applications, or docker containers with a one-click deployment from your GitHub, Bitbucket, or Gitlab repository with [Hostman](https://hostman.com/?coupon=stefan). You'll **receive a $50 credit** when you sign up with [my link](https://hostman.com/?coupon=stefan). Do me a huge favor and give them feedback about their service and product. Thank you very much!
- Last week my team and I were discussing how to reset a component instance with an attached state from the outside. Let's say you provide an initial state to an input element and then you let the input handle the state independently. What if you want to reset that state forcefully? How can you destroy (unmount) the component and render the input again with another default state? Luckily for us, this is easy. We figured that [React's `key` property](https://reactjs.org/docs/lists-and-keys.html) can do this. You've probably seen the `key` property when rendering a list of elements. But you can also use it outside of lists to get the same result. A few days later - and this was funny - I got a newsletter from Kent C. Dodds with an article describing exactly that use-case! I suggest you [read it if you want to know and learn more about it](https://kentcdodds.com/blog/understanding-reacts-key-prop).
- I must admit since I use [styled-components](https://styled-components.com/) I haven't done much with CSS variables. But in [Jhey's](https://twitter.com/jh3yy) last newsletter he mentioned [`env()`](https://developer.mozilla.org/en-US/docs/Web/CSS/env) and I got curious. I took a look at the topic again. `env()` looks exciting and can surely make one or the other CSS case easier. Here is an [article describing it in more detail](https://bitsofco.de/css-environment-variables/). Logrocket explains in their article [how to use `env` to update and keep shared values in CSS and JavaScript in sync](https://blog.logrocket.com/why-you-should-use-css-env-9ee719ce0f24). This is interesting.

##  🐦 Tweets of the Week

{% twitter 1290149132913401856 %}
{% twitter 1290348985081831425 %}
{% twitter 1290952299179843584 %}
{% twitter 1290984633824415744 %}
{% twitter 1291081598759247873 %}
{% twitter 1290846530119688193 %}
{% twitter 1291042027090501634 %}
{% twitter 1291117914813272064 %}
{% twitter 1291416173821689859 %}
{% twitter 1291323633609179137 %}
{% twitter 1291978450425847811 %}
{% twitter 1291336091182804992 %}
{% twitter 1292080872099913728 %}
{% twitter 1292083337344045056 %}
{% twitter 1292147375126065158 %}

This is it for week 32/2020.

See you next week - thank you. 👋🏻

Stefan

---

_If you like this article, chances are you will like my [newsletter](https://newsletter.natterstefan.me/) too. 🚀_

Let's stay connected on [_Twitter_](https://twitter.com/natterstefan), [_LinkedIn_](http://www.linkedin.com/in/natterstefan), and [_GitHub_](https://github.com/natterstefan).

_You can [buy me a coffee](https://www.buymeacoffee.com/natterstefan) or support my work on [patreon](https://www.patreon.com/natterstefan) too if you want._

---

_This post includes affiliate links; I may receive compensation if you purchase products or services from the different links provided in this article._