Demo web app using Next.js, React Server Components, and Streaming "server-rendered" stock price data from Polygon.io API. Original inspiration from @rauchg's tweet - https://x.com/rauchg/status/1809389050568298625
This project uses the brand new shadcn/ui charts library - https://ui.shadcn.com/charts.
![Screenshot 2024-07-06 at 3 23 43 AM](https://private-user-images.githubusercontent.com/34843135/346267399-e106c427-90eb-4826-9fda-36b99d667175.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5NDYxMzAsIm5iZiI6MTczODk0NTgzMCwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjczOTktZTEwNmM0MjctOTBlYi00ODI2LTlmZGEtMzZiOTlkNjY3MTc1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDE2MzAzMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTg4YzdhOWYzZGVhYjMzYjNjYmQ0YTE4MmEwNzM4YWM2Yjc4NDc1MGYzOWVkYTI4MWQ4YzRmZmIzOGNkZDY4ZTImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.NXAdc164_Z16hFATuahNQZOs4Q6tTCyPdGnuS_KvgJ0)
![Screenshot 2024-07-06 at 3 24 26 AM](https://private-user-images.githubusercontent.com/34843135/346267425-627391ef-5c54-4e54-9b3a-1371be31e690.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5NDYxMzAsIm5iZiI6MTczODk0NTgzMCwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjc0MjUtNjI3MzkxZWYtNWM1NC00ZTU0LTliM2EtMTM3MWJlMzFlNjkwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDE2MzAzMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTBiZjQ1NmY2NTQzYTY2YzBjNWY1NTk5NGRmYTk5MzIxMmNlNmY0Y2E5MzhlYmI0ZTQ4MjFhNWZiYjk4NzAyNDUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.DOfcLwoiPvfdK3j2fN4qB0RlUqPQGyjA0u6yBYyyPWg)
- Built with Next.js App Router, Typescript, TailwindCSS, and Shadcn/UI (and latest charting components)
- Uses React Server Components and Streaming "server-rendered" stock price data from Polygon.io API
-
Clone this repository to your local machine:
git clone https://github.com/aryanvichare/stocks.git
-
Move to the cloned directory
cd stocks
-
Install dependencies:
npm install
-
Copy the .env.example to your .env.local
cp .env.example .env.local
-
Get your API Key from Polygon.io and paste it into your .env.local
-
Run the development server:
npm run dev