How We Ended Up Here
We began at a hackathon in which we were hoping to be unique—but our original ideas (e.g., the web app or native app that would control a robot, is capable of analyze & demilitarize the millions of landmines.) were too revolutionary but the project budget is too high. Seeking something new, we moved toward creating a product that would analyze and model complex mathematical, chemical, and physical equations in real-time. Inspired by this vision, we set out to build FormulaFocus, a platform not just for solving equations, but for visualizing millions of possible solutions at scale.
What We Learned
1. Learning about Bolt.new: Bolt.new is a browser-native, AI-augmented full-stack development environment in WebContainers. It was ideal for rapid iteration, with live preview, package install, and debug—without local setup. But we discovered that strongly-prompted instructions are essential; vague prompts can lead to broken tests or misplaced tokens.
2. LaTeX Compatibility: We discovered math.js does not natively parse LaTeX. Employing libraries like tex-math-parser helped us convert TeX to math.js-compatible expressions ($\\texttt{tex-math-parser}$ is specifically intended for this purpose)
3. Token Optimization: With a monthly cap of ~10 million tokens, we learned how to structure multi-part commands and batch our queries to save tokens and stay below the limit.
How We Built It
1. Project Setup in Bolt.new Used React + Node.js automatically scaffolded by Bolt.new. Installed math.js and tex-math-parser via npm and set up live preview and deployment capability within Bolt's environment
2. Formula Input & Validation Made a LaTeX editor component (via MathQuill or CodeCogs API) in which to enter user input. Then utilized tex-math-parser to convert input into an AST compatible with math.js.
3. Formula Analysis & Simulation Developed utility functions (formulaUtils.ts) to communicate with math.js, compute results, and run trajectory simulations. Ensured that validation, fallback behavior, and human-readable error messages were implemented.
4. AI Solution Guide Developed an "AI Solution Guide" page powered by the Altcha API. It renders step-by-step breakdowns, LaTeX-processed solutions, and interactive visualizations.
5. Error Handling & Debugging Leveraged Bolt's "Attempt Fix" feature and support documents to detect silent errors effectively. We incorporated careful logging and user feedback loops into every step.
Challenges We Faced
1. Syntax Problems: Translating LaTeX like e^{i\pi}+1=0 to exp(i*pi)+1 in order to be compatible with math.js taught us the parsing layers lesson.
2. Fragile Prompts: Early AI-facilitated scaffolding broke tests due to inaccurate instructions. We remedied this by breaking our tasks into clearly defined, numbered steps and expressly defining modules and files.
3. Token Overuse: Naive prompting within sessions was draining our token budget, and also bolt's strange behavior reset effects, logic & functionality of app. We switched to batching operations and concise but structured prompts to gain maximum utilization.
4. Visible Integration Failures: Features still wouldn't work even when Bolt reported successful updates (e.g., new altchaApi.ts, enhanced validation, LaTeX support). We realized that we needed to manually test every component, add guardrails, and trap regressions at once.
Final Thoughts
Despite the setbacks, we rebranded "Formula Focus" as a powerful tool for dynamic formula simulation and analysis. Bolt.new allowed rapid prototyping and collaboration, but only where coupled with strong, accurate prompting and diligent debugging.
We can't wait to introduce you to a tool that can parse complex formulas, generate complex solutions, and visualize results in scale. Our project reflects our grit and persistence—and we can't wait to unveil it during the hackathon!
Log in or sign up for Devpost to join the conversation.