Git Product home page Git Product logo

urlshortener's Introduction

URL Shortener App

Introduction

This project is a URL Shortener application that allows users to enter a long URL, which is then shortened to a much shorter URL that can be easily shared. The shortened URL is redirectable to the original long URL.

Table of Contents

Features

  1. URL shortening: Users can enter a long URL and get a shortened URL that can be easily shared.
  2. Redirects: The shortened URL redirects to the original long URL.

Technologies

The project utilizes the following technologies:

  • Backend:

    • NodeJS: A JavaScript runtime for building server-side applications.
    • ExpressJS: A lightweight framework for building web applications.
    • MongoDB: A document-oriented NoSQL database.
  • Frontend:

    • Next.js: A React framework for building server-side rendered and statically generated web applications.
    • TypeScript: TypeScript is used throughout the project to ensure strong type safety and enhance the development process.
    • Tailwind CSS: Tailwind CSS is used for styling the frontend, offering a utility-first approach and speeding up the design process.

Application Setup

To setup the application locally, follow these steps:

  1. Star and Fork this repo to create your own copy to work from.

  2. Clone the repository you forked to your local machine using:

       git clone <your_forked_repo_url>
  3. Navigate to the Server directory using command "cd server" and create a .env file and copy contents of .env.example file to .env file and add all secret keys to setup MongoDB database.

  4. Install dependencies in server directory of project:

       npm install
  5. Start the server using command:

       npm start
  6. Now Navigate to the client directory using command "cd client" and create a .env.local file and copy contents of .env.sample file to .env.local file and add server URL.

  7. Install dependencies in client directory of project:

       npm install
  8. Start the application using command:

       npm start
  9. Open http://localhost:3000 in your browser to see the application.


Run application using script:

  1. Run mongodb database locally if not running, Open Git Bash in root directory of your project where Setup.sh file is present and run the below command:

       ./script.sh
  2. This will setup the frontend application and database, finally start the server using below command:

       cd server
       npm start

How to Contribute

Contributions are welcome! If you would like to contribute to the project, please follow these steps:

  1. Clone and setup this application locally by following above application setup steps.

  2. Create a new branch for the issue you assigned to work on, using below command:

       git checkout -b your_branch_name
  3. Make your changes to the code.

  4. Once you are satisfied with your changes, commit them with a descriptive commit message using below command:

       git add .
       git commit -m "feat: Add feature X"
  5. Push your changes to your forked repository:

       git push origin your_branch_name
  6. Create a pull request by clicking the "Pull request" button on the original repository page.

  7. Wait for the project maintainer to review your pull request and provide feedback.

  8. If your pull request is accepted, it will be merged into the main branch of the project. Congratulations, you've contributed to the project!


Usage

To use the app, follow these steps:

  1. Enter a long URL in the input field and click the "Shorten" button.
  2. Copy the shortened URL and share it with others.

urlshortener's People

Contributors

abhijeetnishal avatar mr-mahato avatar atharvarekhawar avatar ams003010 avatar roshanansy avatar sarthak027 avatar abh-i-sek avatar dakshsinghrathore avatar sujeetgund avatar prashant-2024 avatar harish-12222 avatar harish-1222 avatar hrishabhpatel09 avatar judge-paul avatar prajna321 avatar dependabot[bot] avatar rahul1841 avatar rahul-2004-json avatar srikar04 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.