Making a URL shortener
Initial Project Setup
This was inspired by this post from Kent C Dodds.
Create a github repo, the only file it needs is a _redirects
file containing something along these lines:
/youtube https://www.youtube.com/channel/UCTUuyVBYiopWoTEJu6ptDbg
/github https://github.com/grantglidewell/
/twitter https://twitter.com/GrantGlidewell
/blog https://blogwell.io
/* https://grantglidewell.com
Set Up Netlify
Make an account and connect that repository. No need to select build options, just deploy that thing! The default behavior of Netlify is to re-deploy your repo every time the master branch is updated, this is exactly the behavior we want. If you have a custom domain (preferably a short one) follow the documentation in netlify to make that connection.
Automate
This is where things diverge a bit. Kent created a package that allows you to use an npm script to add a redirect to the URL shortener. Install it, and add this script to your package.json
"scripts": {
"shorten": "netlify-shortener"
}
Now if you run yarn shorten http://whatever.com whatever
the package will write a new line to your redirects, and then push that change to your github repo. This is great and getting more useful.
Add your baseUrl
to that package.json
so you get a useful clipboard copy of your shortened url after it is pushed.
But I want to run this from anywhere! Kent has a solution for that, he make an alias in his bash profile. It looks like this:
alias shorten="pushd ~/code/shortner-repo/ && npm run shorten \"{$1}\" \"{$2}\" && popd"
However, Us ZSH users trying to implement that same functionality needed to do something a bit different:
function shorten() {
pushd ~/code/shortner-repo/
yarn shorten $1 $2
popd
}
now anywhere on the command line you can run shorten url name
!