SizeSmart is a stock position sizing calculator for traders. It helps users calculate ideal position sizes, manage multiple entries (averaging up/down), analyze risk, plan profit targets, and track live positions — all while staying within defined risk limits.
| Layer | Technology |
|---|---|
| Frontend | React 18, Tailwind CSS, shadcn/ui |
| Routing | React Router DOM v6 |
| State / Data Fetching | @tanstack/react-query |
| Animations | Framer Motion |
| Charts | Recharts |
| Icons | Lucide React |
| Notifications | Sonner (toast) |
| Backend Functions | Deno Deploy (Base44 serverless) |
| Database | Base44 built-in (NoSQL entity store) |
| Auth | Base44 built-in authentication |
| Analytics | Google Analytics (GA4, G-4T50W9SNH1) |
| Ads | Google AdSense |
| Live Prices | Yahoo Finance (public API, no key required) |
/ ├── pages/ │ ├── Calculator.jsx # Main calculator page │ ├── Positions.jsx # Saved positions list │ ├── Preferences.jsx # User default preferences │ └── Profile.jsx # User profile │ ├── components/ │ ├── calculator/ │ │ ├── TradeSetup.jsx # Ticker, position type, account size, risk, stop loss inputs │ │ ├── EntryManager.jsx # Multi-entry price/shares manager with avg calc │ │ ├── RiskSummary.jsx # Risk analysis card (risk bar, max shares, room to add) │ │ ├── ProfitTargets.jsx # R-multiple profit targets + trailing stop strategies │ │ ├── ScenarioChart.jsx # Bar chart of P&L at different R-multiples │ │ ├── ProgressGauge.jsx # Live price tracker + position progress bar + P&L │ │ ├── RiskRewardDiagram.jsx # Visual price scale showing stop/entry/targets │ │ ├── PositionSizingCalc.jsx # Quick position size calculator widget │ │ ├── ShareButton.jsx # Generates shareable base64-encoded URL │ │ ├── AdSenseAd.jsx # Google AdSense ad unit component │ │ └── HelpModal.jsx # Reusable help modal + InfoButton │ └── nav/ │ └── UserDropdown.jsx # User avatar dropdown (profile, preferences, logout) │ ├── functions/ │ └── getCurrentPrice.js # Deno — fetches live stock price via Yahoo Finance │ ├── entities/ │ ├── Position.json # Saved trade positions schema │ └── UserPreferences.json # User default account/risk settings schema │ └── Layout.js # App shell: header, nav, GA script, favicon, Toaster
| Field | Type | Description |
|---|---|---|
| ticker | string (required) | Stock ticker symbol |
| position_type | enum: long, short |
Direction of trade |
| account_size | number | Account size in $ |
| risk_value | number | Risk value (% or $) |
| risk_type | enum: percent, dollar |
Risk input type |
| stop_loss | number | Stop loss price |
| entries | array {price, shares} |
All entry prices and share counts |
| avg_price | number | Calculated weighted average entry |
| total_shares | number | Total shares across all entries |
| max_risk | number | Max allowed risk in $ |
| current_risk | number | Current risk in $ |
| risk_used_percent | number | % of risk budget used |
Built-in auto fields:
id,created_date,updated_date,created_by
| Field | Type | Description |
|---|---|---|
| account_size | number | Default account size |
| risk_value | number | Default risk value |
| risk_type | enum: percent, dollar |
Default risk type |
- Trigger:
base44.functions.invoke('getCurrentPrice', { ticker }) - Returns:
{ price, change, changesPercentage, ticker } - Data source: Yahoo Finance public API — no API key required
- Endpoint:
https://query1.finance.yahoo.com/v8/finance/chart/{SYMBOL}?interval=1d&range=1d - How it works: Reads
meta.regularMarketPricefor current price andmeta.chartPreviousClosefor previous close, then calculates change and change %. - Refresh rate in UI: Every 30 seconds (via
setIntervalinProgressGaugecomponent)
| Service | Purpose | Auth |
|---|---|---|
| Yahoo Finance | Live stock prices (real-time) | Public API — no key required |
| Google Analytics 4 | Usage tracking | Tracking ID: G-4T50W9SNH1 (injected in Layout) |
| Google AdSense | Ad monetization | Publisher ID set in AdSenseAd component |
Note: An
FMP_API_KEYsecret exists in the environment but is not used — it is a legacy leftover and can be safely deleted.
- Multi-Entry Position Sizing — Add multiple entries; app calculates weighted average cost
- Risk Budget Engine — Define risk as % of account or fixed $; shows max shares, room to add, risk bar
- Profit Target Planner — R-multiple targets (1R–5R) with trailing stop strategies (%, ATR, highest high)
- Live Position Tracker — Real-time price via Yahoo Finance, auto-refreshes every 30s; shows P&L + progress bar
- P&L Scenario Chart — Bar chart showing profit/loss at each R-multiple
- Save & Share — Save positions to DB (requires login); share via base64-encoded URL (no login needed)
- User Preferences — Default account size and risk settings auto-populate the calculator on load
- Long & Short Support — All calculations fully adapt for both directions
- Color scheme: Dark mode only — bg
#0a0e17, cards#111827, borders#1e293b - Accent palette: Blue
#448aff· Green#00e676· Red#ff5252· Purple#7c4dff - Numbers/prices: Always
font-mono - Card style:
rounded-2xl,border border-[#1e293b],bg-[#111827] - Responsive: Mobile-first; single column on mobile, 2-col grid at
lg: - Conditional rendering: All result cards (risk, live position, targets, chart) are hidden
until valid entries exist (
avgPrice > 0 && totalShares > 0)