This is a solution to the URL shortening API landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- Shorten any valid URL
- See a list of their shortened links, even after refreshing the browser
- Copy the shortened link to their clipboard in a single click
- Receive an error message when the
form
is submitted if:- The
input
field is empty
- The
- ReactJS
- TypeScript
- Bitly
I practiced my layout skills and learned new concepts to use the Bitly api.
Bitly is a very popular and useful tool, which I had never explored until the time I developed this project, so for now I only know the basics of Bitly, I plan to take another look at the documentation to explore more features.
- Bitly Developer - Bitly's documentation explains how to manage your links and implement its API in your projects, from authentication, rate limits, managing analytics, etc.
cd url-shortening
yarn
Create a .env.local
file and enter the credentials provided by Bitly.
Use the .env.local.example
as an example.
yarn start
- Website - Luis Manuel
- Frontend Mentor - @LuisManuelGlz
- Twitter - @LuisManuelGlz_