diff --git a/.gitignore b/.gitignore
index 8d7e9c5..5b707ec 100644
--- a/.gitignore
+++ b/.gitignore
@@ -24,3 +24,7 @@ dist-ssr
 *.sw?
 
 .vs/
+
+# Ignore the obj and Properties directories
+obj/
+Properties/
diff --git a/README.md b/README.md
index a447182..e215f3b 100644
--- a/README.md
+++ b/README.md
@@ -40,6 +40,17 @@ I utilize third-party APIs for fetching live stock prices and other indicators f
 - Utilizes React for state management, including user input validation before sending data to the server
 - Implements cookie-based authentication to reduce the need for repeated sign-ins
 
+#### BuyPage Component
+The BuyPage component allows users to search for stock quotes, view their current portfolio, and purchase stocks. 
+It provides real-time stock data, calculates total costs, and ensures users have sufficient funds before completing transactions.
+
+#### PageTransaction Component
+The PageTransaction component displays a user's transaction history, including details such as transaction type, stock symbol, shares, 
+unit price, and total values. It also shows the user's current balance with an option to toggle its visibility.
+#### Login Component
+The Login component provides a simple user authentication interface, allowing users to enter their username and password to log in. 
+It displays success or error messages based on the login attempt and redirects the user to the main page upon successful authentication.
+
 # <span style="color:red">START APPLICATION</span>
 
 ### For Client
diff --git a/tradingwebapp.client/src/PageMain.tsx b/tradingwebapp.client/src/PageMain.tsx
index cbd3ffd..061b68e 100644
--- a/tradingwebapp.client/src/PageMain.tsx
+++ b/tradingwebapp.client/src/PageMain.tsx
@@ -3,6 +3,12 @@ import { readUser } from './api-user';
 import { readStock, Stock } from './api-stock';
 import { lookup } from './api-quote';
 
+//Hello Van Nguyen
+/*
+The MainApp page displays a user’s portfolio, showing their cash balance, stock holdings, total stock value, 
+and overall assets. It fetches data in real-time, calculates key metrics, and organizes stock details 
+in a table for easy viewing.
+*/
 const MainApp: React.FC = () => {
     const [userData, setUserData] = useState<{ username: string; cash: number; } | null>(null);
     const [stocks, setStocks] = useState<Stock[]>([]);
diff --git a/tradingwebapp.client/src/assets/styles.css b/tradingwebapp.client/src/assets/styles.css
index 625e8d4..9e51a3e 100644
--- a/tradingwebapp.client/src/assets/styles.css
+++ b/tradingwebapp.client/src/assets/styles.css
@@ -1,11 +1,13 @@
 /* Size for brand */
+/* Ensures the brand name appears prominently */
 nav .navbar-brand {
-    font-size: xxx-large;
+    font-size: xxx-large; 
 }
 
+/* Makes navigation links visually distinct */
 .navbar-nav .nav-item .nav-link {
-    font-weight: bold;
-    font-size: x-large; 
+    font-weight: bold; 
+    font-size: x-large;
 }
 
 /* Colors for brand */
@@ -24,6 +26,7 @@ nav .navbar-brand .yellow {
 nav .navbar-brand .green {
     color: #2e944b;
 }
+/* Main content styling */
 .Main {
     margin-top: 15px;
     margin-left: 20px;