PDF selling

byUtkarsh Raj

Act as a senior MERN Stack architect and full-stack developer. Help me build a production-ready Digital Document Marketplace where owners can upload and sell digital documents, and users can securely purchase and view them online. Project Overview Build a responsive web application using: - MongoDB - Express.js - React.js - Node.js - Tailwind CSS The application should be scalable, secure, modular, and deployment-ready. User Roles There are only two roles: - USER - OWNER Use the same Signup and Login pages for both roles. Every new account is created as a USER by default. I will manually change a user's role to OWNER directly in the database. There should be no public owner registration. After login: - OWNER → Owner Dashboard - USER → User Dashboard / Marketplace Implement proper authentication and role-based authorization. Authentication Implement: - JWT Authentication - HTTP-only Cookies - bcrypt Password Hashing - Protected Routes - Authentication & Authorization Middleware - Persistent Login - Logout - Secure Validation and Error Handling Owner Dashboard Owners can: - Upload documents - Edit documents - Delete documents - Publish/Unpublish documents - Set title, description, category, tags, thumbnail - Set document price (INR) - Mark document as Free or Paid - View uploaded documents - View purchases and revenue - View customers who purchased their documents Each owner should only manage their own uploaded documents. Supported File Types Owners can upload documents such as: - PDF - DOC/DOCX - XLS/XLSX - PPT/PPTX - Markdown (.md) - TXT - Other safe document formats Validate file type, extension, MIME type, size, and reject unsafe files. Secure Online Viewer Purchased documents should only be viewable inside the web application. Users must not receive the original file. Use a secure document viewer: - PDF → PDF.js or equivalent - Other formats → convert to browser-viewable format when required Store original files privately. Only: - Owner - Purchased User can access the complete document. Non-purchasers should only see: - Thumbnail - Title - Description - Price - Limited preview (optional) Download Protection The platform should be designed for online viewing only. Do not expose the original file URL or provide a download button. Implement reasonable protection including: - Authenticated document streaming - Temporary signed URLs - Dynamic watermark - Access validation - Access logs - Session validation Understand that browsers cannot completely prevent screenshots or screen recording. Marketplace Users can: - Browse documents - Search - Filter - Sort - View details - Purchase documents - Access free documents - View My Library - View purchased documents online - View purchase history A paid document must remain locked until payment is successfully verified. Payment Primary currency: INR. Use Razorpay (preferred) for: - UPI - Cards - Net Banking - Wallets Keep payment architecture flexible so Stripe can be added later. Payment Flow: 1. User clicks Buy. 2. Backend creates payment order. 3. User completes payment. 4. Backend verifies payment. 5. Store purchase record. 6. Grant access. 7. Add document to My Library. Never trust frontend payment success. Handle: - Success - Failure - Cancellation - Duplicate payments - Duplicate webhooks - Refunds - Invalid signatures Security Implement: - Helmet - CORS - Rate Limiting - Secure Cookies - Environment Variables - Centralized Error Handling - Strong Validation - File Upload Validation - Private File Storage - Payment Verification - Role-Based Authorization - Audit Logs Prevent unauthorized document access and direct file exposure. Deployment Prepare for production deployment using: - React on Vercel/Netlify/Render - Node.js Backend on Render/Railway/AWS - MongoDB Atlas - Private Cloud Storage (AWS S3 or Cloudflare R2 preferred) - Razorpay Payment Gateway Configure: - HTTPS - Environment Variables - Production CORS - Secure Cookies - Logging - Monitoring - Backup Strategy Development Rules Do not generate the complete project at once. Build the project phase-by-phase. For every phase: - Explain what is being built. - Explain why it is needed. - Explain technical terms simply. - Mention alternatives where appropriate. - Write production-quality, modular code. - Follow best practices. - Include validation, authorization, security, and proper error handling. Do not change the business workflow unless necessary, and always explain why before making changes. Start by understanding the requirements, then design the architecture, define APIs, and finally implement the project step by step until deployment.

Landing
Landing

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 5

PDF Selling System Requirements Document

1. Introduction

The PDF Selling project aims to create a digital document marketplace where document owners can upload and sell their digital documents, and users can securely purchase and view them online. This document outlines the system requirements for building a scalable, secure, and modular web application using the MERN stack.

2. System Overview

The PDF Selling application will be a responsive web application built using MongoDB, Express.js, React.js, Node.js, and Tailwind CSS. The application will support two user roles: USER and OWNER. It will include features such as secure document viewing, payment processing, and role-based access control.

Page 2 of 5

