Subhash Kumar - U03AI23S0104 2025-2026

Project Report
on
FULL STACK VIDEO STREAMING PLATFORM - FANTUBE

Submitted in partial fulfillment of the requirement for the award of

degree in Bachelor of Computer Applications during the
Academic year 2025-26
Submitted by
U03AI23S0104 - SUBHASH KUMAR

Under the guidance of

Asst. Prof. Ms. Rakshitha G K

Acharya Bangalore B-School

Andrahalli Main Road, O Magadi Road,
Bengaluru - 560091, Karnataka, India

DEPARTMENT OF COMPUTER SCIENCE Page 1

ff
 Subhash Kumar - U03AI23S0104 2025-2026

Department of Computer Science - BCA

Certificate
This is to certify that SUBHASH KUMAR bearing Reg. No U03AI23S0104
has satisfactorily completed the project entitled FULL STACK VIDEO
STREAMING PLATFORM under the guidance and supervision of Asst. Prof.
Ms. Rakshitha G K in partial ful llment of VI Semester BCA course as prescribed
by Bangalore University, Bangalore in our college during the academic year
2023-26.

Project Guide Head of the Department

Ms. Rakshitha GK (Mr. Praveen Kumar V)

Examiners

1………………………….

2…………………………..

DEPARTMENT OF COMPUTER SCIENCE Page 2

fi
 Subhash Kumar - U03AI23S0104 2025-2026

Acknowledgement
I articulate my sincere gratitude to all those who helped me in making this
venture a grand success, without whose constructive criticism as well as words
of inspiration this project of mine would not have seen the light.

I take this opportunity to thank Dr. Rajesh C, Principal, Acharya Bangalore B-

School, for permitting me to undertake this project as part of my curriculum.

I would like to mention my sincere gratitude to Mr. Praveen Kumar V, Head

of the Department, BCA, for the constructive criticism and guidance and for the
encouragement that has been a source of inspiration for me.

I would like to express my gratitude to my internal guide Asst. Prof. Ms.

Rakshitha G K, Department of Computer Science for giving me the valuable
information and advices that helped me a lot for the successful completion of
my project work.

Last but not the least, my thanks goes to my parents, GOD and friends whose
support and enthusiasm helped me greatly to make the project work a
memorable event.

DEPARTMENT OF COMPUTER SCIENCE Page 3

Subhash Kumar - U03AI23S0104 2025-2026

Chapter -1
Introduction

DEPARTMENT OF COMPUTER SCIENCE Page 4

 Subhash Kumar - U03AI23S0104 2025-2026

Introduction

FANTUBE is a full-stack web application that replicates the core functionality of

YouTube. It allows users to upload, stream, discover, and interact with videos through
a modern, responsive interface. The platform supports user authentication, a creator
studio for content management, a subscription-based feed, and a machine-learning-
inspired recommendation engine — demonstrating both full-stack engineering and
applied algorithm design in a real-world context.

The system is built on a React 19 + Vite frontend paired with a [Link]/Express REST
API backend, using PostgreSQL as the primary database and JWT for stateless
authentication.

1.2 Statement of Problem

Existing platforms like YouTube are proprietary and closed-source, making it

impossible for students or developers to understand their architecture, replicate their
features, or experiment with core components such as recommendation engines or
secure media delivery. There is a need for an open, educational full-stack clone that
implements these features from the ground up using modern web technologies.

1.3 Objective of the Study

• To design and develop a full-stack video-sharing platform from scratch.

• To implement secure JWT-based authentication with Google and Twitter
OAuth support.
• To build a secure file upload and streaming system with authentication-gating
middleware.
• To implement a contextual bandit / RL-inspired recommendation engine that
learns from user interactions.
• To provide a creator studio for video management, including visibility control
(public, unlisted, private).
• To demonstrate the complete software development lifecycle for a complex
web application.

DEPARTMENT OF COMPUTER SCIENCE Page 5

 Subhash Kumar - U03AI23S0104 2025-2026

1.4 Scope of the Study

The scope of FANTUBE includes:

• User registration, login, and OAuth-based social authentication.

• Video upload with XHR progress tracking and Cloudinary integration.
• Secure video streaming with ownership and visibility verification.
• A subscription feed, search, and channel pages with tabbed navigation.
• A recommendation engine using UCB-style scoring and tag/channel affinity.
• A creator studio for managing uploaded content.
• Keyboard shortcuts and interaction tracking on the watch page.
The project does not cover live streaming, monetization, or advertisement systems.

1.5 Feasibility Study

1.5.1 Technical Feasibility

The project uses entirely open-source, well-documented technologies. React 19,

