DEV Community


Project #4: SEO Tool Extension

Peter Thaleikis đŸĒ
Developer and indie maker. Building little projects in the hope someone likes them :D
Originally published at on ãƒģ3 min read

As part of my journey to become permanently independent from employment and contracting, I need to learn marketing for my side projects. I think that's inevitable. Not too long ago, I've read "a project is 20% building and 80% marketing" somewhere. As it turns out that is very true. SEO and marketing were the top topics for me and Treesukondh in the last months.

I'm still considering myself a newbie and soaking up information on all corners. Routinely, this includes checking (my) websites to see what others are doing, making tweaks, waiting and checking again, etc. Many monotonous steps — often on autopilot. We all have these regular clicks and keyboard actions, we are doing too often. Depending on your job or interests, these steps can sum up over a regular day. One of mine is, to copy URLs of websites into SEO-related tools. These can be my websites as well as websites from others. As this got annoying, I've decided to take a break and built a browser extension to make this easier.

Built on a Sunday morning

As with RandomElon, projects don't need a long prep-phase or even a proper plan. This is especially true if you don't intent to make any money from it. Often the small things, built for yourself are more neat than big planned projects. Let's see if anyone finds it as useful as me and wants to have it 🤔ī¸

Now you can access deep links into the several SEO-related searches and services directly, with one click 😊ī¸

Currently support tools:

The following tools and services are supported at the moment:

  • Backlinks can be analysed using Ahref, Majestic, MOZ and SemRush.

  • Content can be checked using Siteliner, SimilarWeb, BuzzSumo and UberSuggest.

  • For general tests PageSpeed by Google, as well as Google's 'Structured Data' and 'Mobile Friendly' Tools are supported.

  • Deeplinks into the Google Index, Google Cache as well as to for the Host and URL are available.

If you think an important tool is missing please get in touch 🙏ī¸

What did you build it with?

The extension itself was built with

  • HTML, CSS and JavaScript (all Vanilla). The whole browser extension is fairly small and doesn't require any framework or library.

  • Laravel Mix as inexhaustible helper to bundle everything together 🤖ī¸

The website for the SEO Tool extension is built using

  • Pug for the generation of the HTML. This could have been kept out, but I've opted to keep it consistent with the website stack. This comes also from knowing myself: Often I'm adding more content pages in later on (Help, Contact, etc.).

  • Vanilla CSS to layout the website and make the buttons brown 😁ī¸ If you wonder why the buttons are brown, keep on reading.

  • No JavaScript yet — but if any JavaScript will be added most like it would be VanillaJS.

No blockchain, crypto magic or special sauce. Just some bytes in a halfway decent order.

Why is the website brown?

As you can see, I'm not a designer. My design skills end at using the color wheel and some other tools. Royalty free images and illustrations are a blessing for me. For the SEO Tool extension I have found a toolkit icon on Pixabay I liked. So I decided to go with a rather uncommon color: brown 💩ī¸

Thanks 🙏ī¸

Special thanks for Treesukondh, who prepare advised me building it and prepared the graphics for the ProductHunt launch, etc.

Thank you also to Bedexp Stock on Pixabay, for providing the icon for the SEO Tool extension.

Want it? Or got Feedback?

Head over to the links for Chrome and Firefox:

to get it for free. Of course you can also get it on the website and download it for free from there.

Discussion (0)

Forem Open with the Forem app