3. Functional Requirements as Story Points

  • As a USER, I should be able to sign up and log in using the same pages as OWNERs.
  • As a USER, I should be able to browse, search, filter, and sort documents in the marketplace.
  • As a USER, I should be able to view document details, including thumbnail, title, description, price, and limited preview.
  • As a USER, I should be able to purchase documents using Razorpay with INR as the primary currency.
  • As a USER, I should be able to access free documents and view my purchased documents online.
  • As a USER, I should be able to view my purchase history and manage my library.
  • As an OWNER, I should be able to upload, edit, delete, publish, and unpublish documents.
  • As an OWNER, I should be able to set document title, description, category, tags, thumbnail, and price.
  • As an OWNER, I should be able to mark documents as Free or Paid.
  • As an OWNER, I should be able to view uploaded documents, purchases, revenue, and customers who purchased my documents.
  • As an OWNER, I should only manage my own uploaded documents.
  • As a USER or OWNER, I should be able to log out securely.
  • As a USER or OWNER, I should experience secure authentication and role-based authorization.

4. User Personas

  • USER: A general user who can browse, purchase, and view documents in the marketplace.
  • OWNER: A document owner who can upload, manage, and sell their documents.

5. Core User Flows

  • USER signs up/logs in → Browses marketplace → Views document details → Purchases document → Views purchased document in My Library.
  • OWNER logs in → Uploads document → Sets document details → Publishes document → Manages uploaded documents and views revenue.
Page 3 of 5

6. Visuals Colors and Theme

  • primary: #1A202C (dark blue-gray)
  • primary_light: #2D3748 (lighter blue-gray)
  • secondary: #718096 (gray)
  • accent: #E53E3E (red for CTAs and active states)
  • highlight: #38B2AC (teal for hover states and notifications)
  • bg: #F7FAFC (light gray for background)
  • surface: #FFFFFF (white for cards/panels)
  • text: #2D3748 (dark gray for primary text)
  • text_muted: #A0AEC0 (muted gray for secondary text)
  • border: #CBD5E0 (light gray for borders)

7. Signature Design Concept

Interactive Document Marketplace

The homepage will feature an interactive document marketplace where users can explore documents in a dynamic grid layout. Each document card will "flip" to reveal more details when hovered over. The grid will be animated using motion/react for smooth transitions. Users can drag and drop document cards to rearrange their view, creating a personalized browsing experience.

Page 4 of 5

Landing Hero Motion Brief

The landing hero will depict a digital document transforming into a vibrant, interactive marketplace. The animation will start with a single document icon that multiplies into a grid of documents, symbolizing the marketplace's growth. As users scroll, the documents will animate into their respective categories, showcasing the platform's organization and accessibility. The animation will loop every 10 seconds, with a reduced-motion option for accessibility.

8. Interaction Model & Motion Direction

  • Interaction Model: Animated
  • The landing page will feature moderate scroll-triggered reveals and hover transitions. Document cards will have spring physics for interactive elements, enhancing the user experience.

9. Non-Functional Requirements

  • The application must be scalable to handle increasing user and document volumes.
  • It must ensure high security standards, including data protection and secure transactions.
  • The system should be modular to facilitate easy updates and maintenance.
  • It should be deployment-ready with a focus on performance optimization.
Page 5 of 5

10. Tech Stack

  • Frontend: React.js, Tailwind CSS
  • Backend: Node.js, Express.js
  • Database: MongoDB
  • Payment Gateway: Razorpay
  • Deployment: Vercel/Netlify/Render for frontend, Render/Railway/AWS for backend, MongoDB Atlas for database, AWS S3 or Cloudflare R2 for storage

11. Assumptions and Constraints

  • All users will initially be created as USERs, with OWNER roles assigned manually in the database.
  • The application will primarily target the Indian market, with INR as the default currency.
  • The platform will not support document downloads to ensure content protection.

12. Glossary

  • USER: A general user of the platform who can purchase and view documents.
  • OWNER: A user with permissions to upload and manage documents for sale.
  • JWT: JSON Web Token, used for secure authentication.
  • Razorpay: A payment gateway supporting various payment methods in India.
  • MERN Stack: A technology stack comprising MongoDB, Express.js, React.js, and Node.js.

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View Info
Login: Sign In
Dashboard: View Uploads
Dashboard: Upload Document
Upload: Set Details
Upload: Publish Document
Dashboard: Edit Document
Dashboard: Delete Document
Dashboard: Unpublish Document
Dashboard: View Revenue
Dashboard: View Customers
Profile: Logout

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View Info
Login: Sign In
Dashboard: View Uploads
Dashboard: Upload Document
Upload: Set Details
Upload: Publish Document
Dashboard: Edit Document
Dashboard: Delete Document
Dashboard: Unpublish Document
Dashboard: View Revenue
Dashboard: View Customers
Profile: Logout