I was thinking about a few days ago whether building up a chrome augmentation is a troublesome assignment. I see a large number of augmentations accessible on chrome web store to make our life simple, however is it extremely hard to create one. There was just a single method to discover. It was to really attempt and create one myself.
I selected to make an expansion to demonstrate meta labels utilized on a website page. On the off chance that you are not well informed and are not acquainted with how to see those, this can be extremely useful. To make an expansion you have to pursue these means:
Creating Chrome augmentations
Make an unfilled envelope and include a document named mainfest.json. Fundamentally, this record is a personality for your expansion. It decides expansions name, a symbol to be utilized, authorization required from clients with the goal for augmentation to work and significantly more. You can find out about it here. It looked something like this for me.
After that include a symbol for your augmentation. This present appear's in your program by Omnibox.
Make a record named popup.html. This is a view for your augmentation and will be rendered inside the popup window that is made in light of a client's tap on the program activity.
Make a js record named popup.js. The real rationale of rendering the substance of the popup is executed by this record.
I needed to go and make an additional document for my meta label augmentation named getPageMetas.js. This is essentially a content_script which is executed on a site page, and can be utilized to interface with expansion documents. One thing you have to see is that augmentation records and site pages documents execute independently and are totally confined to each other. The best way to speak with one another is utilizing content_scripts. You can peruse about it here.
When you have every one of these records, you are prepared to dispatch your first chrome augmentation. Really simple, isn't that so?
When you're finished coding, zip your envelope, go to your webstore engineer dashboard, transfer your zip, include vital subtle elements and voila you have effectively propelled your first chrome augmentation.
I have made my expansion code open for anyone's viewing pleasure. Here is the total code for the meta label expansion: https://github.com/abhij89/meta-labels chrome-augmentation
Here is my augmentation interface for everybody to download and utilize: https://chrome.google.com/webstore/detail/meta-labels website design enhancement instrument/miihmfdpfdioogfbfofbnagblnjbjomg