Hey Dude – where’s my online tool?

Over the past 18 months I’ve been posting details of various online tools that I’ve encountered – but not this month I’m afraid.

Why? Well, frankly I’ve run out! I’ve got nothing!

I’ve been hard at work but haven’t actually found the need for an online tool that I haven’t used before.

Now that’s not to say that there aren’t any tools out there – it’s just that I didn’t need them, not this month anyway.
Next month may be different but I think it’s probably best to drop the ‘of the month’ banner and just categorise them as ‘Online Tool’

If you know of a tool that I’ve not featured and think I, as a .NET / Xamarin developer may find useful then feel free to use the contact page to point me in it’s direction.

Online Tool of the Month – converter.telerik.com

Telerik shouldn’t be a new name to you but if it is then I suggest you head on over to their main site, https://www.telerik.com, and have a look.

This post relates to there Code Converter utility which I found a need for recently while maintaining a clients VB.NET application.

Although I used to develop mainly in VB.NET I am now predominantly working in C# and as anyone who has used both languages will tell you, flipping between one and the other is not exactly painless.

Continue reading “Online Tool of the Month – converter.telerik.com”

Online Tool of the Month – base64-image.de

I recently had a need to create HTML email templates for a project which needed to include a couple of images, e.g. the company logo and feature image. I have of course done this in the past and just linked to the required assets on the hosting website – but this time is was different.

This time the website was potentially not accessible from outside of the local intranet and the requirement was to embed the images directly into the message.

One way to do this is to encode the images to a base64 string and use the resulting text, with a ‘data:image/jpeg;base64,‘ prefix in the src attribute of the image tag – something like this;

<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/4QBoRXh....." />

Now all I needed to do was encode the images.

Continue reading “Online Tool of the Month – base64-image.de”

Online Tool of the Month – FakeNumber.org

I don’t know about you but I get a little hacked off when I want to sign up for a simple something but have to give up so much of my personal data that I sometimes just look elsewhere.

Now I’m not talking about my name or even my email address, but why would a service want my home address when I’m not going to be sent any physical goods or my telephone number …. at all? Depending on the service/company I may see the need for this information and will provide it if it is really needed – but a lot of the time this information is just going to be sold on or used for sales calls that I neither signed up for or wanted.

Continue reading “Online Tool of the Month – FakeNumber.org”

Online Tool of the Month – unminify.com

Minification and bundling of Javascript and CSS files is obviously a good idea when you are deploying your websites to production – but if you want to use a third-party, minified, resource and want/need to look at the unminified version – it can be a bit of a pain.

I recently purchased a theme for a website which came as a set of CSS, Javascript and image files. There were a number of pages which demonstrated the theme and it was pretty much what I wanted – but not quite, I needed to make a few very minor changes.

These changes were limited to styles which specified ‘hero blocks’ with image backgrounds. I didn’t need a block with an aircraft in the background – I needed one with a camper van.

Continue reading “Online Tool of the Month – unminify.com”

Online Tool of the Month – SelfSignedCertificate

In this day and age everything needs to be encrypted to prevent nefarious access to our data. Whether it’s our banking or medical records, our online email inboxes or our browsing and searching habits.

So, when developing websites or APIs I always start with an SSL enabled configuration – and in Visual Studio that’s a pretty easy thing to do, it’s just a checkbox really.

When deploying websites to production servers I, like millions of others, use LetsEncrypt to generate and renew my SSL certificates.

But what about that gap between Development and Production? I am of course talking about ‘Test Servers’.

Continue reading “Online Tool of the Month – SelfSignedCertificate”

Online Tool of the Month – ExtensionMethod.Net

OK – not really a tool, more of a resource but I hope you will like it.

As you may know my language of choice is C# and since version 3.0 developers have been able to add functionality to existing types without actually modifying the type itself by using Extension Methods.

We are all used to the String methods such as ToUpper() and ToLower() – but what if you wanted to truncate a string to a specified length and apply a ‘…’ suffix?

Well, you could of course write a private method in the class you want to perform this operation or create a static class with static methods to do the job for you. Both perfectly valid ways of achieving the same result but extension methods are somewhat cleaner in my opinion (if you ignore the ‘they are’t object oriented’ argument).

Now you can read all about Extension Methods using the above link but as with things like RegEx, there is not always a need to reinvent the wheel and the ExtensionMethod.Net website is basically a collection of user submitted methods which address common needs (or even the not so-common ones).

