Two parts of the system:
- Client
- Server
- Created in ReactJs.
- User Enters the Link
- Client contacts the server using REST Api's.
- Server responds with shortLink
- ShortLink is displayed.
- Client can copy the short link and use for redirection to original link.
- Created in NodeJs with data storage in MongoDB.
- The Link is received at Server from client end. Server shortens the link.
- The Orginal Link, Shortened link and the Shortlink code, all are stored in MongoDB.
- The server sends the shortlink back to client.
- Download and install npm from npm site.
- Download and install NodeJs from NodeJs site.
- Download and install MongoDB from MongoDB.
- Download and install nginx from nginx.org.
Alterative: you can also install all packages from HomeBrew for Mac
- Change directory of terminal where the project has to be located.
- Clone the git repository using command:
git clone https://github.com/shardik95/Link-Shortener
cd your-path/Link-Shortner
change to your path- Start MongoDB in new tab:
sudo mongod
- You can go to new tab and see the database. type
mongo
, thenshow dbs
, thenuse link-shortner
anddb.linkshortner.find().pretty()
cd server
npm install
npm start
- Open a new tab in terminal to start client
cd ..
cd client/linkshortner/;
npm install
npm start
- open a new tab in terminal and change directory to where nginx is installed In most case, it might be present at /usr/local/etc/nginx/
open nginx.conf
- save it with following changes:
server { listen 80; server_name localhost; location ~* "^/[0-9a-z@]{5,15}$" { rewrite ^/(.*)$ http://localhost:4000/api/link/$1 redirect; }
- Save and quit
- Start nginx
sudo nginx
- If there's a problem try
sudo nginx -s quit
andsudo nginx
- Go to browser and type http://localhost:3000 or whatever port your client is running o n.
- Make sure your server is running by going to http://localhost:4000 where you can see 'Link Shortner'
- Type the Original Long link in client and press submit.
- You'll see a new shortened link.