kindrobot.ca/content/post/2017-08-05-xn--5s9h.to.md

35 lines
2.3 KiB
Markdown

---
layout: post
title: "🦆.to"
slug: duck-dot-to
date: 2017-05-25 12:05:00
categories: projects
---
[![un moment](/images/duck_loading.png)](http://🦆.to)
Though ICANN has disallowed emojis in domain names<sup>[1]</sup>, some ccTLD (country code top-level domain) registrars have gone rouge and permit (and even encourage) the purchase of emoji domains. One of the first ccTLDs to do this was .ws which is the TLD for Samoa. Normally when a new ccTLD announces that they are selling emoji domains, the single emoji domains sell out fast. When I found that .to was selling emoji domains, almost every single emoji domain was gone when I got there. Luckily there's nothing stopping you from registering emoji domains for emoji that haven't been implemented by most phones and OSes yet. This is how I came to own 🦆.to.
I waited for a while for most people to have 🦆 on their emoji keyboard, but even well after that, I didn't know what to do with my new domain. One weekend, I had some spare time, and decided to make what I thought would be a temporary parking space, but which turned out to be a labor of love that I am very proud to introduce to you here.
[🦆.to] first brings up a loading screen with an adorable animated duck and then shows a random duck GIF from [giphy.com].
[![Ce n'est pas un canard.](/images/ducks.gif)](http://🦆.to)
Some things that I personally learned in this project are:
- registering an emoji domain using [punycode]
- using the new-ish [`fetch` API] to [make asynchronous API calls to the giphy API](https://github.com/motevets/duck/blob/78bd1ea492fc5018307e4c7b7d6647a762023f7f/index.html#L13)
- making a modest responsive web page by:
- using [`vmin`] to [scale the font size](https://github.com/motevets/duck/blob/78bd1ea492fc5018307e4c7b7d6647a762023f7f/index.html#L74)
- setting the [`viewport`] so that the site looks consistent on mobile browsers without using media queries
[1]: https://features.icann.org/ssac-advisory-use-emoji-domain-names
[giphy.com]: http://giphy.com
[🦆.to]: http://🦆.to/
[`fetch` API]: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
[`vmin`]: https://css-tricks.com/simple-little-use-case-vmin/
[`viewport`]: https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
[punycode]: https://en.wikipedia.org/wiki/Punycode