Technology Stack

Relevant source files

The following files were used as context for generating this wiki page:

• BACKEND/package.json
• frontend/front/package.json
• BACKEND/src/app.js
• BACKEND/src/controllers/chatbot.controller.js
• BACKEND/src/routes/articles.routes.js
• frontend/front/src/App.jsx
• frontend/front/src/chatbot/chatbot.jsx

The project is built on a modern full-stack JavaScript architecture, utilizing the MERN (MongoDB, Express, React, Node.js) ecosystem enhanced with Artificial Intelligence capabilities. The frontend is a single-page application built with React and Vite, while the backend is an Express-based RESTful API that integrates various AI models and external services to provide networking and information retrieval features.

Sources: frontend/front/package.json, BACKEND/package.json, BACKEND/src/app.js

Frontend Architecture

The frontend is developed using React 19 and Vite, prioritizing performance and modern development workflows. It employs a component-based architecture where various features like the AI Chatbot, Article browser, and Product showcase are encapsulated into modular units. Styling is managed through a combination of standard CSS, Tailwind CSS for utility-first design, and Framer Motion for animations.

Sources: frontend/front/package.json:14-20, frontend/front/src/App.jsx:1-25

Core Frontend Technologies

Technology	Description
React 19	Core UI library for building components.
Vite	Build tool and development server.
React Router DOM	Client-side routing for multi-page navigation.
Axios	Promise-based HTTP client for API communication.
Tailwind CSS	Utility-first CSS framework for styling.

Sources: frontend/front/package.json:14-35

Frontend Data Flow

The following diagram illustrates how user interactions in the React components trigger API calls to the backend.

The application uses the useState and useEffect hooks to manage asynchronous data fetching from backend endpoints such as /api/v1/articles and /api/v1/chatbot/query.

Sources: frontend/front/src/Article/article.jsx:75-92, frontend/front/src/chatbot/chatbot.jsx:153-176

Backend Architecture

The backend is a Node.js environment utilizing the Express framework. It is structured to handle various specialized tasks through dedicated route modules and controllers. The application is configured as an ES module project ("type": "module").

Sources: BACKEND/package.json:6, BACKEND/src/app.js:1-13

Backend Routing and Middleware

The server uses several middleware for security and data handling:

• CORS: Configured to allow cross-origin requests from the frontend.
• Cookie Parser: To handle browser cookies for session management.
• Express JSON/URL-Encoded: For parsing incoming request bodies.
• Lusca: For security headers and CSRF protection.

Sources: BACKEND/package.json:28-31, BACKEND/src/app.js:15-28

API Endpoints

The backend organizes functionality into several versioned API routes:

Route Path	Module	Purpose
/api/v1/users	userRouter	User authentication and profile management.
/api/v1/chatbot	chatbotRouter	AI-powered networking assistance.
/api/v1/articles	articlesRouter	News retrieval and AI summarization.
/api/v1/products	productHuntRouter	Showcase of monthly products.

Sources: BACKEND/src/app.js:31-41

Artificial Intelligence Integration

The platform leverages multiple AI providers and frameworks to deliver intelligent features. It specifically uses LangChain to orchestrate LLM (Large Language Model) interactions and OpenAI/Groq for content generation.

Sources: BACKEND/package.json:21-27, BACKEND/src/controllers/chatbot.controller.js:75-80

AI Implementation Logic

The AI stack involves the following components:

1. ChatGroq: Utilizes the llama3-8b-8192 model for high-performance networking assistance.
2. OpenAI (GPT-4): Used for summarizing external news articles retrieved via NewsAPI.
3. LangChain Core: Manages prompt templates and message formatting.

Data Persistence and Storage

The system uses MongoDB as its primary database, interfaced via Mongoose.

• Mongoose: Used for object modeling and schema definition.
• Cloudinary: Integrated via the backend for managing and storing media/images.
• Multer: Utilized for handling multipart/form-data during file uploads.

Sources: BACKEND/package.json:25, 36, 38

Summary of External Service Dependencies

The "Technology Stack" relies on several external API integrations to provide live data:

• NewsAPI: Fetches recent articles for user-defined topics.
• OpenAI API: Summarizes article content for the frontend list view.
• Groq API: Powers the Llama3 chatbot for networking strategies.
• Tavily Search (referenced in imports): Provides web search capabilities for the AI assistant.

Sources: BACKEND/src/routes/articles.routes.js:9-10, BACKEND/src/controllers/chatbot.controller.js:11-14, 75-80