In this episode, we take the next step in our URL shortener project by setting up the actual storage for our shortened URLs. We start off by creating a URL model and a migration file for our database. Here, we decide on the key fields: the original long URL, a unique hash ID (which will be our short link identifier), and a counter for tracking visits, which starts at zero.
Once the migration is set up, we run it so our database now has a table ready to store our URLs. We also update the URL model to allow mass assignment for all the important fields.
With our storage set up, the next task is to actually save shortened URLs. After validating the user's input (so we know it's a real URL), we create a new record in the database. To keep things simple for now, we're just hard-coding the hash ID, but we'll generate real unique hashes later.
We also update the page to only show the input form when we haven't created a short URL yet. As soon as a user submits a long URL and we store it in the database, the page updates to show the new short link, ready to be copied. We finish off by adding a bit of styling so the page looks neat and recapping that we've covered creating and storing the URL, changing the UI based on state, and getting ready for the next steps — like actually redirecting users using their new short links.
So by the end of this vid, we've set up full circle storage for our short URLs and laid the groundwork for the redirect feature coming up soon!