I took the initiative to learn the basics of TypeScript and the Next.js framework to try to keep up to date with front-end development trends. By following a tutorial, I learned how to build a full-stack application with TypeScript, Prisma/Postgres, React, and Next.js, which I loved using. This application simply allows a user to enter a URL and it shortens the URL for them, displaying the last 5 URLs shortened by loading them from a Postgres database. The amount of views the shortened URL link has gotten is also shown to the user. This project was not only good practice for learning TypeScript and Next.js, but also for working with APIs since a database was used to store the URLs and retrieve them.
The last five URLs are shown when a user loads the web app:
A user enters a URL to their Google Calendar:
The submit button is clicked and a new URL is added to the database and retrieved to be displayed for the user. The user can copy the URL and see how many visits the link has gotten:
