quivr/docs/tech-design.mdx
Antoine Dewez 8b68aeb64f
fix(docs): update doc (#2470)
# Description

Please include a summary of the changes and the related issue. Please
also include relevant motivation and context.

## Checklist before requesting a review

Please delete options that are not relevant.

- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my code
- [ ] I have commented hard-to-understand areas
- [ ] I have ideally added tests that prove my fix is effective or that
my feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged

## Screenshots (if appropriate):
2024-04-23 00:40:29 +02:00

193 lines
6.6 KiB
Plaintext

---
title: Technical Design
description: Learn how Quivr works under the hood
icon: microchip
---
## Backend Stack
### FastAPI: The Foundation of Quivr
FastAPI is central to Quivr's high-performance capabilities. Here, we explore its role and the benefits it brings to the table.
<AccordionGroup>
<Accordion title="Introduction to FastAPI">
FastAPI is a leading-edge web framework for building APIs with Python 3.6+.
It stands out for its speed, efficiency, and compatibility with modern
development needs. - **Speed**: FastAPI is one of the fastest web frameworks
for Python... - **Type Checking**: Utilizes Python type hints for
validation... - **Asynchronous Coding**: Supports asynchronous request
handling...
</Accordion>
<Accordion title="Choosing FastAPI for Quivr">
Our selection of FastAPI aligns perfectly with Quivr's design philosophy...
- **Performance and Scalability**: FastAPI's speed makes Quivr highly
efficient... - **Ease of Use**: Its intuitive design allows for rapid
development... - **Rich Feature Set**: FastAPI comes with built-in support
for data validation...
</Accordion>
<Accordion title="FastAPI vs Other Frameworks">
FastAPI's performance metrics are superior when compared to counterparts
like Flask and Django... - **Flask**: While Flask is simpler, FastAPI
provides built-in support... - **Django**: Django is a full-stack framework,
but for API development...
</Accordion>
</AccordionGroup>
### Authentication: Secure Access to Quivr
Secure and streamlined authentication is key to accessing Quivr's features.
<Steps>
<Step title="Account Creation">
Sign up for Quivr and navigate to the `/user` page on your user dashboard.
</Step>
<Step title="API Key Generation">
Generate your unique API key in the settings, your access token to Quivr's
backend services.
</Step>
<Step title="API Key Usage">
Include the generated API key in the request header for secure access.
</Step>
</Steps>
### The Architecture of Our Kingdom: Robust and Scalable
Quivr's architecture is a testament to modern, scalable web service design:
<CardGroup cols={2}>
<Card title="Load Balancer" icon="network-wired">
The Load Balancer efficiently manages incoming traffic, ensuring optimal
performance.
</Card>
<Card title="Container Service" icon="docker">
Our Container Service orchestrates digital services, maintaining operational
harmony.
</Card>
<Card title="Queue" icon="crown">
The Queue system prioritizes and manages task execution.
</Card>
<Card title="Celery Worker" icon="list">
Celery Worker handles queued tasks, ensuring timely and effective execution.
</Card>
</CardGroup>
### Words of Wisdom: Keeping Your API Secure
<Warning>
Always protect your API key. It's crucial for maintaining the security and
integrity of your access to Quivr.
</Warning>
### The Balance of Power: Pros and Cons Analysis
Understanding the pros and cons of FastAPI helps in making informed decisions:
<AccordionGroup>
<Accordion title="Advantages of Using FastAPI">
FastAPI enhances development with its swift performance...
</Accordion>
<Accordion title="Considerations for FastAPI">
While advantageous, FastAPI requires understanding of modern programming
concepts...
</Accordion>
</AccordionGroup>
### Interactive API Sandbox: Experience Quivr in Action
Engage with Quivr's functionality in real-time in our interactive API sandbox:
<Info>
🌐 [Test and refine your API calls using our
sandbox.](https://api.quivr.app/docs)
</Info>
## Frontend
### Next.js and Vercel: The Dynamic Duo
Quivr's frontend is crafted with Next.js, a cutting-edge React framework, and is hosted on Vercel, a platform tailored for frontend frameworks like Next.js. This combination provides a seamless, efficient, and scalable user experience.
### Next.js: The Power of React Enhanced
Next.js is chosen for its robust features that elevate the React development experience:
<AccordionGroup>
<Accordion title="Server-Side Rendering & Static Generation">
Next.js supports SSR and Static Generation, crucial for performance and SEO.
This ensures Quivr's pages are pre-rendered for faster load times and
improved search engine visibility.
</Accordion>
<Accordion title="API Routes">
Next.js allows the creation of API endpoints within the application,
enabling a seamless blend of client and server-side logic.
</Accordion>
<Accordion title="Enhanced Development Experience">
With features like fast refresh and built-in CSS support, Next.js
streamlines the development process, boosting developer productivity.
</Accordion>
<Accordion title="Scalability">
Next.js's architecture facilitates easy scaling of applications to meet
growing user bases and complex features.
</Accordion>
</AccordionGroup>
### Vercel: Optimized Hosting for Next.js
Vercel, renowned for its global deployment capabilities and serverless functions, hosts Quivr's frontend:
<CardGroup cols={2}>
<Card title="Optimized for Next.js" icon="react">
Vercel, built by the creators of Next.js, ensures seamless integration and
optimal performance for Quivr's frontend.
</Card>
<Card title="Edge Network" icon="network-wired">
Leveraging Vercel's Edge Network reduces latency and speeds up content
delivery, enhancing user experience.
</Card>
<Card title="Continuous Deployment" icon="octopus-deploy">
Continuous deployment on Vercel allows for swift and efficient updates,
keeping Quivr's frontend up-to-date.
</Card>
<Card title="Scalable Infrastructure" icon="layer-group">
Vercel's infrastructure automatically scales to meet user demand, ensuring
consistent performance even during peak times.
</Card>
</CardGroup>
<Tip>
By combining Next.js and Vercel, Quivr achieves a robust, scalable, and
responsive web application, meeting the demands of modern web users and
developers.
</Tip>
This integration of Next.js and Vercel is a testament to Quivr's commitment to delivering
high-quality, responsive, and dynamic web applications, catering to modern web development
needs.
## Architectural Overview
Explore the intricacies of Quivr's architecture through this detailed diagram:
<Frame>
<img
src="/images/architectural-high-level.png"
alt="Quivr Architecture Diagram"
/>
</Frame>
## Quivr Community
Your input is invaluable in shaping the future of Quivr. Connect with us:
<Tabs>
<Tab title="Feedback">
Share your feedback and suggestions to enhance Quivr.
</Tab>
<Tab title="Community">
Engage with peers in our forums and social platforms for support and
collaboration.
</Tab>
</Tabs>
---