StockViz

Important

This project was built with Fluvio collaboration. Now, It is not maintained and was only PoC. If you want to built something on top of it feel free to do so. Putting this repo on readonly and from 19 April 2026 shutting down all deployments related to this project.

Realtime - Stock Charts with Fluvio

This repository contains a complete system for fetching and visualizing real-time stock market data. It includes:

1. Server: A backend service for fetching stock prices.
2. Client: A web application for displaying stock price charts.
3. Fluvio: Configuration files for Fluvio cloud deployment.

Demo

Youtube link demo

Overview

• Server: Provides a REST API to get current stock prices and a streaming endpoint for real-time updates. (uses Fluvio)
• Client: A React-based application that visualizes stock prices using Recharts and Tailwind CSS.
• Fluvio: YAML configuration files used to define the sources to sync data and Docker files. (for Fluvio)

Setup Instructions

Server

1. Navigate to the Server Directory

   cd server

2. Install Dependencies

   bun install

3. Run the Server

   bun dev

   The server will be available at http://localhost:5000.

Client

1. Navigate to the Client Directory

   cd client

2. Create a .env File

   In the client directory of the project, create a file named .env with the following content:

   AUTH_SECRET="changeMe"
   AUTH_GITHUB_ID="<github-id>"
   AUTH_GITHUB_SECRET="<github-secret>"
   NEXT_PUBLIC_SERVER_URL="http://localhost:8000"
   NEXT_PUBLIC_URL="http://localhost:3000"
   DATABASE_URL="<mongodb>"

3. Install Dependencies

   bun install

4. Generate Prisma Schema

   npx prisma db push

5. Run the Development Server

   bun dev

   The client application will be available at http://localhost:3000.

Fluvio

1. Navigate to the Fluvio Directory

   cd fluvio

2. Install Required Fluvio Package

   cdk hub download infinyon/http-source@0.3.8

3. Create a Topic

   fluvio topic create stocks-sinker

4. Deploy Sinker

   cdk deploy start --ipkg ./infinyon-http-source-0.3.8.ipkg -c ./sinker.yml

Widget Scripts

To see widget open widget/index.html in root and change its div id with locally created id and open in browser.

You will find widget scripts in widget/dist/ to add to your website. You need to build widget again after any change in widget folder by:

bun run build