The site isn’t limited to just C# methods either – there are submissions for VB, F#, Swift, Kotlin and Javascript.

You can search or filter the methods by language, target object (e.g. System.String) and author.

Once you have found something you like you can view the code and, most of the time, see usage examples.

From there it is just a quick copy/paste to bring the code into your project – where you will more than likely want to tweak it slightly (because that’s what we do right?) and you’re good to go.

N.B. If you like the sound of the ‘Truncate’ method I mentioned above, you can find it here.

Online Tool of the Month – MakeAppIcon

I’ve been developing a couple of Xamarin applications recently and while the default application icons are better than nothing you will of course need to replace these with custom graphics before going live.

Now I’m no designer so I’ve used Fiverr to find suitable resources for a number of previous projects (websites, logos and menu icons) and have done so for these mobile apps. In return for about £10 I received nice, clean icon designs which I’d never have been able to put together myself – £10 well spent in my opinion as I can spend the time coding instead 🙂

Anyway, having the design is one thing – creating the required assets for each platform is another. Android and iOS both require numerous versions of the image with specific dimensions. Android requires these to be placed in a specific folder structure while iOS requires specific file name formats for the assets to be used correctly.

Creating these manually is a bit of a pain and time consuming – surely there must be an easier way!

Enter MakeAppIcon which makes creating these assets a breeze. Assuming you have a suitable source file, I use a 1024×1024 png file, this handy tool will create all the possible permutations required for Android and iOS – many of these you may not need but at least you have them if you need them.

When you goto the site it’s not that easy to see what you need to do – there are ads for their paid products and the free service does not jump out at you. Currently you need to turn your attention to the panel with the toaster.

Select your source image and it will start to process it – which can take a few minutes (this is a free service remember). When it has finished you will be asked for your email address so that it can send you your icons.

Now, I normally don’t like doing this but on this occasion I decided to go ahead – and I can confirm that I’ve not received any SPAM etc as a result (not even to push their paid products!).

After a few minutes an email will arrive containing icons from ldpi to xxxhdpi for Android and every size for iOS from 20×20 to 83.5×83.5 (@1x, @2x and @3x as appropriate). There’s even Play Store and iTunes artwork.

All you have to do now is import them into your project and your are good to go 🙂

Online Tool of the Month – MockUPhone.com

While preparing my previous post I needed to generate some mobile device mockups showing my Xamarin.Forms app running in Android and iOS.

In the past I have normally cobbled these together using Paint.Net, a device bezel image and overlaying the screenshot onto it. Not pretty but it worked and looked fine.

However, the bezel images I had were rather old and I wanted to freshen things up a bit so went off in search of some new ones – only to come across MockUPhone.com.

MockUPhone is a free online service which will take your screenshots (I generate mine using Android and iOS simulators) and apply a variety of device bezels, e.g. Pixel 2, HTC One, iPhone 8 & iPhone X.

If I had a gripe then it would be that the images were not the same size for each platform which meant that I had to resize one of them to match the other but as I was going to be merge matched screenshots for Android and iOS into a single image this was hardly a hardship.

It is also worth noting that they offer another service called ‘ShotBot‘ which is an App Store screenshot designer for Android and iOS. It requires a login and I’ve not tried it myself (yet) as I already had my App Store listings ready to so – but when I need another one, I’ll be sure to take a run at this.

Online Tool of the Month – webhook.site

If you’ve ever worked with a third party API that uses Webhooks you will appreciate the power and flexibility that they provide. Instead of having to poll for updates yourself you can rely on the API to call you instead.

I first came across webhooks when developing a web application that implemented Stripe as it’s payment gateway for monthly/annual subscription payments.

In this instance the webhooks would fire when specific events occurred; e.g.

  • Payment was successful
  • Payment failed (and will be retried)
  • Subscription Cancelled (manually or after repeated, automated attempts for payment have failed)

Long polling for this information would be a nightmare and having the webhook contact an endpoint on your API removes this headache – but does introduce another.

When I was developing the webhook callback endpoints it was difficult to see what data was being passed in the request. Stripe’s API documentation was good but there is nothing like actually seeing the data for yourself.

