Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/manthanank/url-shortener-app
URL Shortner App
https://github.com/manthanank/url-shortener-app
angular express full-stack mongodb nodejs url-shortener
Last synced: about 6 hours ago
JSON representation
URL Shortner App
- Host: GitHub
- URL: https://github.com/manthanank/url-shortener-app
- Owner: manthanank
- License: mit
- Created: 2023-10-04T15:30:31.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2024-10-21T15:07:02.000Z (18 days ago)
- Last Synced: 2024-10-22T01:26:59.960Z (17 days ago)
- Topics: angular, express, full-stack, mongodb, nodejs, url-shortener
- Language: TypeScript
- Homepage: https://shortener-url-app.vercel.app
- Size: 889 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# URL Shortener App
A URL Shortener application built using the MEAN stack (MongoDB, Express.js, Angular, and Node.js) and styled with Tailwind CSS.
## Table of Contents
- [Features](#features)
- [Installation](#installation)
- [Usage](#usage)
- [Production](#production)
- [License](#license)## Features
- Shorten URLs and store them in a MongoDB database
- Redirect shortened URLs to the original URLs
- Responsive and modern UI using Tailwind CSS
- Dark mode support using Tailwind CSS
- Copy shortened URLs to the clipboard
- Expire shortened URLs after a specified duration
- Click statistics for shortened URLs
- URL Details page with click statistics, original URL, shortened URL, creation date, and expiration date## Installation
### Backend
1. Clone the repository:
```bash
git clone https://github.com/manthanank/url-shortener-app.git
cd url-shortener-app/backend
```2. Install the backend dependencies:
```bash
npm install
```3. Create a `.env` file in the `backend` directory and add the following:
```env
PORT=3000
```4. Start the backend server:
```bash
node index.js
```### Frontend
1. Install the frontend dependencies:
```bash
npm install
```2. Start the frontend development server:
```bash
ng serve
```The frontend server will run on `http://localhost:4200` and the backend server will run on `http://localhost:3000`.
## Usage
1. Open your browser and go to `http://localhost:4200`.
2. Enter a URL in the input field and click the "Shorten" button.
3. The shortened URL will be displayed. Click the shortened URL to be redirected to the original URL.
4. Use the "Copy Link" button to copy the shortened URL to your clipboard.## Production
To build and deploy the application for production:
1. **Build the Frontend**
```bash
ng build --prod
```2. **Start the Backend**
Ensure your `.env` file contains the production MongoDB URI.
```bash
cd backend
node index.js
```3. **Deploy the Application**
Deploy your application using your preferred cloud provider or hosting service. Ensure the `dist/url-shortener-app` directory is correctly served by your backend.
Preview: [URL Shortener App](https://url-shortener-app-manthanank.vercel.app/)
Screenshot:
![URL Shortener App](/public/image.png)
## License
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.