[Link], Express, and PostgreSQL are all industry-standard tools with active
communities. Cloudinary provides reliable free-tier cloud storage for media. JWT and
[Link] handle authentication without requiring external paid services. The stack is
fully deployable on any standard hosting platform. Technical feasibility is confirmed.
1.5.2 Operational Feasibility

The system is designed with a clean separation between frontend and backend,
making it maintainable and extensible. Modular file structures, RESTful API design,
and well-named components ensure that future developers can operate and extend the
system without significant ramp-up. The creator studio and admin-like controls make
day-to-day content management straightforward.
1.5.3 Financial Feasibility

All core technologies are free and open-source. PostgreSQL Atlas, Cloudinary, and
hosting platforms such as Render or Vercel offer free tiers sufficient for a college-level
project. No paid licenses or subscriptions are required. Financial feasibility is
confirmed.

DEPARTMENT OF COMPUTER SCIENCE Page 6

Subhash Kumar - U03AI23S0104 2025-2026

Chapter -2
System Study

DEPARTMENT OF COMPUTER SCIENCE Page 7

 Subhash Kumar - U03AI23S0104 2025-2026

Chapter 2 — System Study

2.1 Existing System

YouTube is the world's largest video-sharing platform, offering video upload, streaming,
recommendations, subscriptions, comments, and monetization. Similarly, platforms like
Vimeo and Dailymotion provide video hosting with varying feature sets. These systems are
entirely proprietary, built on infrastructure not accessible for academic study.

2.2 Limitations of the Existing System

• Source code is proprietary — architectural decisions cannot be studied or replicated.

• The recommendation algorithm is a black box; it cannot be modi ed or experimented
with.
• Media delivery is handled by large-scale CDNs, making it impossible to learn secure
streaming patterns.
• Authentication systems involve complex, opaque OAuth ows with no visibility into
the implementation.
• These platforms are not built for learning — they prioritize scale over educational
clarity.

2.3 Proposed System

FANTUBE is a full-stack YouTube clone built for educational purposes, replicating the
following core subsystems:

• JWT-based authentication with Google and Twitter OAuth (via [Link]).

• Secure le upload pipeline with Cloudinary and XHR progress tracking.
• Custom authentication-gated streaming middleware replacing static le serving.
• A recommendation engine using contextual bandit / UCB-style scoring with tag and
channel af nity.
• A full creator studio with video visibility controls (public, unlisted, private).
• A subscription feed, search, watch page with keyboard shortcuts, and channel pages.

2.4 Advantages of the Proposed System

• Full transparency — every layer of the stack is accessible and modi able.
• Demonstrates a complete RL-inspired feedback loop: observe → act → reward →
update policy.
• Secure streaming with two-layer veri cation (metadata route + le-serving
middleware).
• Modular codebase with clear separation of concerns across 58 les.
• Educational narrative suitable for academic submission while being production-
quality in architecture.

DEPARTMENT OF COMPUTER SCIENCE Page 8

fi
fi
fi
fl
fi
fi
fi
fi
fi
 Subhash Kumar - U03AI23S0104 2025-2026

2.5 Problem Formulation

The core problem is: how do you build a secure, intelligent, full-stack video platform using
only open-source tools? This breaks down into three sub-problems:

1. Security — How do you prevent unauthorized access to uploaded video les without
exposing them via static le serving?
2. Personalization — How do you recommend videos to users without a massive
dataset or a neural network?
3. Architecture — How do you organize a 58- le full-stack project so it remains
maintainable?

2.6 System Analysis

2.6.1 Functional Requirements

• Users must be able to register, log in, and authenticate via Google or Twitter OAuth.
• Users must be able to upload videos with real-time progress feedback.
• Users must be able to watch videos with keyboard shortcut support.
• The system must gate access to video les based on authentication and ownership.
• The system must generate personalized video recommendations.
• Creators must be able to manage their videos via a studio interface.
• Users must be able to search videos, subscribe to channels, and view a subscription
feed.

2.6.2 System Functionalities

• Auth Module: Registration, login, JWT issuance, Google/Twitter OAuth callbacks.

• Upload Module: Multipart form upload, XHR progress tracking, Cloudinary storage.
• Streaming Module: Custom [Link] middleware with path
sanitization, extension whitelisting, auth gating, and ownership veri cation.
• Recommendation Engine: Interaction schema, getUserState
aggregator, scoreVideos UCB scorer, /api/recommendations route,
sendBeacon event logging, of ine updateTagWeights cron.
• Watch Page: Video player, keyboard shortcuts, interaction event dispatch.
• Channel Page: Tabbed navigation (Videos, About, Playlists).
• Creator Studio: Video listing, edit, delete, visibility toggle.
• Search: URL-parameter-driven query with backend ltering.
• Subscription Feed: Aggregated feed of videos from subscribed channels.

