Blip: Test websites for speed, mobile-friendliness, security and the HTML5 doctype. Find businesses around a location and test their websites en masse, or just test one by URL


#1

Blip is an app for testing business websites for speed, mobile-friendliness, security and HTML5 compatibility. Find businesses around a location and test their websites en masse, or just test one website by URL.

Idea
What if you could search around your location for businesses, checking (a) if they had a website and (b) if it was any good? Meet blip, a website that does just that!

App
It’s entirely client-side, built on the Vue PWA template.

There’s two modes:

  • Radar, the original idea, which lets you supply your location or an address and then finds businesses nearby, testing their websites and presenting the results in a nice list view with sort-ability.
  • Laser, which lets you supply a URL for testing, and shows you a nice tabbed view of the individual test results with high-level details of what needs to be improved.

Technologies
The app is built using some third-party APIs like Google Places, Google Maps, Google PageSpeed Insights and Observatory by Mozilla. Vue related utilities include vue-router, vuex, and axios.

The data for the UI comes in asynchronously from different APIs at varying times. The author used vuex to manage this, allowing storing and then showing data to the UI as it became available. New data even dynamically affects the sorting of the listing.

It’s hosted in Azure using a free app service instance wrapped in an Azure CDN endpoint. The endpoint includes HTTPS for no additional cost (required for location detection)


#2

It Is a nice app. I have a question, how do you get un the same router after a page refresh? For example: https://blip.website/radar <— I see that if you refresh at this route it will remain there not throwing a 404 or redirecting back to https://blip.website/

Pleaseee tell me :joy::joy:


#3

You would have to setup your backend to send every url to and index of some sorts which loads the vue code. And then vue will handle the url with vue-router and load the right component


#4

Hi @iHaventSleep, sorry for the late reply, I’m not quite sure I understand your question, can you rephrase it?


#5

I have also developed a similar application for the iOS platform where we can find someone in any location with the help of an image from the assistance of https://babasupport.org/apple/iphone-error-4005/