Attempting to route calls from a remote webhook to my development environment was somewhat problematic and I never quite managed to get it working. In the end I created a simple WebAPI service that I deployed to a virtual private server which would receive the webhook request (as JSON) and simply email it to me. Simple effective but a bit of a pain.

Recently I was looking at integrating an existing product with JIRA for another client and low and behold, it’s API provided webhooks – but before dusting off my WebAPI project I took a look to see if there were any alternatives out there – and, not surprisingly there was.

Enter webhook.site – a simple but powerful web application that basically adds a lot of polish to the quick and dirty solution I had previously developed.

When you navigate to the site it will generate a unique url that you can use to configure the webhook.

Then you can either wait for something to hit it (if you are debugging something live) or fire up your development environment and go through the process that will trigger the webhook to fire. Some services, like Stripe, provide a function to allow you to simply trigger the webhook with dummy data.

Once the webhook.site endpoint receives the request it will display the request and it’s payload.

This will prove invaluable if you are trying to debug inconsistent data operations and webhook failures.

Maybe it was a typo in a property name, maybe a data type mis-match, but without being able to actually see the data being sent it is impossible to determine what is going wrong.

 

Online Tool of the Month – realfavicongenerator.net

Following the migration of this website to WordPress I installed the ‘redirection’ plugin in an effort to handle the difference in the url structure used by Squarespace (my previous host/platform). This plugin allows me to redirect users using the old Url to the correct content and also see any 404 errors for resources I may have missed.

While reviewing this 404 log I noticed a few rather odd entries, such as

  • apple-touch-icon-precomposed.png and
  • apple-touch-icon.png.

Knowing that I never had such content on the site before I did a bit of Googling and found that these are favicons (the little square logos that reside on your browser tabs) that Apple’s Safari browser will attempt to load along with your page.

Now that I knew what the problem was, how do i fix it? I mean, I had a favicon on the site – why couldn’t Safari just use that one?

After a bit more searching I found the Real Favicon Generator site where I was able to enter the Url of my site and it would generate a report on what it found (or didn’t find as the case maybe).

This is actually for another site I manage but the result is similar to when I ran it on this site

Now, that’s a lot of red but fear not – help is at hand. As the sites name eludes, it is also able to generate the appropriate icons as well. But how will I get these into WordPress – it only has the facility to allow me to specify a single favicon file.

Well – as well as the testing of the site and generation of the icons, there is also a WordPress plugin which makes things super easy.

With the plugin installed, navigate to the Appearance menu and select ‘Favicon’.

Select your desired image, they recommend 260x260px but mine was 150x150px and it looks fine for my purposes.

Click Generate and you will be taken to an editor page which allows you to tweak a few colours and settings – I didn’t bother with this, I just clicked the ‘Generate your Favicons and HTML code’ button at the bottom of the page.

And that’s it – I re-scanned the site and (unsurprisingly enough) everything was now green – and the 404 errors are no longer appearing in the redirection logs.

Online Tool(s) of the Month – For Finding Lat/Lng

I’ve recently been engaged by a client to write the mobile applications for his website (more on that in later posts) which plots ‘points of interest’ on a map. That probably sounds a little familiar as I have already developed the FillLPG for Android application which displays the location of LPG stations around the UK – and increasingly into Europe.

Working with mapping applications is always a challenge, but an enjoyable one for me as I find maps such an engaging medium. One recurring challenge for me is that I don’t speak ‘Latitude and Longitude’ so when I need to test my code, e.g. load the map for a certain location and perform a ‘nearby’ search, I have to determine some suitable coordinates.

There are a few online tools out there but I always use one of a couple that I’ve found to be useful

Of the two LatLong.net looks the more modern interface with simple but powerful search capabilities. Enter a place name or Postcode (that’s a ZIP code for you US readers) and the map is displayed and a pin in the appropriate location with it’s coordinates clearly displayed (Lat/Lng and GPS).

If you want to find the coordinates of a specific location then you just need to pan & zoom the map until the location is in view and then simply click it with the mouse.

Couldn’t be easier really and this is all I need most of the time.

Sometimes though, I need a little more and while FindLatitudeAndLongitude.com may look a bit dated there is a lot of power there. For instance, while you can do everything that the previous site can do, if you can find the Menu panel (highlighted in the screenshot) you will see that you can perform all manner of searches and reverse look-ups.