DEPARTMENT OF COMPUTER SCIENCE Page 9

fi
fl
fi
fi
fi
fi
fi
 Subhash Kumar - U03AI23S0104 2025-2026

2.6.3 Non-Functional Requirements

• Performance: API responses should complete within 500ms under normal load.
• Security: No uploaded les should be served without authentication and ownership
veri cation.
• Scalability: The recommendation engine's UserPreference collection is
designed to persist across sessions and grow incrementally.
• Maintainability: All shared utilities (formatDuration, formatViews, timeAgo) are
centralized in [Link].
• Usability: The interface mirrors YouTube's UX patterns, reducing the learning curve
for end users.

2.6METHODOLOGY

This project is designed and developed based on the Waterfall Model. This model
particularly expresses the interaction between subsequent phases. In each phase of the
software development process, we have to compare results obtained against that which is
required. In all, quality has to be assessed and controlled.
Waterfall approach was first SDLC Model to be used widely in Software
Engineering to ensure success of the project. In "The Waterfall" approach, the whole process
of software development is divided into separate phases.
Main Following is a diagrammatic representation of different phases of waterfall model.

DEPARTMENT OF COMPUTER SCIENCE Page 10

fi
fi
 Subhash Kumar - U03AI23S0104 2025-2026

• The Requirements Specification of the project has collected with equipped manner.

• The project has designed with html pages to develop by using various commands.

• Implementation can be done with the basis of design and conceptual datas with codes
and scripts.

• Testing plays a important role to the process of verification and validation

• Deployment is done implement for future references.

• Maintainence can be done with the testing where it has to be validated in

unambiguous manner.

DEPARTMENT OF COMPUTER SCIENCE Page 11

Subhash Kumar - U03AI23S0104 2025-2026

Chapter -3
System Design and Development

DEPARTMENT OF COMPUTER SCIENCE Page 12

Subhash Kumar - U03AI23S0104 2025-2026

3.1 Data Flow Diagram

DEPARTMENT OF COMPUTER SCIENCE Page 13

Subhash Kumar - U03AI23S0104 2025-2026

3.2 ER- Diagram

DEPARTMENT OF COMPUTER SCIENCE Page 14

Subhash Kumar - U03AI23S0104 2025-2026

3.3 Structured Chart

DEPARTMENT OF COMPUTER SCIENCE Page 15

Subhash Kumar - U03AI23S0104 2025-2026

\3.4 DATABASE DESIGN

DEPARTMENT OF COMPUTER SCIENCE Page 16

Subhash Kumar - U03AI23S0104 2025-2026

3.5 Coding

3.5.1 USER REGISTRATION & LOGIN

REGISTER:

Step 1: User fills the form — userId, name, email, password, optional pfp

Step 2: Check if email already exists in database

if yes, stop and return error "Email already registered"

Step 3: Check if userId already exists

if yes, stop and return error "User ID already taken"

Step 4: Hash the password using bcrypt

Step 5: Save the new user to the database

Step 6: Database auto-runs two triggers:

- Creates a channel for this user

- Creates "Liked Videos" and "Watch Later" playlists

Step 7: Generate a JWT token valid for 7 days

Step 8: Return the user object and token to the frontend

Step 9: Frontend saves token to localStorage, updates auth state,

redirects to home page

DEPARTMENT OF COMPUTER SCIENCE Page 17

Subhash Kumar - U03AI23S0104 2025-2026

LOGIN:

Step 1: User enters email and password

Step 2: Find the user in the database by email

if not found, return "Invalid email or password"

Step 3: Compare the entered password with the stored hashed password

if does not match, return "Invalid email or password"

Step 4: Generate JWT token

Step 5: Return user object and token

Step 6: Frontend saves to localStorage and updates auth context

OAUTH LOGIN (Google / Twitter):

Step 1: User clicks "Continue with Google"

Step 2: Browser is redirected to Google's consent page

Step 3: User approves, Google sends profile data to the backend

Step 4: Check if a user with that email already exists

if yes, skip to Step 7

Step 5: Download the profile picture from Google and save it locally

Step 6: Create the new user in the database

(password is set to a random string they can never guess)

Step 7: Generate JWT token

Step 8: Redirect the browser to the frontend with token in the URL

Step 9: Frontend reads token from URL, saves to localStorage,

redirects to home page

DEPARTMENT OF COMPUTER SCIENCE Page 18

Subhash Kumar - U03AI23S0104 2025-2026

3.5.2 Personalised Home Feed

Step 1: Frontend requests GET /api/videos?page=1&limit=15

with the JWT token in the header

Step 2: Backend checks — does this user have any watch history?

IF no history (new user or guest):

