Sketching on something ...

πŸ¦– Focus Dude!!! - a simple extension to block websites


Hey,

I've been struggling with the amount of information that I consume each day since some months ago.

Sometimes I just have no idea how I can go on reading news (even something like HackerNews that should be a good source of interesting information) for hours without really producing anything worthwhile. It's going to be interesting to see what happens if I block all these sources for a while.

So, I searched for Chrome extensions that could do this.

Although several are available, why not try implementing this one?. Seems cool. There would be something new I'd learn (and a good reason for my procrastination :p).

I end up building my own Extension.


FOCUS DUDE !!!

Introduce to you : FOCUS DUDE!!! πŸ”₯

whole screen

It is just a simple extension. The most important is IT WORK!!! πŸ˜‚πŸ€˜.

This extension has been done in a couple of days from an idea I had when I can't focus on doing my work on the web.

Focus Dude!!! helps you stay focused when you work with your computer on the web.

It is easy to lose focus when working on the computer because there are so many distractions that are available! So to help you prevent your future productivity from decreasing, you just have to activate the Focus Mode! by using FOCUS DUDE!!! extension ✌️

Functionalities (when activated):

βœ… Block a predefined list of distracting websites (Facebook, Twitter, HackerNews...)

βœ… Motivating shitty quotes for you to get back to work πŸ’ͺ

βœ… Regex support

βœ… By definition, it is a simple extension.


Here I will show you more details

extension view

this is the extension UI. I FREAKING LIKE IT !!!


The WORKFLOW

appGIF

The Workflow is simple. You just list the websites you want to block at the textarea. For example:

note: make sure one URL per line. No need to put a comma(,).

reddit.com
youtube.com
linkedin.com
facebook.com
instagram.com
twitter.com/home
news.ycombinator.com

Block anything that contains anywhere in the URL.

note: For Twitter, you need to add /home to block the site.

^https?://([\w\d]+\.)?google\.com

This will block any URL from google.com, including the subdomain. For example, docs.google.com, meet.google.com, slides.google.com.....

note: Refer to ihateregex for more information about URL settings.


Shitty quote

quoteGIF

I redirect the block page to these shitty quotes page on purpose instead of just render a blank page. I want myself to F```king SUPER DUPER FOCUS ON MY WORK.


^&#@$^ Where The F*** is ON/OFF Button ???

If you notice, no ON/OFF button that lets you deactivate the extension.

Muahahaha, I will not implement that feature.

It’s pretty evident that this isn’t suitable for the case where you want to deactivate the list of backlist URLs. There’s a reason why: when impulsively visiting a website like HackerNews, I’m not totally freaking out of control of myself - I just got into the habit of visiting it. By breaking the cycle I can stop it.

To break the cycle, I want some more effort to do it. First, I need to list out all the shitty URLs. Then, copy the list of websites into a clipboard or notes or something. After that, update the extension. If I want to go back to normal mode (OFF mode), I remove the list. If I want to go back to the deep work, I deliberately copy again the list and paste it again. I do it for a purpose, for myself.


Download

You can download it on my Github repo 🌈

Focus Dude - Block any websites so you can focus on the web | Product Hunt


Future Plan

βœ… Implement ON/OFF Button

this is not important. But if there is a high demand, I'll do it.

βœ… Timeout (maybe, I don't know)

βœ… Change the redirect URL to my own subdomain name.

βœ… Update manifest to V3

The End


Follow me on Blue Bird || RSS

#stuff #I #made