Responsive URL Shortener Web App in PHP and jQuery Free Source Code

Introduction

This is a simple PHP and jQuery web application that I called as Responsive URL Shortener. This web application is inspired by the well-known/popular web application called Bitly. Same as the said web app, this URL Shortener project also generates a shortened URL.

About the Responsive URL Shortener

This simple project was developed using PHP, MySQL Database, HTML, JavaScript, jQuery/Ajax, and Bootstrap. The application allows the users to shortened their given "long" URL. When the generating shortened URL is successful, the application will return some information about the website such as the website content's (title, description, and image) is provided in the site's meta element/scheme. When browsing the shortened URL in the browser, the application updates the shortened link data in the database whereas the last browsed date/time and counts of redirects/browsing using the shortened link will be updated. The application also has an Admin Panel where the admin user can manage the list of all generated URLs.

Features

• URL Shortening
• URL Redirects to Original Website when browsing
• Responsive UI(User Interface)
• Admin Panel(password protected)
• List Generated links
• Displays the Data of Shortened URL
• Delete Generated link
• Searchable List

Sample Images of Interfaces

Public Page

Mobile View

Admin Side

This project source code is free to download. Feel free to download and modify the source code the way you desired to understand more how this application was built/developed.

How to Run

Requirements

• Download and Install any local web server such as XAMPP/WAMP.
• Download the provided source code zip file. (download button is located below)

Installation/Setup

1. Open your XAMPP/WAMP's Control Panel and start the Apache and MySQL.
2. Extract the downloaded source code zip file.
3. If you are using XAMPP, copy the extracted source code folder and paste it into the XAMPP's "htdocs" directory. And If you are using WAMP, paste it into the "www" directory.
4. Browse the PHPMyAdmin in a browser. i.e. http://localhost/phpmyadmin
5. Create a new database naming url_shortener.
6. Import the provided SQL file. The file is known as url_shortener.sql located inside the database folder.
7. Browse the Responsive URL Shortener Web App in a browser. i.e. http://localhost/url_shortener

Admin Password:

admin123

DEMO

That's it! You can now explore the features/functionalities of this Responsive URL Shortener Web App in PHP. I hope this will help you with what you are looking for and you'll find something useful for your future project.

Explore more on this website for more Free Source Codes and Tutorials.

Enjoy :)