Step 3a: Pick the top-scoring video from each category

Step 4a: Fill remaining slots with other trending videos

Step 5a: Return the result paginated

IF user has watch history:

Step 3b: Collect user signals from the database in parallel:

- Categories and tags of videos the user liked

- Channels the user is subscribed to

- How many times each category has been watched

Step 4b: Score every unwatched public video:

Step 5b: Split results into four groups:

Group A — best personalised matches

Group B — trending per category

Group C — latest from subscribed channels

Group D — discovery (random quality videos)

Step 6: Return the paginated slice to the frontend

Step 7: Frontend renders video cards

DEPARTMENT OF COMPUTER SCIENCE Page 19

Subhash Kumar - U03AI23S0104 2025-2026

3.5.3 Video Upload

Step 1: User selects a video file and fills in title, category etc.

Step 2: Frontend sends the form via XHR

XHR is used so we can track upload progress percentage

Step 3: As data uploads, frontend updates the progress bar

uploadProgress = bytes_sent / total_bytes * 100

Step 4: Backend receives the file through Multer middleware

Step 5: Generate a unique 11-character ID for this video

Check that this ID does not already exist in the database or on disk

If it does, generate another one (very rare but handled)

Step 6: Save the video file to /uploads/videos/<videoId>.mp4

Save the thumbnail to /uploads/thumbnails/<videoId>.jpg

Step 7: Insert a row into the videos table

Insert a row into the video_meta table (duration, tags, category)

Step 8: Database trigger fires automatically:

channel.video_count is incremented by 1

Step 9: Return the new videoId to the frontend

Step 10: Frontend navigates the user to /watch/<videoId>

DEPARTMENT OF COMPUTER SCIENCE Page 20

 Subhash Kumar - U03AI23S0104 2025-2026

3.5.3 Watch Session & View Count

The tracking is split into two steps because the user can leave at any time and we want to
know how much they actually watched.

Step 1: User opens the watch page

Frontend immediately sends POST /watch with watchDuration = 0

Backend inserts a new row in watch_history

Database trigger fires: [Link] + 1

Backend returns the row ID to the frontend

Step 2: Video plays. Frontend silently tracks:

currentTime on the video element

total duration of the video

Step 3: User leaves the page (navigates away or closes tab)

Frontend fires [Link]() with:

- the row ID from Step 1

- how many seconds were watched

- whether they watched more than 90% (completed = true/false)

sendBeacon is used because normal fetch can be cancelled

when the browser tab closes

Step 4: Backend updates the existing watch_history row

No additional view is counted — only the duration is updated

DEPARTMENT OF COMPUTER SCIENCE Page 21

Subhash Kumar - U03AI23S0104 2025-2026

3.5.3 Creator Studio

Step 1: User navigates to /studio

Frontend requests channel stats and video list in parallel

Step 2: Backend returns:

- total views, subscriber count, video count

- list of all videos with title, views, visibility, duration

Step 3: Home tab displays the stats cards and the latest 4 videos

Step 4: User clicks Content tab

Full video table is displayed

User can type in the search box to filter videos by title

Step 5a: User clicks Edit on a video

Navigates to /video/:videoId/edit (EditPage)

Step 5b: User clicks the Delete icon

A confirmation modal appears with the video title

and a warning that the action is permanent

Step 6: User clicks "Delete permanently" in the modal

Step 7: Frontend sends DELETE /api/videos/:videoId

Step 8: Backend verifies the requester owns the video

Deletes the video file and thumbnail from disk

Deletes the database row

Trigger fires: channel.video_count - 1

Step 9: Frontend removes the video row from the table immediately

DEPARTMENT OF COMPUTER SCIENCE Page 22

 Subhash Kumar - U03AI23S0104 2025-2026

3.6 System Overview

3.6.1 About the system
Fantube is a full-stack video-sharing web application modelled on the core functionality of
YouTube. It allows users to register, upload and manage videos, interact with content through
likes and comments, subscribe to channels, and discover new videos through a personalised
recommendation feed. The system is divided into two independent layers: a React-based
single-page application (SPA) on the frontend, and a [Link] REST API backed by a
PostgreSQL relational database on the backend.

The project demonstrates end-to-end full-stack development including authentication (JWT

and OAuth), file management, relational data modelling, database-level automation through
triggers, a content recommendation engine, and background job scheduling.

DEPARTMENT OF COMPUTER SCIENCE Page 23

Subhash Kumar - U03AI23S0104 2025-2026

Chapter -4
System Implementation

DEPARTMENT OF COMPUTER SCIENCE Page 24

 Subhash Kumar - U03AI23S0104 2025-2026

4.1 Hardware and Software Requirements

Hardware Requirements:-

• Processor : Intel Core i3 or equivalent (development)

