Skip to content

Latest commit

 

History

History
118 lines (86 loc) · 3.06 KB

README.md

File metadata and controls

118 lines (86 loc) · 3.06 KB

URL Shortener Web App

Overview

Welcome to the URL Shortener Web App! This project implements a full-stack URL shortener web application with a modern UI, secure authentication, and a scalable backend . Users can register, log in, shorten URLs, and view analytics for their shortened URLs.

Features & Requirements

Authentication & User Management

  • User Registration & Login: Users must sign up and log in to use the URL shortener service. JWT-based authentication (access & refresh tokens) is used. Passwords are securely stored with bcrypt or Argon2.
  • Authorization & Access Control: Only authenticated users can create, view, and manage their URLs. Each user can only see their own shortened URLs.
  • OAuth (Bonus Feature): Social login (Google/GitHub OAuth) for faster access.

Frontend

  • UI Components:
    • Login & Register pages with form validation.
    • Landing Page: A simple webpage.
    • Dashboard for authenticated users to manage shortened URLs.
    • URL Shortening Page with an input field & copy button.
    • URL Analytics Page showing clicks & usage stats.
  • Tech Stack:
    • React.js with TypeScript
    • TailwindCSS (or any other CSS framework/library of your choice)
    • React Query / SWR for state management (optional)
  • API Integration:
    • Use JWT tokens for authenticated API requests.
    • Show error messages for invalid credentials or API failures.

Backend

  • API Endpoints:
    • POST /auth/register: User registration
    • POST /auth/login: User login & JWT token generation
    • POST /auth/logout: Logout & token invalidation
    • POST /shorten: Authenticated users shorten URLs
    • GET /urls: Fetch user-specific URLs
    • GET /analytics/:shortUrl: Get URL stats

Deployment

  • Containerization:
    • Dockerized backend & frontend.
    • Provide a docker-compose.yml for local setup.
  • Local or Cloud Deployment: Deploy anywhere you prefer.

Technology Stack

Backend

  • Java Spring Boot
  • PostgreSQL
  • JWT for authentication

Frontend

  • React.js with TypeScript

Getting Started

Prerequisites

  • Node.js and npm installed
  • PostgreSQL
  • Java Development Kit (JDK) installed

Installation

  1. Clone the repository:

    git clone https://github.com/Y-elv/QTChallenge_Repo.git
cd QTChallenge_Repo

  2. Set up the backend:

    cd service
./mvnw install

  3. Set up the frontend:

    cd client
npm install

Configuration

  1. Backend: Configure your database and JWT credentials in the service/src/main/resources/application.properties file.

    spring.datasource.url=your_database_url
jwt.secret=your_jwt_secret

  2. Frontend: Configure your API endpoints in the client/.env file.

    REACT_APP_API_URL=your_api_url

Running the Application

  1. Backend:

    cd service
./mvnw spring-boot:run

  2. Frontend:

    cd client
npm run dev

License

This project is licensed under the MIT License.