Directory Structure

Relevant source files

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

• BACKEND/package.json
• BACKEND/src/app.js
• BACKEND/src/index.js
• frontend/front/package.json
• frontend/front/src/App.jsx
• frontend/front/vite.config.js
• BACKEND/src/routes/articles.routes.js
• frontend/front/src/Article/article.jsx

The Bridge AI project is organized into a decoupled full-stack architecture consisting of a Node.js/Express backend and a React/Vite frontend. The codebase is divided into two primary root directories: BACKEND/ and frontend/front/. This structure supports a clear separation of concerns, where the backend handles data processing, external API integrations (like OpenAI and NewsAPI), and database management, while the frontend focuses on component-based UI rendering and client-side routing.

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

Backend Architecture (BACKEND/)

The backend is a JavaScript-based server utilizing the ES Module system. It follows a structured routing and controller pattern to manage various API services including user authentication, AI chatbot interactions, and article aggregation.

Key Backend Components

• Entry Point: src/index.js initializes the environment variables using dotenv and establishes a connection to MongoDB before starting the Express server.
• App Configuration: src/app.js configures middleware such as CORS, JSON body parsing, and cookie parsing. It also defines the base paths for all API version 1 routes.
• Route Modules: Routes are modularized into specific files (e.g., articles.routes.js, chatbot.routes.js) to handle specialized logic.

Sources: BACKEND/src/index.js:1-20, BACKEND/src/app.js:10-25, BACKEND/package.json:7

Backend Data Flow

The following diagram illustrates how an incoming request is handled by the backend system:

The backend integrates with external services like OpenAI for summarization and NewsAPI for content retrieval.
Sources: BACKEND/src/routes/articles.routes.js:20-55, BACKEND/src/app.js:31-35

Frontend Architecture (frontend/front/)

The frontend is a modern React application bootstrapped with Vite. It utilizes react-router-dom for navigation and axios for communicating with the backend API.

Project Organization

• Source Root: src/ contains all functional logic, styling, and assets.
• Component Directories: Features are grouped into subdirectories (e.g., Article/, Products/, getstarted/), each containing the relevant .jsx component and its corresponding .css file.
• Routing Centralization: App.jsx serves as the routing hub, mapping URL paths to specific feature components.

Sources: frontend/front/src/App.jsx:11-31, frontend/front/package.json:14-20, frontend/front/vite.config.js:5-12

Component Relationship Diagram

This diagram shows the relationship between the main application shell and the feature-specific components:

Key System Configurations

The project relies on specific environmental and package configurations to bridge the frontend and backend.

Category	File	Description
Backend Dependencies	BACKEND/package.json	Includes @google/generative-ai, mongoose, express, and langchain.
Frontend Dependencies	frontend/front/package.json	Includes react, react-router-dom, framer-motion, and axios.
Server Config	BACKEND/src/index.js	Defaults to port 8000 for API services.
Path Aliasing	frontend/front/vite.config.js	Configures @ as an alias for the src directory.

Sources: BACKEND/package.json:17-36, frontend/front/package.json:14-21, BACKEND/src/index.js:18, frontend/front/vite.config.js:7-11

API Route Structure

The backend exposes a versioned API under the /api/v1 prefix.

Endpoint	Method	Source File	Description
/api/v1/users	N/A	user.routes.js	Handles user registration and authentication.
/api/v1/chatbot	POST	chatbot.controller.js	Processes AI networking queries via LangChain.
/api/v1/articles	GET	articles.routes.js	Fetches and summarizes news based on a query.
/api/v1/products	GET	producthunt.routes.js	Retrieves product data for the products page.

Sources: BACKEND/src/app.js:31-35, BACKEND/src/routes/articles.routes.js:30-65, BACKEND/src/controllers/chatbot.controller.js:115-130

Summary

The directory structure of EICHackathon (Bridge AI) reflects a modular micro-service inspired architecture. By separating the BACKEND and frontend into distinct environments with their own dependency management and build tools, the project ensures scalability and ease of maintenance. The backend manages complex AI workflows and data aggregation, while the frontend provides a responsive, component-driven user interface.

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