• RAM : 4 GB minimum, 8 GB recommended

• Monitor : Required

• Keyboard : Required

• Mouse : Required

• Hard disk capacity : 10 GB free space

• Network. : Required

Software Requirements:-

• Operating System : Windows 7

• Front End : React 19, Vite, React Router DOM v7, CSS Modules

• Back End : [Link], [Link]

• Database : POSTGRESQL

• Authentication : JWT, [Link], Google OAuth2, Twitter OAuth

• Runtime. : [Link] v18+

DEPARTMENT OF COMPUTER SCIENCE Page 25

 Subhash Kumar - U03AI23S0104 2025-2026

4.2 TESTING

4.2.1 INTRODUCTION
Testing is a process, which reveals errors in the program. It is the major quality
measure employed during software development.
A series of tests are performed for the proposed system before the system was
ready for the implementation. The various types of testing done on the system are :
1. Unit Testing
2. Integration Testing
3. Validation Testing
4. Output Testing
5. User Acceptance Testing.

1. Unit Testing

Unit testing focuses verification effort on the smallest unit of software design
module. The testing was carried out during the coding stage itself. In this testing step
each module is found to be working satisfactory as regards to expected from module.
[Link] Testing

Integration testing is a systematic technique for constructing the program structure

while at the same time conducting tests to uncover errors associated with in the
interface. All the errors found in the system were corrected for the next testing steps.
3. Validation Testing

Validation testing can be defined as the testing which succeeds when the software
function in a manner that can be reasonable accepted by the user or the customer.
Software validation is achieved through a series of black box tests. The proposed
system under consideration has been tested by using validation testing and found to be
working satisfactorily.

DEPARTMENT OF COMPUTER SCIENCE Page 26

 Subhash Kumar - U03AI23S0104 2025-2026

4. Output Testing

After performing validation testing, the next step is output testing of the proposed
system. The output generated or displayed by system under consideration is tested by
comparing with format required by user. Hence, output testing does not result any
correction in the system.

[Link] Acceptance Testing

User acceptance of a system is a key factor for the success of any system. The system
under consideration was tested for user acceptance by constantly keeping in touch
with the prospective system users at the time of developing and making change
wherever required.

DEPARTMENT OF COMPUTER SCIENCE Page 27

 Subhash Kumar - U03AI23S0104 2025-2026

4.3SYSTEM MAINTAINENCE

About the Software

Introduction to FANTUBE

FANTUBE is a full-stack video sharing web application that replicates the core
functionality of YouTube. It is built using modern web technologies including
React 19 on the frontend and [Link] with Express on the backend, with
PostgreSQL as the relational database. FANTUBE is designed to provide users
with a seamless video browsing, uploading, and interaction experience through
a clean and responsive interface.

FANTUBE is available in the following functional modules, each serving a

distinct purpose within the platform:

Viewer Module: Allows registered users to browse, search, and watch videos.
Viewers can like, dislike, comment, reply to comments, subscribe to channels,
manage playlists, and view their watch history through the You page.

Creator Module: Allows users to upload videos, write titles and descriptions,
assign tags and categories, and set visibility to public, unlisted, or private.
Creators manage their content through the Creator Studio and customize their
channel through the Channel Customize page.

Channel Module: Every registered user automatically receives a personal

channel upon registration, created by a PostgreSQL trigger. The channel
displays the creator's videos, subscriber count, total views, banner, description,
and featured video.

Authentication Module: Handles user registration and login through email and
password, as well as social login via Google OAuth and Twitter OAuth using
[Link]. On successful login, a signed JSON Web Token is issued to the
client for all subsequent authenticated requests.

DEPARTMENT OF COMPUTER SCIENCE Page 28

 Subhash Kumar - U03AI23S0104 2025-2026

New Features:-

There are several key features available in FANTUBE that distinguish it as a

comprehensive video platform. The following are the major capabilities
available across all modules.

• Automatic channel creation on user registration via a PostgreSQL trigger,

requiring no additional action from the user.
• Automatic creation of default playlists — Liked Videos and Watch Later
for every new user, managed entirely by database triggers.
• Video visibility control with three states — public, unlisted, and private
enforced at both the API metadata route and the file streaming
middleware independently.
• Real-time like and dislike counts on videos and comments, maintained
automatically by PostgreSQL trigger functions on every insert, delete,
and update to the interactions and comment_interactions tables.
• Threaded comment system supporting top-level comments and nested
replies, with per-comment like and dislike counts maintained by triggers.
• Watch history tracking that records watch duration and completion status,
with view counts on videos and total view counts on channels updated
automatically via triggers on every watch history insert.
• Subscription system with subscriber counts on channels maintained
automatically by triggers on every subscribe and unsubscribe action.
• Creator Studio providing video management with inline editing of title,
description, tags, category, and visibility, along with video deletion that
cascades to all related records.
• Analytics snapshot system powered by a node-cron scheduled job that
writes hourly and daily snapshots of views, likes, dislikes, saves, and
comment counts to the video_snapshots table, enabling time-series charts
in the Creator Studio.

