Welcome to DocuThinker! This is a full-stack (FERN-Stack) application that integrates an AI-powered document processing backend with a React-based frontend. The app allows users to upload documents for summarization, generate key insights, and chat with an AI based on the documentβs content.
The DocuThinker app is designed to provide users with a simple, AI-powered document management tool. Users can upload PDFs or Word documents and receive summaries, key insights, and discussion points. Additionally, users can chat with an AI using the documentβs content for further clarification.
DocuThinker is created using the FERN-Stack architecture, which stands for Firebase, Express, React, and Node.js. The backend is built with Node.js and Express, integrating Firebase for user authentication and MongoDB for data storage. The frontend is built with React and Material-UI, providing a responsive and user-friendly interface.
graph LR
U[Client's Browser] -->|HTTPS| N[NGINX - SSL, Routing, Caching]
N -->|static calls| A[React Frontend]
N -->|/api/* proxy| B[Express Backend]
A -->|REST API calls| N
B --> C[Firebase Auth]
B --> D[Firestore]
B --> E[MongoDB]
B --> F[Redis Cache]
B --> G[AI/ML Services]
A --> H[Material-UI]
A --> I[React Router]
G --> J[Google Cloud APIs]
G --> K[LangChain]
[!IMPORTANT] It is currently deployed live on Vercel and Render. You can access the live app here.
Feel free to explore the app, upload documents, and interact with the AI! For architecture details, setup instructions, and more, please refer to the sections below, as well as the ARCHITECTURE.md file.
[!TIP] Access the live app at https://docuthinker.vercel.app/ by clicking on the link or copying it into your browser! π
We have deployed the entire app on Vercel and AWS. You can access the live app here.
aws/ directory. Itβs a one-click deployment using AWS Fargate.[!IMPORTANT] The backend server may take a few seconds to wake up if it has been inactive for a while. The first API call may take a bit longer to respond. Subsequent calls should be faster as the server warms up.
DocuThinker offers a wide range of features to help users manage and analyze their documents effectively. Here are some of the key features of the app:
DocuThinker features a clean and intuitive user interface designed to provide a seamless experience for users. The app supports both light and dark themes, responsive design, and easy navigation. Here are some screenshots of the app:
The DocuThinker app is organized into separate subdirectories for the frontend, backend, and mobile app. Each directory contains the necessary files and folders for the respective components of the app. Here is the complete file structure of the app:
DocuThinker-AI-App/
βββ ai_ml/ # AI/ML pipelines & services directory
βββ backend/
β βββ middleware/
β β βββ jwt.js # Authentication middleware with JWT for the app's backend
β βββ controllers/
β β βββ controllers.js # Controls the flow of data and logic
β βββ graphql/
β β βββ resolvers.js # Resolvers for querying data from the database
β β βββ schema.js # GraphQL schema for querying data from the database
β βββ models/
β β βββ models.js # Data models for interacting with the database
β βββ services/
β β βββ services.js # Models for interacting with database and AI/ML services
β βββ views/
β β βββ views.js # Output formatting for success and error responses
β βββ redis/
β β βββ redisClient.js # Redis client for caching data in-memory
β βββ swagger/
β β βββ swagger.js # Swagger documentation for API endpoints
β βββ .env # Environment variables (git-ignored)
β βββ firebase-admin-sdk.json # Firebase Admin SDK credentials (git-ignored)
β βββ index.js # Main entry point for the server
β βββ Dockerfile # Docker configuration file
β βββ manage_server.sh # Shell script to manage and start the backend server
β βββ README.md # Backend README file
β
βββ frontend/
β βββ public/
β β βββ index.html # Main HTML template
β β βββ manifest.json # Manifest for PWA settings
β βββ src/
β β βββ assets/ # Static assets like images and fonts
β β β βββ logo.png # App logo or images
β β βββ components/
β β β βββ ChatModal.js # Chat modal component
β β β βββ Spinner.js # Loading spinner component
β β β βββ UploadModal.js # Document upload modal component
β β β βββ Navbar.js # Navigation bar component
β β β βββ Footer.js # Footer component
β β β βββ GoogleAnalytics.js # Google Analytics integration component
β β βββ pages/
β β β βββ Home.js # Home page where documents are uploaded
β β β βββ LandingPage.js # Welcome and information page
β β β βββ Login.js # Login page
β β β βββ Register.js # Registration page
β β β βββ ForgotPassword.js # Forgot password page
β β β βββ HowToUse.js # Page explaining how to use the app
β β βββ App.js # Main App component
β β βββ index.js # Entry point for the React app
β β βββ App.css # Global CSS 1
β β βββ index.css # Global CSS 2
β β βββ reportWebVitals.js # Web Vitals reporting
β β βββ styles.css # Custom styles for different components
β β βββ config.js # Configuration file for environment variables
β βββ .env # Environment variables file (e.g., REACT_APP_BACKEND_URL)
β βββ package.json # Project dependencies and scripts
β βββ craco.config.js # Craco configuration file
β βββ Dockerfile # Docker configuration file
β βββ manage_frontend.sh # Shell script for managing and starting the frontend
β βββ README.md # Frontend README file
β βββ package.lock # Lock file for dependencies
β
βββ mobile-app/ # Mobile app directory
β βββ app/ # React Native app directory
β βββ .env # Environment variables file for the mobile app
β βββ app.json # Expo configuration file
β βββ components/ # Reusable components for the mobile app
β βββ assets/ # Static assets for the mobile app
β βββ constants/ # Constants for the mobile app
β βββ hooks/ # Custom hooks for the mobile app
β βββ scripts/ # Scripts for the mobile app
β βββ babel.config.js # Babel configuration file
β βββ package.json # Project dependencies and scripts
β βββ tsconfig.json # TypeScript configuration file
β
βββ aws/ # AWS deployment assets (ECR/ECS/CloudFormation/CDK)
β βββ README.md
β βββ cloudformation/
β β βββ fargate-service.yaml # Reference Fargate stack for backend + ai_ml services
β βββ infrastructure/
β β βββ cdk-app.ts # CDK entrypoint
β β βββ lib/docuthinker-stack.ts # CDK stack definition
β βββ scripts/
β βββ local-env.sh # Helper to mirror production env vars locally
βββ kubernetes/ # Kubernetes configuration files
β βββ manifests/ # Kubernetes manifests for deployment, service, and ingress
β βββ backend-deployment.yaml # Deployment configuration for the backend
β βββ backend-service.yaml # Service configuration for the backend
β βββ frontend-deployment.yaml # Deployment configuration for the frontend
β βββ frontend-service.yaml # Service configuration for the frontend
β βββ firebase-deployment.yaml # Deployment configuration for Firebase
β βββ firebase-service.yaml # Service configuration for Firebase
β βββ configmap.yaml # ConfigMap configuration for environment variables
β
βββ nginx/
β βββ nginx.conf # NGINX configuration file for load balancing and caching
β βββ Dockerfile # Docker configuration file for NGINX
β
βββ images/ # Images for the README
βββ .env # Environment variables file for the whole app
βββ docker-compose.yml # Docker Compose file for containerization
βββ jsconfig.json # JavaScript configuration file
βββ package.json # Project dependencies and scripts
βββ package-lock.json # Lock file for dependencies
βββ postcss.config.js # PostCSS configuration file
βββ tailwind.config.js # Tailwind CSS configuration file
βββ render.yaml # Render configuration file
βββ vercel.json # Vercel configuration file
βββ openapi.yaml # OpenAPI specification for API documentation
βββ manage_docuthinker.sh # Shell script for managing and starting the app (both frontend & backend)
βββ .gitignore # Git ignore file
βββ LICENSE.md # License file for the project
βββ README.md # Comprehensive README for the whole app
βββ (and many more files...) # Additional files and directories not listed here
Ensure you have the following tools installed:
.env file - but you should obtain your own API keys for production).Additionally, basic fullstack development knowledge and AI/ML concepts are recommended to understand the appβs architecture and functionalities.
Clone the repository:
git clone https://github.com/hoangsonww/DocuThinker-AI-App.git
cd DocuThinker-AI-App/backend
Navigate to the frontend directory:
cd frontend
Install dependencies:
npm install
Or npm install --legacy-peer-deps if you face any peer dependency issues.
npm start
Build the Frontend React app (for production):
npm run build
yarn to install dependencies and run the app:
yarn install
yarn start
Or, for your convenience, if you have already installed the dependencies, you can directly run the app in the root directory using:
npm run frontend
This way, you donβt have to navigate to the frontend directory every time you want to run the app.
http://localhost:3000. You can now access it in your browser.[!NOTE] Note that this is optional since we are deploying the backend on Render. However, you can (and should) run the backend locally for development purposes.
backend) directory:
cd backend
npm install
Or npm install --legacy-peer-deps if you face any peer dependency issues.
npm run server
http://localhost:3000. You can access the API endpoints in your browser or Postman.backend directory. Feel free to explore the API endpoints and controllers.[!CAUTION] Note: Be sure to use Node v.20 or earlier to avoid compatibility issues with Firebase Admin SDK.
cd mobile-app
npm install
npx expo start
The backend of DocuThinker provides several API endpoints for user authentication, document management, and AI-powered insights. These endpoints are used by the frontend to interact with the backend server:
| Method | Endpoint | Description |
|---|---|---|
| POST | /register |
Register a new user in Firebase Authentication and Firestore, saving their email and creation date. |
| POST | /login |
Log in a user and return a custom token along with the user ID. |
| POST | /upload |
Upload a document for summarization. If the user is logged in, the document is saved in Firestore. |
| POST | /generate-key-ideas |
Generate key ideas from the document text. |
| POST | /generate-discussion-points |
Generate discussion points from the document text. |
| POST | /chat |
Chat with AI using the original document text as context. |
| POST | /forgot-password |
Reset a userβs password in Firebase Authentication. |
| POST | /verify-email |
Verify if a userβs email exists in Firestore. |
| GET | /documents/{userId} |
Retrieve all documents associated with the given userId. |
| GET | /documents/{userId}/{docId} |
Retrieve a specific document by userId and docId. |
| GET | /document-details/{userId}/{docId} |
Retrieve document details (title, original text, summary) by userId and docId. |
| DELETE | /delete-document/{userId}/{docId} |
Delete a specific document by userId and docId. |
| DELETE | /delete-all-documents/{userId} |
Delete all documents associated with the given userId. |
| POST | /update-email |
Update a userβs email in both Firebase Authentication and Firestore. |
| POST | /update-password |
Update a userβs password in Firebase Authentication. |
| GET | /days-since-joined/{userId} |
Get the number of days since the user associated with userId joined the service. |
| GET | /document-count/{userId} |
Retrieve the number of documents associated with the given userId. |
| GET | /user-email/{userId} |
Retrieve the email of a user associated with userId. |
| POST | /update-document-title |
Update the title of a document in Firestore. |
| PUT | /update-theme |
Update the theme of the app. |
| GET | /user-joined-date/{userId} |
Get date when the user associated with userId joined the service. |
| GET | /social-media/{userId} |
Get the social media links of the user associated with userId. |
| POST | /update-social-media |
Update the social media links of the user associated with userId. |
| POST | /update-profile |
Update the userβs profile information. |
| POST | /update-document/{userId}/{docId} |
Update the document details in Firestore. |
| POST | /update-document-summary |
Update the summary of a document in Firestore. |
| POST | /sentiment-analysis |
Analyzes the sentiment of the provided document text |
| POST | /bullet-summary |
Generates a summary of the document text in bullet points |
| POST | /summary-in-language |
Generates a summary in the specified language |
| POST | /content-rewriting |
Rewrites or rephrases the provided document text based on a style |
| POST | /actionable-recommendations |
Generates actionable recommendations based on the document text |
| GET | /graphql |
GraphQL endpoint for querying data from the database |
More API endpoints will be added in the future to enhance the functionality of the app. Feel free to explore the existing endpoints and test them using Postman or Insomnia.
[!NOTE] This list is not exhaustive. For a complete list of API endpoints, please refer to the Swagger or Redoc documentation of the backend server.
http://localhost:5000/api-docs.http://localhost:5000/api-docs/redoc.For example, our API endpoints documentation looks like this:
Additionally, we also offer API file generation using OpenAPI. You can generate API files using the OpenAPI specification. Here is how:
npx openapi-generator-cli generate -i http://localhost:5000/api-docs -g typescript-fetch -o ./api
This will generate TypeScript files for the API endpoints in the api directory. Feel free to replace or modify the command as needed.
/upload endpoint by sending a POST request with the document file as a form-data parameter.curl --location --request POST 'http://localhost:3000/register' \
--header 'Content-Type: application/json' \
--data-raw '{
"email": "test@example.com",
"password": "password123"
}'
curl --location --request POST 'http://localhost:3000/upload' \
--header 'Authorization: Bearer <your-token>' \
--form 'File=@"/path/to/your/file.pdf"'
The backend APIs uses centralized error handling to capture and log errors. Responses for failed requests are returned with a proper status code and an error message:
{
"error": "An internal error occurred",
"details": "Error details go here"
}
Our ai_ml/ package wraps LangGraph, CrewAI, and multi-provider LLMs inside a reusable DocumentIntelligenceService. It now supports:
ai_ml/services/orchestrator.py, ai_ml/pipelines/rag_graph.py).ai_ml/providers/registry.py).ai_ml/graph/neo4j_client.py) and Chroma vector memory (ai_ml/vectorstores/chroma_store.py) via DOCUTHINKER_SYNC_GRAPH / DOCUTHINKER_SYNC_VECTOR env flags.graph LR
Client --> API(Backend API)
API --> SVC(DocumentIntelligenceService)
SVC --> PIPE(AgenticRAGPipeline)
PIPE --> CREW(CrewAI Team)
PIPE --> RETR(Vector Tools)
SVC --> NEO(Neo4j)
SVC --> CHR(ChromaDB)
CREW --> OAI(OpenAI)
CREW --> CLAUDE(Anthropic)
CREW --> GEM(Gemini)
RETR --> HF(Embeddings)
[!TIP] Set
DOCUTHINKER_SYNC_GRAPH=trueandDOCUTHINKER_SYNC_VECTOR=trueto persist analyses; the MCP tools exposevector_upsert,vector_search,graph_upsert, andgraph_queryfor external agents.
graph TD
A[Client Request] -->|HTTP/HTTPS| B[Express Server]
B --> C{Route Handler}
C -->|Auth Routes| D[User Controller]
C -->|Document Routes| E[Document Controller]
C -->|AI Routes| F[AI Controller]
D --> G[Firebase Auth]
E --> H[Firestore DB]
F --> I[AI/ML Services]
I --> J[Google Cloud NLP]
I --> K[LangChain]
I --> L[Custom Models]
B --> M[Redis Cache]
B --> N[RabbitMQ Queue]
G --> O[Response Formatter]
H --> O
J --> O
K --> O
L --> O
O --> P[JSON Response]
[!TIP] Visit the
ai_ml/README.mdfile for more details on the AI/ML architecture.
Our application supports a fully-featured GraphQL API that allows clients to interact with the backend using flexible queries and mutations. This API provides powerful features for retrieving and managing data such as users, documents, and related information.
https://docuthinker-app-backend-api.vercel.app/graphql
Or, if you are running the backend locally, the endpoint will be:
http://localhost:3000/graphql
Testing the API:
You can use the built-in GraphiQL Interface to test queries and mutations. Simply visit the endpoint in your browser.
You should see the following interface:
Now you can start querying the API using the available fields and mutations. Examples are below for your reference.
This query retrieves a userβs email and their documents, including titles and summaries:
query GetUser {
getUser(id: "USER_ID") {
id
email
documents {
id
title
summary
}
}
}
Retrieve details of a document by its ID:
query GetDocument {
getDocument(userId: "USER_ID", docId: "DOCUMENT_ID") {
id
title
summary
originalText
}
}
Create a user with an email and password:
mutation CreateUser {
createUser(email: "example@domain.com", password: "password123") {
id
email
}
}
Change the title of a specific document:
mutation UpdateDocumentTitle {
updateDocumentTitle(userId: "USER_ID", docId: "DOCUMENT_ID", title: ["Updated Title.pdf"]) {
id
title
}
}
Delete a document from a userβs account:
mutation DeleteDocument {
deleteDocument(userId: "USER_ID", docId: "DOCUMENT_ID")
}
errors field in the response.For more information about GraphQL, visit the official documentation. If you encounter any issues or have questions, feel free to open an issue in our repository.
The DocuThinker mobile app is built using React Native and Expo. It provides a mobile-friendly interface for users to upload documents, generate summaries, and chat with an AI. The mobile app integrates with the backend API to provide a seamless experience across devices.
Currently, it is in development and will be released soon on both the App Store and Google Play Store.
Stay tuned for the release of the DocuThinker mobile app!
Below is a screenshot of the mobile app (in development):
The DocuThinker app can be containerized using Docker for easy deployment and scaling. Follow these steps to containerize the app:
docker compose up --build
You can also view the image in the Docker Hub repository here.
graph TB
A[Docker Compose] --> B[Frontend Container]
A --> C[Backend Container]
A --> D[Redis Container]
A --> E[MongoDB Container]
A --> F[NGINX Container]
B -->|Port 3000| G[React App]
C -->|Port 5000| H[Express Server]
D -->|Port 6379| I[Redis Cache]
E -->|Port 27017| J[MongoDB Database]
F -->|Port 80/443| K[Load Balancer]
K --> B
K --> C
The DocuThinker app is deployed using a combination of Vercel, Render, and AWS ECS Fargate. The deployment process is automated using Jenkins for CI/CD.
graph TB
GIT[GitHub Repo] --> JENKINS[Jenkins Multistage Pipeline]
JENKINS --> TEST[Install + Lint + Tests]
TEST --> BUILD[Package Artifacts]
BUILD --> VERCEL[Vercel Frontend Deploy]
BUILD --> ECR[Push Images to ECR]
ECR --> ECS[ECS Fargate - Backend & AI/ML]
ECS --> USERS[API Consumers]
VERCEL --> USERS
vercel --prod using the vercel-token credential when the main branch updates.To deploy manually:
npm install -g vercel
vercel --prod
https://docuthinker-app-backend-api.vercel.app/). A backup instance runs on Render free tier at https://docuthinker-ai-app.onrender.com/.ai_ml images, pushes them to Amazon ECR, and packages artifacts for manual ECS deployments.aws/ with:
cloudformation/fargate-service.yaml β baseline Fargate template for backend + AI/ML services.infrastructure/ β CDK stack mirroring the same services.scripts/local-env.sh β helper to export Graph/vector env vars locally.docuthinker-backend and docuthinker-ai-ml.docuthinker/openai, .../anthropic, etc.).nginx directory.frontend, backend, ai_ml), runs tests/lint, builds artifacts, and optionally deploys to Vercel (frontend) plus pushes container images to Amazon ECR for backend/AI workloads.vercel-token β Vercel API token stored in Jenkins credentials (for vercel --prod).AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY) configured globally for aws ecr pushes if you enable that stage.For local Jenkins bootstrap:
brew install jenkins-lts
brew services start jenkins-lts
open http://localhost:8080
main.artifacts/ for inspection and (when configured) ECR push status for the AWS ECS deployment path.Jenkinsfile for the full stage definitions and environment configuration.If successful, you should see the Jenkins pipeline running tests, producing artifacts, and deploying to Vercel/ECR automatically whenever changes are merged. Example dashboard:
In addition to Jenkins, we also have a GitHub Actions workflow set up for CI/CD. The workflow is defined in the .github/workflows/ci.yml file.
The GitHub Actions workflow includes the following steps:
vercel-token secret.dockerhub-username and dockerhub-password secrets, as well as to GHCR using the ghcr-token secret.
DocuThinker includes a comprehensive suite of tests to ensure the reliability and correctness of the application. The tests cover various aspects of the app, including:
To run the backend tests, follow these steps:
cd backend
# Run the tests in default mode
npm run test
# Run the tests in watch mode
npm run test:watch
# Run the tests with coverage report
npm run test:coverage
This will run the unit tests and integration tests for the backend app using Jest and Supertest.
To run the frontend tests, follow these steps:
cd frontend
# Run the tests in default mode
npm run test
# Run the tests in watch mode
npm run test:watch
# Run the tests with coverage report
npm run test:coverage
This will run the unit tests and end-to-end tests for the frontend app using Jest and React Testing Library.
kubernetes directory.graph TB
A[Kubernetes Cluster] --> B[Ingress Controller]
B --> C[Frontend Service]
B --> D[Backend Service]
C --> E[Frontend Pods]
D --> F[Backend Pods]
E --> G[Pod 1]
E --> H[Pod 2]
E --> I[Pod 3]
F --> J[Pod 1]
F --> K[Pod 2]
F --> L[Pod 3]
D --> M[ConfigMap]
D --> N[Secrets]
D --> O[Persistent Volume]
O --> P[MongoDB]
O --> Q[Redis]
The DocuThinker Viewer extension brings your document upload, summarization and insightβextraction workflow right into VS Code.
Key Features
To install the extension, follow these steps:
For full install and development steps, configuration options, and troubleshooting, see extension/README.md.
We welcome contributions from the community! Follow these steps to contribute:
Fork the repository.
git checkout -b feature/your-feature
git commit -m "Add your feature"
git push origin feature/your-feature
Thank you for contributing to DocuThinker! π
This project is licensed under the Creative Commons Attribution-NonCommercial License. See the LICENSE file for details.
[!IMPORTANT] The DocuThinker open-source project is for educational purposes only and should not be used for commercial applications. But free to use it for learning and personal projects!
For more information on the DocuThinker app, please refer to the following resources:
However, this README file should already provide a comprehensive overview of the project ~
Here are some information about me - the projectβs humble creator:
Happy Coding and Analyzing! π
Created with β€οΈ by Son Nguyen in 2024-2025. Licensed under the Creative Commons Attribution-NonCommercial License.