Url Shortener

URL Shortener Project✍️

The URL Shortener Project is a dynamic and efficient web application designed to simplify the process of shortening URLs. Built with a modern tech stack, this project combines a React-based frontend with an Express.js backend, offering a seamless and interactive user experience for creating and managing shortened URLs.

The application is structured to ensure ease of use, with a focus on providing a straightforward interface for users to input and shorten their URLs, enhancing shareability and management.

🚀 Demo

https://url.app.genez.io/

Project Screenshots:

🧐 Features

This project boasts a range of impressive features designed to provide a comprehensive URL shortening service. Below are some of the key highlights:

Sleek Responsive Interface

• Technology: Built with React, ensuring a dynamic and responsive user experience.
• Implementation: The client/ directory structure and dependencies such as react and react-dom in the client/package.json file underline the use of React for frontend development.

Express Backend

• Functionality: Manages URL shortening logic and database interactions efficiently.
• Technology Stack: Utilizes Express.js, a robust server framework for Node.js.
• Evidence: The server/ directory's structure and the inclusion of express in the server/package.json dependencies highlight the backend's foundation.

PostgreSQL Database

• Database Management: Employs PostgreSQL for storing original and shortened URLs, facilitating quick data retrieval.
• ORM Utilization: Incorporates Sequelize as an ORM (Object-Relational Mapping) tool, simplifying database interactions.
• Configuration: The presence of pg and sequelize in the server/package.json dependencies confirms the use of PostgreSQL and Sequelize.

Easy Deployment

• Deployment Tool: Leverages Genezio for straightforward deployment, particularly beneficial for serverless applications.
• Configuration and Documentation: The genezio.yaml file in the server/ directory, along with deployment instructions in the README.md, guide the deployment process.

These features collectively make the project not only a powerful tool for URL management but also a showcase of modern web development practices and technologies.

🛠️ Installation Steps:

1. Clone the Repository

git clone {repository-url}

2. Install Dependencies

npm install

3. Navigate to frontend directory

cd client

4. Run the client

npm run --dev 

5. Navigate to the server directory

cd server

6. Start the server

node app.mjs

7. Deploy from root directory

genezio deploy --env server/.env

🍰 Contribution Guidelines:

Contributions are welcome! Please feel free to submit a pull request or open an issue.

🛡️ License:

This project is licensed under the MIT License