https://github.com/alexbelloni/shortly
Shortly uses URL shorteners to simplify the sharing of links. It's a frontendmentor.io challenge
https://github.com/alexbelloni/shortly
css3 frontendmentor html5 javascipt vanila
Last synced: 17 days ago
JSON representation
Shortly uses URL shorteners to simplify the sharing of links. It's a frontendmentor.io challenge
- Host: GitHub
- URL: https://github.com/alexbelloni/shortly
- Owner: alexbelloni
- Created: 2020-03-16T20:21:31.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-08-25T21:21:10.000Z (over 5 years ago)
- Last Synced: 2025-02-23T19:45:50.151Z (about 1 year ago)
- Topics: css3, frontendmentor, html5, javascipt, vanila
- Language: JavaScript
- Homepage: https://yourlinkshortly.netlify.com/
- Size: 157 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Shortly
[](https://app.netlify.com/sites/yourlinkshortly/deploys)
Shortly is a friendly web app, which uses URL shorteners to simplify the sharing of links.
[Site](https://yourlinkshortly.netlify.com)
Project description: single-page application that consumes data from at least one API and persists user data via Firebase
## Technical Requirements
The requirements of this project are:
✔ A SPA (single page application) that consumes data from at least one API
✔ Make at least one HTTP request to a third-party server
✔ Use either vanilla JS or jQuery to perform DOM manipulation
✔ Listen for events and add interactivity based on user input
✔ Clean And Readable Code. The instructor should be able to read and follow your code easily.
✔ Maintain clean and readable code including: consistent indentation, code commenting and use of proper and consistent naming conventions.
✔ Object Oriented and/or Functional. Implement function closures, keep code modular, maintain a separation of concerns, only put code on the global scope when absolutely necessary.
## About
The original idea was downloaded on frontendmentor website as a design guide.
Shortly was created using vanilla JavaScript.
The "Shorten it" click transforms a long URL into a short one by using Bitly or Rebrandly tools, radically.
When clicking on the SignUp button, it calls Authorization Firebase API with the Google option. The return is a valid user, which name is printed on the page. This function could be used to save a short URL on the database.
## New knowledge
Netlify functions for getting environment variables
https://docs.netlify.com/functions/overview/#manage-your-serverless-functions
## References
Frontend Mentor: https://www.frontendmentor.io
Firebase: https://firebase.google.com/docs/auth/web/google-signin?authuser=0
Bitly: https://bit.ly
Rebrandly: https://rebrandly.com/
Netlify: https://netlify.com
Alex's website: https://alexandrebelloni.com