DEPARTMENT OF COMPUTER SCIENCE Page 29

Subhash Kumar - U03AI23S0104 2025-2026

New Functional Capabilities in FANTUBE:-

The following functional capabilities are implemented across the FANTUBE

platform:

• Playlist management allowing users to create, edit, and delete custom

playlists, add and remove videos, set playlist visibility, and save other
users' public playlists.
• Liked Videos playlist that automatically adds a video when a user likes it
and automatically removes it when the like is withdrawn, managed
entirely by a PostgreSQL trigger on the interactions table.
• Channel customization allowing creators to update their channel name,
banner image, description, and external links, and to set a featured video
displayed prominently on the channel home tab.
• Explore page providing a browsable discovery interface for public videos
outside the user's subscription network.
• Search functionality supporting global video search by title and
description using SQL ILIKE pattern matching, as well as tag-based
search through the video_meta table, with results filterable by relevance
and recency.
• OAuth callback handling for both Google and Twitter, with automatic
user creation on first login and seamless JWT issuance on subsequent
logins.
• Profile management allowing users to update their display name, handle,
and profile picture from the account settings page.
• Error handling through a dedicated ErrorPage component for 404 and
500 responses, and a centralized errorHandler middleware on the
backend that formats all API error responses consistently.

DEPARTMENT OF COMPUTER SCIENCE Page 30

 Subhash Kumar - U03AI23S0104 2025-2026

About the Database

Introduction to PostgreSQL
PostgreSQL is a powerful, free, and open-source object-rela onal database
management system with over 35 years of ac ve development. It is built
around a client-server architecture and is designed to handle a wide range of
workloads, from single-machine applica ons to data warehouses and web
services with many concurrent users. PostgreSQL is known for its strong
standards compliance, extensibility, and robust support for complex queries,
foreign keys, triggers, views, and stored procedures. FANTUBE uses PostgreSQL
as its sole database, with all thirteen applica on tables, indexes, triggers, and
u lity func ons de ned in a single migra on le [Link] and
executed via [Link].

The PostgreSQL System Consists of the Following Components

Server-side tools: These include the PostgreSQL database server

(postgres), which is the core engine responsible for data storage, query
execution, transaction management, and enforcing referential integrity.
Additional server-side tools include pg_dump for database backup,
pg_restore for recovery, vacuumdb for storage optimization, and
pg_ctl for server process management. In FANTUBE, the server also
executes ten PL/pgSQL trigger functions that automatically maintain data
consistency across tables without any application-layer intervention.

Client-side tools: These include the psql command-line client for interactive
query execution, pg_admin as a graphical management interface, and the
node-postgres (pg) npm package used by FANTUBE's [Link] backend
to send parameterized queries to the database over a connection pool. The pg
package provides the Pool class used in [Link], through which all
model les execute their SQL queries safely with automatic connection
management.

DEPARTMENT OF COMPUTER SCIENCE Page 31

ti
fi
ti
fi
ti
ti
ti
fi
ti
ti
 Subhash Kumar - U03AI23S0104 2025-2026

History and Evolution

PostgreSQL traces its origins to 1986 at the University of California, Berkeley,

where it began as the POSTGRES project led by Professor Michael Stonebraker
as a successor to the earlier INGRES database system. The project aimed to add
support for complex data types and active database concepts including rules and
triggers — features that were not available in relational databases of the time. In
1994, Andrew Yu and Jolly Chen added an SQL interpreter to the system, and
the project was renamed Postgres95. In 1996 it was renamed PostgreSQL to
re ect its full support for the SQL standard, and development was taken over by
a global community of volunteers known as the PostgreSQL Global
Development Group. PostgreSQL has since grown into one of the most
advanced open-source relational databases in the world, with major releases
continuing to add features such as logical replication, partitioning, JSON
support, and parallel query execution.

Features of PostgreSQL

PostgreSQL has always been designed around the principles of correctness,

reliability, and extensibility. The following are the most relevant features as
used in the FANTUBE project:

• ACID Compliance: PostgreSQL is fully ACID compliant — every transaction in

FANTUBE is Atomic, Consistent, Isolated, and Durable. This guarantees that
operations such as video uploads, subscription changes, and playlist modi cations
either complete fully or are rolled back entirely, leaving the database in a consistent
state at all times.

