jonfairbanks/yo-api repository overview

⁠ Yo - The URL Shortener

Yo Dawg, heard you're tired of remembering URLs

Turn long, hard to remember URLs into easily sharable short-links.

⁠Getting Started

⁠Prerequisites

The following will need to be installed before proceeding:

• Node v8+
• Mongo DB
• Nginx

⁠Clone the Project

# Clone it
git clone https://github.com/jonfairbanks/yo.git
cd yo

⁠Run Backend

# Move to server Folder
cd server/

# Install Dependencies
npm install

# Start Server
npm start

⁠Set Environment Variables

Rename the included .env.sample files to .env and update variables as appropriate for your install.

⁠Client:

⁠Server:

⁠Run Front End

# Move to client Folder
cd client/

# Install Dependencies
npm install

# Start Client
npm start

⁠Configure Nginx

Client:

server {
    location /manifest.json {
    proxy_pass http://127.0.0.1:3000/manifest.json;
    }
    location / {
        proxy_pass http://127.0.0.1:3000/;
        proxy_set_header X-Real-IP $remote_addr;
        # Upgrade for Websockets
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

Server:

server {
    location ~* "^/[0-9a-z!?@_-]{1,99}$"  {
    proxy_set_header X-Real-IP $remote_addr;
    rewrite ^/(.*)$ https://my-api-url.com/api/link/$1 redirect;
    }
    location /socket.io {
        proxy_pass http://127.0.0.1:7000;
        proxy_set_header x-real-ip $remote_addr;
        # Upgrade for Websockets
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
    location / {
        proxy_pass http://127.0.0.1:7000;
        proxy_set_header X-Real-IP $remote_addr;
        # Upgrade for Websockets
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

⁠Enabling API Authentication

By default, the Yo backend API is open which would allow anyone who knew your API endpoint to list, edit or even delete links if they chose. To prevent this, you can enable Auth0 authentication for requests between the client and server.

• Sign up for an Auth0 account @ https://auth0.com⁠
• Create and Setup a Regular Web Application. Configure it as you see fit.
• In the Yo config.js files, set the Client and/or Domain provided by Auth0.
• Before leaving Auth0, create a user account for your application under User & Roles.
• When starting the Yo client, pass REACT_APP_AUTH=true as an ENV variable to enforce user logins.
• When starting the Yo server, pass AUTH=true as an ENV variable to enable authentication checks.
• Navigate to Yo and login with the previously created user. If successful, you should be logged into the dashboard successfully.

By default, sign-ups via the Auth0 UI are disabled. If you would like to allow user-signup however, you can force this on by passing REACT_APP_SIGNUPS=true during Yo client startup.

⁠Architecture

⁠Extras

• If you're using PM2 to manage your node processes, you can use the included yo-pm2.yaml to start and deploy the app.
• Yo can also be deployed via Docker using the included docker-compose.yaml file. Enter the Yo root directory and run docker-compose up to deploy the Yo client, backend and database.

⁠☑ To Do

• Auto Update Tab Data
• Client Dockerfile
• Server Dockerfile
• API Authentication
• Edit/Delete Functionality
• Build and Deploy App
• Better Error Handling when Navigating to Unset Links
• Swipeable Tabs
• Further refactor Home.js

⁠Contributers

Jon Fairbanks - Maintainer