SHORTY URL FULL STACK DEVELOPMENT
A clean & elegant design using Ant Design framework and React Hooks for optimal performance and Express Server for backend operations. All serverless function which is easily deployed on vercel.
CLIENT: React, Hooks, Ant Design 5+
SERVER: Node, Express
https://shorty-cut.vercel.app/
See SS here.
Download the release zip for complete Frontend & Backend files and skip cloning steps from Installation for less confusion beacuse of seperate repos for Frontend & Backend
Clone the project
git clone https://github.com/shehari007/url-shorty.git
Go to the project directory
cd url-shorty
Rename the .env.example file -> .env and fill out the empty fields
## BACKEND SERVER ENDPOINTS HERE
REACT_APP_API_URL= #e.g http://localhost:5000/
REACT_APP_API_REPORT_URL= #e.g http://localhost:5000/report
REACT_APP_API_STATS_URL= #e.g http://localhost:5000/stats
REACT_APP_API_CONTACT_URL= #e.g http://localhost:5000/contact
REACT_APP_GITHUB_URL= https://github.com/shehari007/
## set false for production
REACT_APP_DEBUG_MODE=true
Install dependencies
npm install
Start the frontend
npm start
Clone the project
git clone https://github.com/shehari007/url-shorty-server.git
Go to the project directory
cd url-shorty-server
Rename the .env.example file -> .env and fill out the empty fields
## MAIN PORT ##
PORT=5000 ## keep it 5000 if you used example links in env file for frontend
## DB connection ##
DBHOST=
DBPORT=
DBUSERNAME=
DBPASS=
DBNAME=
## CORS ORIGIN DOMAINS & METHODS ##
DOMAINS= http://localhost:3000 ## Local running frontend address
METHODS= 'GET,POST'
## SHORT URL GENERATE CONSTRUCTOR ##
SHORTURLDEF=http://localhost:5000/co/ ## this is the default constructor for generated URL's
##DEFAULT LENGTH OF NANOID PARAM FOR SHORTYURL
PARAMLEN=5
Install dependencies
npm install && npm install nodemon --global
Start the server
nodemon index.js
To deploy as a serverless function vercel json config is provided in server files you can deploy this on vercel without any extra configuration
Integrate Google Captcha to emit the use of bots generating short links (work in progress)
Per link Stats how many times clicked individually and other info (completed & live)
Show links generated by same ip in a table for each user individually (work in progress)
If you have any feedback, please reach out at shehariyar@gmail.com
Author: shehari007
Source: https://github.com/shehari007/url-shorty
License: MIT license