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.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQyNzY0OTksIm5iZiI6MTcyNDI3NjE5OSwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjczOTktZTEwNmM0MjctOTBlYi00ODI2LTlmZGEtMzZiOTlkNjY3MTc1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIxVDIxMzYzOVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTc4NzgwOGEyY2YxN2E2OGUxMDU1NjM2ODlmMGY4MzVhN2U5ZTY4M2Q4NzZmZTQzYTBhY2RmNzk0NTc4NDA0MDQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.NnAl5auJQlh0wkyU1emJ0w3ApEVGXUgm6hikGLwoFHE)
![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.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQyNzY0OTksIm5iZiI6MTcyNDI3NjE5OSwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjc0MjUtNjI3MzkxZWYtNWM1NC00ZTU0LTliM2EtMTM3MWJlMzFlNjkwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIxVDIxMzYzOVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTUwYTAzMGY1NmIzM2M0ZThlNGQ3YTU5MmIzMDI1NzVlYzg3NzU0ZmM0YmM0ZTk2NzFhMzg0OWFjOTA5Yzk1NTEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.6AQmEnk9dlffhWdP8rjqmsU7Wr7LobLfN_FR46l2Ot4)
- 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