• Referential Integrity and Foreign Keys: All thirteen tables in FANTUBE's schema
are connected through foreign key constraints with appropriate cascade behaviors —
ON DELETE CASCADE removes child records automatically when a parent is
deleted, and ON DELETE SET NULL preserves child records while nullifying
the reference. This ensures no orphaned records exist in the database even when
videos or users are deleted.

DEPARTMENT OF COMPUTER SCIENCE Page 32

fl
fi
 Subhash Kumar - U03AI23S0104 2025-2026

• Indexing: PostgreSQL supports B-tree indexes for fast equality and range lookups.
FANTUBE de nes fourteen explicit indexes on frequently queried foreign key and
lter columns — including channel_id, user_id, video_id,
visibility, and published_at — ensuring that feed queries, search
queries, and studio queries remain performant as data grows.

• Array Data Types: PostgreSQL natively supports array columns, used in

FANTUBE's [Link] column for storing multiple external URLs and
in video_meta.tags for storing searchable tag arrays. Tag-based search
queries use PostgreSQL's array containment operator @> to match videos by tag.

• Ease of Use: PostgreSQL is supported by detailed of cial documentation, a large

developer community, and a wide ecosystem of client libraries and GUI tools. The
node-postgres package used in FANTUBE requires minimal con guration —
a connection string and a pool size — making it straightforward to integrate into any
[Link] application. The psql CLI and pgAdmin GUI make it easy to manage

• Multi-User Support: PostgreSQL is a full multi-user system capable of handling

many simultaneous client connections. FANTUBE uses a connection pool via the
[Link] class, which maintains a con gurable number of persistent connections
to the database and distributes incoming API requests across them, preventing
connection overhead on every request while safely supporting concurrent users
watching, uploading, and interacting at the same time.

• Scalability: PostgreSQL can handle databases with billions of rows across hundreds
of tables without signi cant performance degradation when properly indexed and
maintained. For FANTUBE's scale, the combination of explicit indexes, trigger-
managed counters (avoiding expensive COUNT queries at read time), and the
snapshot system for analytics ensures the application remains responsive as the
volume of videos, watch history records, and interaction records grows.

• Portability:PostgreSQL is available on all major operating systems including

Linux, macOS, and Windows. It runs on a wide range of hardware from
development laptops to production servers. FANTUBE's database layer is fully
portable — the entire schema is de ned in a single [Link] le that can be
executed on any PostgreSQL instance on any platform without modi cation.

• Reliability: PostgreSQL is designed for high availability and data durability. It uses
write-ahead logging (WAL) to ensure that committed transactions survive crashes. It
has been deployed in production by companies including Apple, Fujitsu, Red Hat,
Cisco, and Skype, and is used as the backend database for platforms handling
millions of concurrent users. For FANTUBE, PostgreSQL's reliability guarantees
that interaction data, watch history, and video metadata are never lost even in the
event of an unexpected server restart.
DEPARTMENT OF COMPUTER SCIENCE Page 33
fi
fi
fi
fi
fi
fi
fi
fi
fi
Subhash Kumar - U03AI23S0104 2025-2026

Chapter -5
A Session with Software

DEPARTMENT OF COMPUTER SCIENCE Page 34

Subhash Kumar - U03AI23S0104 2025-2026

5.1 SCREENSHOTS

5.1.1 Home Page

The Homepage serves as the main landing page of FanTube, displaying a

personalized video feed based on user interests and viewing history. It
provides quick access to recommended content, trending videos, and
subscribed channels.

DEPARTMENT OF COMPUTER SCIENCE Page 35

Subhash Kumar - U03AI23S0104 2025-2026

5.1.2 Explore Page

The Explore Page showcases trending and popular videos across

different categories. It helps users discover new content, creators, and
topics currently gaining attention on the platform.

DEPARTMENT OF COMPUTER SCIENCE Page 36

Subhash Kumar - U03AI23S0104 2025-2026

5.1.3 Studio Page - Home

The Studio Home Page acts as the creator dashboard, providing an

overview of channel performance, recent uploads, analytics, and important
updates. It enables creators to monitor and manage their content
efficiently.

DEPARTMENT OF COMPUTER SCIENCE Page 37

Subhash Kumar - U03AI23S0104 2025-2026

5.1.4 Studio Page - Content

The Studio Content Page displays all uploaded videos and shorts in a
structured format. Creators can manage, filter, edit, or delete content
while viewing key performance metrics.

DEPARTMENT OF COMPUTER SCIENCE Page 38

Subhash Kumar - U03AI23S0104 2025-2026

5.1.5 Video Edit Page

The Video Edit Page allows creators to modify video details such as
title, description, thumbnail, visibility, and tags. It provides essential
tools for optimizing content before publishing.

