Welcome to the official repository for the LockItTrade Landing Page, a premium, high-fidelity, and feature-rich front-end application designed for modern traders, prop firm candidates, and trading communities.
🌐 Live Site: https://www.lockittrade.com
Built with Next.js 14 (App Router), TypeScript, and Tailwind CSS, this platform showcases LockItTrade's cutting-edge risk management tools, trading gamification features, and prop firm readiness evaluation utilities.
The LockItTrade landing page is more than just a marketing site. It features several fully interactive, custom-built tools designed to demonstrate the power of the core LockItTrade ecosystem:
- Ready Hero & Score Gauge: Evaluates a trader's performance metrics and displays a visual gauge of their readiness for prop firm funding.
- Requirements Checklist: A dynamic, checklist-driven evaluation tool tracking daily risk, compliance parameters, and profit target consistency.
- Prop Firm Matcher: Matches traders with custom-tailored prop firms based on their individual style, funding goals, and risk profiles.
- A realistic mockup dashboard showcasing simulated and tracked live trading rule violations.
- Tracks parameters such as:
- Max Drawdown
- Daily Loss Limit
- Position Sizing
- Monitors active and backtested trading strategies to evaluate how closely they adhere to pre-defined risk constraints.
- Visualizes data using beautiful, interactive charts built on Recharts.
- Displays the app's advanced feature set (AI Trading Coach, Prop Firm Ready, Violation Tracker, Strategy Compliance) in a modern, responsive Bento Grid layout.
- Introduces trading challenges, badges, leaderboards, and achievements to keep traders engaged, disciplined, and constantly improving.
- Aesthetics: Sleek dark mode, harmonious HSL tailored palettes, smooth gradients, and glassmorphism.
- Animations: Fluid micro-animations, hover effects, and interactive states driven by Framer Motion.
- Backgrounds: Custom particle animations and AI grid visuals to create an immersive user experience.
This project uses modern web technologies optimized for speed, scalability, and premium user experience:
- Framework: Next.js 14 (App Router)
- Language: TypeScript
- Styling: Tailwind CSS
- Component Library: Radix UI (Headless, accessible UI primitives)
- Animations: Framer Motion
- Charts & Data Viz: Recharts
- Icons: Lucide React
- Notifications: Sonner
- Form Management: React Hook Form & Zod
Make sure you have Node.js installed (v18.x or higher is recommended) and a package manager like npm, yarn, or bun.
-
Clone the repository:
git clone https://github.com/stackified/lockittrade-landing.git cd lockittrade-landing -
Install dependencies:
npm install # or bun install -
Run the development server:
npm run dev # or bun dev -
Build for production:
npm run build # or bun run build
The site is a static export, hosted in two places:
- Production: www.lockittrade.com, deployed on Vercel (see
vercel.json). On Vercel the base path is empty, so the site is served from the domain root. - GitHub Pages: every push to the
devbranch runs.github/workflows/deploy.yml, which builds the site and publishes it to stackified.github.io/lockittrade-landing under the/lockittrade-landingbase path.
- Next.js is configured for static export (
output: 'export'innext.config.js). - When
npm run buildis executed, Next.js generates static HTML/CSS/JS files in theoutdirectory. - The base path is set in
next.config.js: empty on Vercel and in local development,/lockittrade-landingfor other production builds, and overridable withNEXT_PUBLIC_BASE_PATH.
Proprietary. Copyright (c) 2026 LockItTrade. All rights reserved. Designed and developed by Stackified. See LICENSE.