📈 Trade Journal (Local-First)

📖 Introduction

Trade Journal is a modern, privacy-focused trading log application built with React, TypeScript, and Tailwind CSS.

Unlike traditional trading journals that require a monthly subscription or store your sensitive financial data on remote servers, this application is Local-First. All your trade data is stored securely in your browser's Local Storage. You own your data.

It features a calendar view for daily P/L tracking, detailed trade analysis modal, CSV import support for broker data, and a backup/restore system.

✨ Key Features

• 🔒 Privacy First: Data is stored locally in your browser (LocalStorage). No server-side database.
• 📊 Dashboard: Real-time calculation of Net P/L, Win Rate, Profit Factor, and trade counts.
• 📅 Calendar View: Visual representation of your daily performance.
• 📝 Trade Details: Log setups, mistakes, notes, and attach screenshot URLs.
• 📥 CSV Import: Bulk import trade history from broker exports (Supports standard CSV format).
• 💾 Backup & Restore: Export your data to JSON for backup or to transfer between devices.
• 🤖 AI Ready: configured with Google Gemini SDK for future AI-assisted trade analysis.

---

🛠️ Tech Stack

• Framework: React + Vite
• Language: TypeScript
• Styling: Tailwind CSS
• Icons: Lucide React
• CSV Parsing: PapaParse
• Utils: UUID, date-fns

---

🚀 Getting Started

Prerequisites

• Node.js (v18 or higher recommended)
• npm or yarn

Installation

1. Clone the repository

   git clone [https://github.com/your-username/my-trade-journal.git](https://github.com/your-username/my-trade-journal.git)
   cd my-trade-journal

2. Install dependencies

   npm install

3. Start the local server

   npm run dev

4. Open in Browser Visit http://localhost:5173 to start using the app.

---

💡 Usage Guide

1. Import Data: Click "Import Broker CSV" to load your trade history.
2. Manual Entry: Click the + button in the Day Detail view to add trades manually.
3. Review: Click on any day in the calendar to see trades for that day. Click a specific trade to edit details (setups, notes).
4. Backup: Click the Download icon (top right) regularly to save a .json backup of your data.

---

📄 License

This project is open source and available under the MIT License.

---

📈 交易复盘日志 (Trade Journal)

📖 简介

Trade Journal 是一款基于 React、TypeScript 和 Tailwind CSS 构建的现代化、隐私优先的交易复盘工具。

与需要月费或将敏感财务数据存储在远程服务器上的传统复盘软件不同，本项目采用 本地优先 (Local-First) 架构。您的所有交易数据都安全地存储在您浏览器的 LocalStorage 中。您的数据完全属于您自己。

它提供了用于追踪每日盈亏的日历视图、详细的交易分析弹窗、券商 CSV 数据导入支持以及数据备份/恢复系统。

✨ 核心功能

• 🔒 隐私优先：数据存储在本地浏览器中，无需担心服务器数据泄露。
• 📊 仪表盘：实时计算净盈亏 (Net P/L)、胜率 (Win Rate)、盈亏比和交易次数。
• 📅 日历视图：直观展示每日的交易表现和盈亏情况。
• 📝 交易详情：记录交易策略 (Setups)、错误、笔记，并支持添加截图链接。
• 📥 CSV 导入：支持从券商导出的 CSV 文件批量导入交易记录。
• 💾 备份与恢复：一键导出 JSON 数据进行备份，或在不同设备间迁移数据。
• 🤖 AI 准备：集成了 Google Gemini SDK，为未来 AI 辅助复盘分析做好了准备。

---

🛠️ 技术栈

• 框架: React + Vite
• 语言: TypeScript
• 样式: Tailwind CSS
• 图标库: Lucide React
• 数据处理: PapaParse (CSV解析)
• 工具库: UUID

---

🚀 快速开始

环境要求

• Node.js (推荐 v18 或更高版本)
• npm

安装步骤

1. 克隆项目

   git clone [https://github.com/your-username/my-trade-journal.git](https://github.com/your-username/my-trade-journal.git)
   cd my-trade-journal

2. 安装依赖

   npm install

3. 启动本地服务器

   npm run dev

4. 打开浏览器 访问 http://localhost:5173 即可开始使用。

---

💡 使用指南

1. 导入数据：点击右上角的 "Import Broker CSV" 导入你的交易记录。
2. 手动录入：点击日历中的任意日期，在弹窗中点击 + 号添加手动交易。
3. 复盘分析：点击日历日期查看当日详情，点击具体交易条目可编辑策略标签和笔记。
4. 数据备份：点击右上角的 下载图标，定期将数据保存为 .json 文件以防丢失。

---

📄 开源协议

本项目基于 MIT License 开源。