DEPARTMENT OF COMPUTER SCIENCE Page 39

Subhash Kumar - U03AI23S0104 2025-2026

5.1.6 Channel Page

The Channel Page presents a creator’s public profile, including uploaded

videos, channel information, subscriber count, and playlists. It serves as
the central hub for viewers to explore a creator's content.

DEPARTMENT OF COMPUTER SCIENCE Page 40

Subhash Kumar - U03AI23S0104 2025-2026

5.1.7 Channel Customization Page

The Channel Customization Page enables creators to personalize their

channel appearance and branding. Users can update profile images,
banners, channel descriptions, and other presentation settings.

DEPARTMENT OF COMPUTER SCIENCE Page 41

Subhash Kumar - U03AI23S0104 2025-2026

5.1.8 Search Page

The Search Page displays results based on user queries, helping viewers
quickly find relevant videos, channels, and content. It includes filtering
and sorting options for improved content discovery.

DEPARTMENT OF COMPUTER SCIENCE Page 42

Subhash Kumar - U03AI23S0104 2025-2026

5.1.9 You Page - Home

The You Page provides a personalized user dashboard containing

watch history, playlists, saved content, and account-related
information. It offers convenient access to frequently used features.

DEPARTMENT OF COMPUTER SCIENCE Page 43

Subhash Kumar - U03AI23S0104 2025-2026

5.1.10 You Page - Liked Videos

The Likes section displays all videos that the user has liked or saved
through interactions. It allows users to revisit and manage their
favorite content easily.

DEPARTMENT OF COMPUTER SCIENCE Page 44

Subhash Kumar - U03AI23S0104 2025-2026

5.1.11 Subscription Page

The Subscription Page shows the latest uploads from channels that the
user follows. It provides a focused content feed, ensuring users stay
updated with their subscribed creators.

DEPARTMENT OF COMPUTER SCIENCE Page 45

Subhash Kumar - U03AI23S0104 2025-2026

Chapter -6
Conclusion

DEPARTMENT OF COMPUTER SCIENCE Page 46

 Subhash Kumar - U03AI23S0104 2025-2026

CONCLUSION
FANTUBE successfully demonstrates the design and development of a
production-quality, full-stack video-sharing platform from scratch. The project
covers the complete software lifecycle — from requirements gathering and
system design to implementation, testing, and deployment. Key technical
achievements include a secure two-layer video streaming architecture, a
contextual bandit recommendation engine that implements the full RL observe-
act-reward-update loop, and a clean modular codebase spanning 58 files across
frontend and backend.

The project proves that modern web technologies — React, [Link], Express,
PostgreSQL, and Cloudinary — are fully capable of supporting a complex, real-
world application at a college project scale, without relying on any paid
proprietary infrastructure.

6.1 FUTURE ENHACEMENTS

• Real-time features: Live comments using WebSockets or [Link].
• Neural recommendation: Upgrading the UCB scorer to a lightweight
collaborative ltering model using [Link].
• Video transcoding: Adding FFmpeg-based transcoding to support adaptive
bitrate streaming (HLS).
• Noti cations system: Subscription and like noti cations using a message
queue.
• Mobile app: React Native port of the frontend for iOS and Android.
• Analytics dashboard: Per-video analytics in the creator studio (views over
time, watch duration, drop-off rate).

DEPARTMENT OF COMPUTER SCIENCE Page 47

fi
fi
fi
Subhash Kumar - U03AI23S0104 2025-2026

REFERENCES

React Documentation — [Link]

Vite Documentation — [Link]
React Router DOM v7 Documentation — [Link]
[Link] Documentation — [Link]
[Link] Documentation — [Link]
PostgreSQL Documentation — [Link]
node-postgres (pg) Documentation — [Link]
[Link] Documentation — [Link]
Passport-Google-OAuth2 Strategy — [Link]
passport-google-oauth2
Passport-Twitter Strategy — [Link]
twitter
JSON Web Token Introduction — [Link]
Multer — [Link] Middleware for File Uploads — [Link]
expressjs/multer
node-cron Documentation — [Link]
Axios HTTP Client Documentation — [Link]
MDN Web Docs — HTML5 Video Element — [Link]
en-US/docs/Web/HTML/Element/video
MDN Web Docs — [Link] API — https://
[Link]/en-US/docs/Web/API/Navigator/sendBeacon
Auer, P., Cesa-Bianchi, N., & Fischer, P. (2002). Finite-time Analysis of the
Multiarmed Bandit Problem. Machine Learning, 47(2), 235–256. (UCB
algorithm reference for recommendation engine)
PostgreSQL Trigger Functions Reference — [Link]
docs/current/[Link]

DEPARTMENT OF COMPUTER SCIENCE Page 48