Yashasvi Singh
aUnicornDev's Blog

aUnicornDev's Blog

Introducing Hashnode Auto Reload Extension

Introducing Hashnode Auto Reload Extension

A work in progress Chrome Extension to auto reload your preview in a new Window while you write/draft your blogs.

Yashasvi Singh's photo
Yashasvi Singh
·Jan 21, 2022·

2 min read

Table of contents

  • So I decided to do something about it.
  • Installing the Extension
  • Using the Extension
  • Conclusion

Are you annoyed by having to jump between the Write and Preview Section of the Hashnode blog just to check your changes?

Honestly, it feels a lot of work to do that !!

So I decided to do something about it.

I made a Chrome Extension that Auto reloads the Preview in another window while you write your blog in the Draft section.


Disclaimer : This extension is not published on Chrome Webstore. It is a work in progress and you will have to use it locally for now.

Installing the Extension

  • Run the below command to get the source code of the extension
  git clone https://github.com/aUnicornDev/hashnode-auto-reload.git
  • Go to Extensions in your Chrome Browser

You can do it by going to the Browser Options --> More Tools --> Extension

image.png

OR

By jumping straight to extensions from the bar above

image.png

  • Turn on Developer Mode to the Top Right

image.png

  • Use Load Unpacked to select the cloned Repository (hashnode-auto-reload)

image.png

  • Your Hashnode Auto Reload extension is ready to be used in the browser

image.png

Using the Extension

The extension can only be used while writing Drafts, so to use it make sure you are on a Hashnode Draft.

image.png

  • Click on the Extension Icon and Click on the Hashnode Auto Reload Extension

image.png

  • This will open up a New window with the Draft's Preview.

image.png

  • Now while you make change to the Write section of the Draft, the Preview will load as you finish typing(with a bit of delay of course 😬😬😬).

image.png

Conclusion

This Extension is an Open Source project and anyone is more than welcome to contribute to this extension.

You contribution does not have to be related to Code, you can start with the smallest of the contribution, like making a logo.

Although, I really want to ask Sumudu Siriwardana if this project can use the Hashnode CSS Art Logo she made for the Hashnode CSS Challenge.

Want to add more features to it?

Jump on the GitHub repo and create a PR or request a feature down in the comments!!

Did this extension help you a little bit?

Jump on the GitHub repo and give it a ⭐...

Did you find this article valuable?

Support Yashasvi Singh by becoming a sponsor. Any amount is appreciated!

Learn more about Hashnode Sponsors
 
Share this