XinGPT🐶|12月 11, 2025 10:58
[Vibe Coding Practical Part 2] I upgraded the "US Stock Billboard" using AI and released it to the cloud in just three steps
In the previous article, we successfully ran a simple "US stock tracking dashboard" on our local computer using Google Antigravity and a few prompts.
But as a Vibe Coder that pursues ultimate efficiency, how can I tolerate it only running on my computer? I want to publish it online and turn it into a standalone app that can be viewed anytime on my phone.
Today, I will share the second article on Vibe Coding, on how to command AI to iterate functions, fix errors like "heavenly books", and ultimately achieve zero cost cloud deployment.
First, let's take a look at my achievements: click to access the Stock Dashboard https://stockdashboard888.streamlit.app/ (Note: As it is a free server, the first load may take several tens of seconds to wake up)
Phase 1: Present requirements like a product manager
The core of Vibe Coding is not writing code, but clearly describing logic.
1. Purifying information flow: distinguishing between "news" and "announcements"
The data captured in the first edition includes both analysis from The Wall Street Journal and tedious SEC 8-K documents. I hope to separate them.
My prompt:
Please modify the code to divide the information flow into two categories: 'official announcements' and' media news'. Rule: If the publisher is PR Newswire, Business Wire, or if the title includes 8-K, 10-Q, it is classified as an announcement; The rest are classified as news. Use Tab tabs on the interface to display them separately. ”
Execution of AI:
AI has automatically introduced keyword filtering logic. Now, if I want to read financial reports, I can directly click on the "Announcement" column, and if I want to read market news, I can click on the "News" column to double the efficiency.
2. Install Memory: Favorites feature on the app
A pain point of the previous version of the webpage was' refresh and forget ', and I needed a bookmark to collect important news.
My command (Prompt):
Add a bookmarking feature.
Add a next to each news‘ ⭐ Save 'button.
After clicking, save the news title and link to the local bookmarks.comsv file.
Add the 'My Favorites' list to the sidebar and read this CSV file. ”
Execution of AI:
After a few seconds, the code update is complete. My dashboard now has' memory ', and even after restarting the computer, the collected data still exists.
Phase 2: "Bug fixing" like a commander
I encountered a Vibe Coding error while developing the bookmarking feature. A large area of red text appeared on the screen:
StreamlitDuplicateElementKey: There are multiple elements with the same key...
If it were before, I might have simply shut down and given up. But now, I only need to understand the literal meaning of the error message: 'There is a duplicate key'.
Of course, a simpler method is to copy and paste the error message into Gemini and ask AI to help you choose how to fix it.
Problem analysis:
Originally, there was a news article that mentioned both NVDA and MSFT stocks simultaneously. When rendering the cards of these two stocks, the program generates the same ID (Key) for the favorite button of the news. The system doesn't know which one the user clicked on, so it crashed.
My repair command (Prompt):
The error message shows that the button ID is duplicated. Please modify the code logic: When generating the key for the bookmark button, do not only use the news link, but also add the stock code (Ticker) together to ensure that each button ID is unique. ”
Result:
AI modified a line of code to change the ID generation logic from link to ticker.link. The error disappears and the program runs perfectly.
Phase 3: Full network release! Nanny level deployment tutorial
Now, we want to publish the program running on the local computer to the Internet.
We will use the golden combination of GitHub (storing code) and Streamlinet Cloud (running code). Free throughout the process, no server knowledge required.
1. Pack your bags: check 4 core files
In your project folder, you must ensure that there are the following 4 files (if not, manually create a new txt file and rename it):
Stock_dashboard.exe (your main code)
Requirement. txt (crucial! This is a list that tells cloud servers what software to install
If it's not in your folder, please create a new txt and copy the following content to save:
yfinance
gnews
finvizfinance
pandas
watchdog
Watchlist. csv (your initial list of followed stocks, just fill in any line of NVDA)
Bookmarks.comsv (your initial bookmark, create an empty file, fill in the header with Timestamp, Ticker, Category, Title, URL, Source)
2. Upload the code to GitHub
GitHub is like a programmer's cloud storage.
Register and log in to http://(GitHub).
Click on the "+" ->"New repository" in the upper right corner.
Repository name: Feel free to fill in, for example, my stock app.
Select Public and do not check any other initialization options.
Click on Create repository.
On the redirected page, click on the link text 'uploading an existing file'.
Drag all four files prepared above into it.
Click the green button at the bottom to commit changes.
3. One click deployment to Streamlinet Cloud
This is the final step!
open http://share. (streamlit.io)。
Click on 'Sign in with GitHub' and authorize.
Click the prominent blue button 'New app'.
Fill out the form:
Repository: Click on the dropdown menu and select the my stock app you just created.
Main file path: Fill in stock_dashboard.exe.
Click on Deploy! In the bottom right corner!.
4. Witness miracles
An animation of "baking cake" will appear on the screen. Wait for about 2 minutes, your browser will automatically refresh and display your US stock board!
summary
Looking back, we didn't write a single line of Python code by hand, we just talked to AI:
Clarified the requirements (automatic capture, US stock market, time zone conversion).
We have iterated on features such as category announcements and local favorites.
Fixed bug (pointed out logical conflicts).
Completed deployment (using GitHub and Streamlit Cloud).
Next Preview:
Although the current app can be used, as it is a free cloud service, the "Favorites" data may be lost after restarting due to not being saved in real-time.
Next article, we will challenge advanced forms: "Installing a 'Cloud Brain' on AI: How to connect US stock dashboards to Google Sheets for permanent data synchronization
Share To
Timeline
HotFlash
APP
X
Telegram
CopyLink