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.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIyNDkzODAsIm5iZiI6MTcyMjI0OTA4MCwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjczOTktZTEwNmM0MjctOTBlYi00ODI2LTlmZGEtMzZiOTlkNjY3MTc1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzI5VDEwMzEyMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWU4MzUxOTJmYjBhNjFjNDRkZWQ5YmM3YmI2ZjIzMzFlYTNlNDIxYmRmYTFlZGVhMmFiZjU1NzFkOWI0M2Q3NDUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.-PqFAM4p7vAB4Er-qCDxAEzgp3uB5XWev4neSypJYNY)
![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.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIyNDkzODAsIm5iZiI6MTcyMjI0OTA4MCwicGF0aCI6Ii8zNDg0MzEzNS8zNDYyNjc0MjUtNjI3MzkxZWYtNWM1NC00ZTU0LTliM2EtMTM3MWJlMzFlNjkwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzI5VDEwMzEyMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTk2MDFiMDM4NjIxMWUzYmY4MzUxZGI0Zjk4YjdjZTgzZTY4MzEyZDcxMWVjNjI4NTBlY2UyZjBiZDZjZDg2MzcmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.J17a9PFfy-Nbqa4p_jz625BlUBaDdm_ubQhJb0X364Q)
- 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