Using the ‘Lat/Lng to Address’ search it is possible to zoom into a map, select a location (probably a house or business) and resolve the full address by clicking the ‘Load’ button. I’ve found this feature to be very powerful – for development and personal use (sometimes you just need a postcode for your SatNav).

 

 

Online Tool of the Month – unixtimestamp.com

As developers we know that one of the biggest problems when working with data is handling dates. It’s such a simple thing surely yet many of us fall foul of formatting issues and time zone offsets – and that’s when the date is actually human readable!

I remember when I first encountered a Unix Timestamp in the ‘LastUpdated’ column of a database table and thinking, ‘what the hell is that?!’.

Bear in mind that this was back in the days before the internet and before I had any real experience with Unix/Linux systems – every Windows application I had seen prior to this had it’s dates stored in the DD/MM/YYYY hh:mm:ss format.

Being faced with something like ‘1519571567‘ was a bit confusing to say the least – unless you know that this represents ‘the number of seconds since midnight (UTC) 1st January 1970‘ where would you even start to know what this meant?

Even now that I now what this is, it is always a bit of a pain point to me when I’m developing or debugging something with a date in this format;

  • What time does the timestamp in that database field represent?
  • What time is it now expressed as a unix timestamp?
  • etc

Over the years I’ve come to fall back on Dan’s Tools Epoch Unix Time Stamp Converter.

The fairly simple interface is great as it doesn’t get in you way and lets you don what you came to do.

To the left of the screen is the current timestamp (or at least the timestamp from when the page was loaded) and how this would be displayed if translated to a number of other standards.

To the right is where you can either enter a date (using clearly marked fields to prevent ambiguity) or a unit timestamp.

Entering the timestamp from a few lines above and clicking ‘Convert’ generated the following:

While entering the date I’m currently writing this blog post returns the following:

This is essentially a copy of the output of the left hand panel but displaying the output for the entered value. The value is also converted into a number of different formats, e.g. ISO 8601 & RFC2822.

I’ve found this to be a helpful little tool when working with Unix Timestamps and be sure to checkout the other date related utilities in the top menu bar, e.g. Timezone Converter and Week of the Year.

Online Tool of the Month – BuiltWith

Have you ever looked at a website and thought ‘I wonder what that’s written in’? Well, even if you haven’t I certainly have which is why I was interested to hear about BuiltWith.

Simply put, BuiltWith puts websites under the microscope and produces a detailed report about what it sees.

From Webservers and SSL Certificate providers through programming languages, Javascript libraries, content management systems and advertising platforms it sees it all. The produced report contains links to allow you to see technology trends across the Internet which may well assist with infrastructure decisions for your next project.

Pointing BuiltWith at this site I was able to see that not only were the current technologies being listed, including the current version numbers where applicable, but it also reported that 56 technologies had been removed since July 2012 (I migrated from SquareSpace to WordPress fairly recently).

Registering for a free account would allow me to see much more detail and view historical data but for now I have found the open version sufficient for my needs.

 

Online Tool of the Month – QuickType

I was recently working on a freelance project which required interaction with a 3rd party webservice that returned a JSON result.

While connecting to the service and fetching the data was a fairly trivial task, looking at the data being returned it was clear that a lot of POCO/DTO classes were going to be required.

Obviously these are easy to create but they are time consuming and prone to the odd typo. I then remembered a labour saving service called QuickType which would take the returned JSON and generate the C# code for me – I just needed to pull it into my project.

When you navigate to the QuickType site you are presented with some sample input data in the left panel and the resulting C# code in the main panel. There are also some options in the panel to the top right that we will need to tweak.

In the screenshot below I’ve pasted in some JSON which was generated by another online service called, oddly enough, JSON Generator (I’ll probably feature this tool next month). I’ve also used the ‘Target Language’ dropdown to select C#, specified a Namespace and collection type to use (List<T>).

 

As you can see (notwithstanding the truncated lines which are an artefact of my screen capture tool), not only has QuickType generated the main Person class, it has detected and created the ‘Friend’ class along with some serialisation and conversion classes (with methods inside of which can be extracted and used as required – or discarded).

It has also added JsonProperty attributes to the properties (assuming NewtonSoft.Json) and provided usage details

 

Now obviously there is no voodoo at work here – creating these classes is pretty trivial – but this is a great time saving tool which can free up your development time to actually develop instead of churning out this mundane code.