Coding A Full Stock Prediction Tool By Prompt (Warp, Python, React)

Key Concepts

• AI Stock Prediction Tool: A web application built to predict stock prices using machine learning.
• PyTorch: A machine learning framework used for training the prediction model.
• FastAPI: A Python web framework used for building the backend API.
• React with TypeScript: A JavaScript library and a superset of JavaScript used for building the frontend user interface.
• Docker & Docker Compose: Containerization technologies used for packaging and deploying the application.
• Nginx: A web server used as a reverse proxy to manage traffic and serve static files.
• Warp: A coding assistant tool used to generate code and automate development tasks through prompting.
• LSTM (Long Short-Term Memory): A type of recurrent neural network architecture used in the prediction model.
• Technical Indicators: Calculations based on historical price and volume data used to analyze and predict market trends (e.g., SMA, EMA, RSI, MACD, Bollinger Bands).
• UV: A fast package installer and resolver for Python.

Stock Prediction Tool Development with Warp

1. Introduction and Overview

• The video demonstrates building an AI stock prediction tool using various technologies: PyTorch for training, FastAPI for the backend, React with TypeScript for the frontend, Docker and Docker Compose for containerization, and Nginx as a reverse proxy.
• The development process is driven by prompting using Warp, a coding assistant.
• The video emphasizes that prompting is not a replacement for developer knowledge and competence but a tool to accelerate development.

2. Final Result Demonstration

• The final product is a web application with a user interface where users can input a stock ticker symbol and receive a prediction.
• The application features a React frontend, a FastAPI backend, and a PyTorch-trained model.
• Users can select from popular stock symbols or input custom symbols.
• The presenter cautions against relying on the predictions for actual investment decisions, emphasizing that it's a coding exercise.
• The application is deployed using Docker, Docker Compose, and Nginx.

3. Development Process Breakdown

• The development process involves several steps:
  • Training a model using PyTorch.
  • Data preprocessing.
  • Building a backend with FastAPI.
  • Building a frontend with React and TypeScript.
  • Using Nginx as a reverse proxy.
  • Containerization with Docker and Docker Compose.
  • Deployment.
• Warp is used to generate code for each step through prompting.
• The presenter emphasizes the need for active participation and decision-making throughout the process.

4. Warp Coding Assistant

• Warp is a coding platform that acts as a coding assistant.
• It allows users to run commands, use autocompletion, chat with an AI agent, and delegate tasks.
• Warp can execute commands, write code, and correct errors based on error messages.
• The presenter uses Warp Preview, a version of Warp, which is more of an AI agent.
• Warp is used to build the stock predictor application through prompting and iterative refinement.

5. Training the Prediction Model

• The presenter starts by creating a project structure with directories for training, backend, and frontend.
• A prompt is formulated to instruct Warp to implement a Python script that trains an LSTM model to predict stock prices using PyTorch and Y Finance.
• The prompt specifies the use of multiple companies, long time periods, intelligent hyperparameters, a good architecture, and feature engineering based on technical analysis.
• Warp initializes a UV environment and adds dependencies like torch, yfinance, pandas, numpy, scikit-learn, and talib.
• The generated code includes technical indicators like SMA, EMA, RSI, MACD, and Bollinger Bands.
• The model architecture includes an LSTM layer, attention mechanisms, fully connected layers, dropout, and batch normalization.
• The presenter manually runs the script using UV run and encounters an error, which Warp automatically fixes.
• The number of epochs is adjusted to 10, and printing is enabled to monitor progress.
• The training process exports the model as PTH and pickle files.

6. Building the FastAPI Backend

• A prompt is used to instruct Warp to build a FastAPI application around the trained model, making it accessible via an API.
• The prompt specifies the use of the backend directory, UV, and proper handling of CORS (Cross-Origin Resource Sharing).
• Warp explores the file system, examines the Python file, and initializes a new UV project in the backend directory.
• Dependencies like FastAPI, uvicorn, torch, scikit-learn, pandas, numpy, pyantic, yfinance, and python-multipart are added.
• The generated code includes logging, model loading, technical indicators, the neural network definition, and API endpoints.
• A bash script for running the server is initially suggested but refined to use uvrun main.py.
• Warp is instructed to make a request to the API to verify its functionality.
• Issues with fetching data and feature engineering are encountered and automatically fixed by Warp.
• The API is tested with multiple stock symbols to ensure it works correctly.

7. Implementing the React Frontend

• A prompt is used to instruct Warp to implement a React frontend for the backend using TypeScript, VIT, and Tailwind CSS.
• The prompt specifies the use of code services, types, components, and CSS to create a professional and modern-looking frontend.
• The presenter manually installs Tailwind CSS using the VIT documentation due to issues with Warp's initial attempt.
• Warp installs additional packages and creates API TypeScript files, services, and utility functions.
• Components like a spinner, stock card, stock search, error alert, and health status are generated.
• The app.tsx file, index.html file, and index.ts file are updated.
• The presenter runs npm rundef and encounters an error related to a missing export named batch prediction request.
• Warp suggests a fix related to caching, but the presenter suspects a missing type keyword.
• The type keyword is added to the components, resolving the error.
• The user interface is functional but has spacing and styling issues.
• A prompt is used to instruct Warp to improve spacing and implement dark mode.
• The CSS file and components are adjusted, and utility functions are updated.
• The user interface is improved with dark mode and better spacing.

8. Dockerizing the Application

• A prompt is used to instruct Warp to dockerize the backend and frontend using Dockerfiles and a docker-compose.yaml file.
• The prompt specifies the use of Nginx as a reverse proxy and adjustments to the code to point to port 80.
• Dockerfiles are created for the backend and frontend, including instructions for installing dependencies, copying code, and running the application.
• An Nginx configuration is created for the reverse proxy, mapping different locations to the backend and frontend servers.
• The URLs in the frontend are adjusted to use /API instead of localhost.
• A docker-compose.yaml file is generated, defining the services for the backend, frontend, and Nginx.
• A dockerignore file is created for the backend and frontend.
• The presenter runs docker compose build and encounters an error related to TypeScript errors.
• Warp generates a fix to resolve the TypeScript errors.
• The presenter runs docker compose up and encounters an error related to missing pickle files.
• The volume mapping in the docker-compose.yaml file is adjusted to resolve the error.
• The application is successfully dockerized and running locally.

9. Deploying to a Server

• The presenter uses Hner, a cloud provider, to rent a server instance.
• An Ubuntu server with 4 GB of RAM and 40 GB of SSD is selected.
• The presenter connects to the server via SSH.
• The project code is uploaded to the server using SCP.
• Docker is installed on the server using a series of commands.
• The presenter runs docker compose build and docker compose up on the server.
• An error is encountered related to missing exported model directory.
• The exported model directory is uploaded to the server using rsync.
• The application is successfully deployed to the server and accessible via the server's IP address.

10. Conclusion

• The video demonstrates the process of building and deploying an AI stock prediction tool using Warp, PyTorch, FastAPI, React, Docker, and Nginx.
• Warp is shown to be a powerful tool for accelerating development through prompting and automation.
• The presenter emphasizes the importance of developer knowledge and competence in guiding the development process.
• The final product is a functional web application deployed on a cloud server.
• The presenter encourages viewers to explore Warp and its capabilities.