CryptoGuide

The smartest way to start your crypto journey.

Comment

Inspiration

When I first tried to learn about crypto and blockchain, I was completely lost. Every resource I found was either too technical, too generic, or assumed I already knew the basics. YouTube videos were hours long with no clear starting point.

I kept thinking — why isn't there something that just talks to me, understands what I want to learn, and guides me step by step?

That question became CryptoGuide. When I discovered the ASI-1 API by Fetch.ai and its agentic reasoning capabilities, I immediately saw the potential to build a truly personalized Web3 learning companion — not just a chatbot, but an actual guide that knows your goal and builds your path.

What it does

CryptoGuide is a Web3 onboarding platform powered by ASI-1 that makes learning blockchain, crypto, DeFi and NFTs accessible to complete beginners through three core features:

🤖 ASI-1 Chat Agent — A conversational AI agent that explains Web3 concepts in plain language. It knows your goal (investing, DeFi, NFTs, or general Web3) and your experience level, so every answer is personalized to you. No jargon unless you ask for it.

🗺️ AI Roadmap Generator — After answering just two questions at signup, ASI-1 generates a personalized week-by-week learning roadmap built specifically for your goal. Not a generic template — a dynamic plan created by the agent.

📊 Portfolio Simulator — Practice buying and selling real crypto with $10,000 in virtual cash at live market prices. Learn investing completely risk-free before touching real money.

Every conversation is saved to Firebase Firestore so your learning history is always there when you come back.

How I built it

The stack was chosen to be fast to build, easy to deploy, and production-ready:

Frontend — React 18 with Create React App. All styling is done with CSS-in-JS inline styles for full control without a CSS framework. Firebase Authentication handles login and Firestore stores user profiles and chat history.

Backend — Python Flask acts as a secure API proxy between the frontend and ASI-1. The API key never touches the browser. The backend also handles rate limiting (20 requests per minute per IP), message sanitization, and dynamic system prompt building based on the user's profile.

ASI-1 Integration — The core of the product. Every chat message sends the full conversation history plus a dynamically built system prompt that includes the user's name, goal, and experience level. For the roadmap, a structured prompt asks ASI-1 to return a JSON array of 6 learning steps.

$$\text{System Prompt} = f(\text{name}, \text{goal}, \text{level}) \rightarrow \text{Personalized Response}$$

Deployment — Frontend on Vercel, backend on Railway. Environment variables keep all API keys secure.

Challenges I ran into

Chat history persistence was the hardest problem. After logout and login, the chat history was disappearing. The root cause was a race condition — authLoaded was being set to true before the Firestore profile fetch completed, so the app was routing to onboarding before onboardingDone had the correct value. The fix was to move setAuthLoaded(true) to after the entire async profile fetch completed.

Vercel deployment took multiple attempts due to ESLint errors being treated as build failures in CI mode. The fix was adding DISABLE_ESLINT_PLUGIN=true to the build command.

CORS configuration — The Flask backend needed to be updated to allow requests from the Vercel domain specifically, not just localhost.

Accomplishments that I'm proud of

  • Built a fully functional agentic AI product from scratch in a short time
  • ASI-1 integration that goes beyond a simple chatbot — three distinct use cases including structured roadmap generation with JSON output parsing
  • Persistent chat history that survives logout and login using Firestore subcollections
  • A production-ready security setup — API key proxy, rate limiting, message sanitization, and environment variable management
  • Successfully deployed a full-stack app with a React frontend on Vercel and a Python backend on Railway
  • Demo mode fallback — the app remains fully demonstrable even when the backend is offline

What I learned

  • Agentic AI design — How to structure system prompts dynamically based on user context to get truly personalized responses from ASI-1
  • Firebase Firestore — Subcollections for chat sessions, real-time auth state management, and handling the async nature of Firestore reads during app initialization
  • Full-stack deployment — The difference between frontend and backend hosting, environment variables in CI/CD, CORS configuration for cross-origin requests
  • Security best practices — Never expose API keys in frontend code, use proxy backends
  • React state management — How to avoid race conditions in auth flows using refs and careful ordering of async state updates

What's next for CryptoGuide

  • 🔴 Live crypto prices — Connect to a real-time price API so the portfolio simulator uses actual current prices
  • 🏆 XP and badges — Gamification system to reward learning milestones and roadmap completion
  • 🌐 Multi-language support — Explain Web3 concepts in regional languages including Hindi and Marathi
  • 📱 Mobile app — React Native version for Android and iOS
  • 🤝 Community features — Share your roadmap progress and portfolio with other learners

Built With

Share this project:

Updates