mirror of
https://github.com/QuivrHQ/quivr.git
synced 2024-09-11 14:36:35 +03:00
# 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):
193 lines
6.6 KiB
Plaintext
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>
|
|
|
|
---
|