PrimapePrediction
Theme

Technology Stack

Overview

This page explains our technology choices in simple language so that anyone, regardless of their technical background, can understand how each part contributes to our prediction market platform.

Frontend Technologies

Our frontend is built to provide users with a modern, responsive, and interactive experience. Here are the main tools and libraries we use:

  • Next.js: Our primary framework, which not only renders the website but also manages server-side logic via API routes. It makes our platform fast and SEO-friendly.
  • Radix UI: A set of pre-built, accessible components that help us build user interfaces that work for everyone.
  • Tailwind CSS: This is a utility-first CSS framework that speeds up our design process and helps maintain a visually consistent look across the application. It also allows us to easily switch between dark, light, and ape themes.
  • Lucide React: A collection of simple and scalable icons, which adds a visual boost to our user interface.
  • React Context: We use this for managing the state of our application, ensuring that different parts of the app can share and update data smoothly.
  • TypeScript: Adding strict type-checking improves stability and reduces bugs by catching errors early during development.

These choices help us build an interface that is both easy to navigate and highly interactive, making sure users enjoy every moment on Primape Markets.

Backend Technologies

The backend is the engine behind all the functionalities of our platform. It deals with everything from processing transactions to managing user data. Here's what we use:

  • Next.js API Routes: These are used to handle backend operations like processing user engagements (e.g., listening, sharing, commenting) and validating actions. They bring a secure bridge between the blockchain and our user interface.
  • Axios: This library allows efficient communication with our API endpoints, making it simple to fetch and send data.
  • jsonwebtoken: Ensures secure token creation and validation for protecting users' sessions and data.
  • Thirdweb: Integrates wallet connections and smart contract interactions so users can easily connect their crypto wallets and interact with the blockchain.
  • Smart Contracts (Solidity & OpenZeppelin):
    • Our contracts, like PrimapePrediction.sol and EngageToEarn.sol, are written in Solidity.
    • OpenZeppelin libraries are used to build secure and well-tested contracts.
  • Viem: Works alongside our third-party integrations to provide seamless communication with our smart contracts.

These backend components work together to make sure that all user actions – from placing bets to engaging with content – are correctly processed and securely recorded on the blockchain.

Infrastructure and Deployment

For the reliability and smooth operation of our platform, we have chosen robust infrastructure and deployment tools:

  • Hosting on Vercel: Our Next.js application is deployed on Vercel, ensuring fast loading times and reliable global performance.
  • CI/CD Pipelines: Tools like Github Actions (and similar CI/CD systems) are used to continually test and deploy changes, which minimizes downtime and keeps our updates smooth.
  • Version Control Systems (Git): Our development is coordinated via Git, ensuring that code changes are tracked and managed effectively across the team.
  • PWA Configuration (next-pwa): We have set up our project as a Progressive Web App (PWA) to provide a more app-like, offline-enabled experience.

Together, these infrastructure choices ensure our platform can scale easily, remain secure, and deploy updates quickly.

Third-Party Integrations

Integrations with external services help us extend the platform's functionality, especially in areas where specialized services excel:

  • Thirdweb: Beyond wallet connection, it handles smart contract interactions seamlessly, providing a trusted bridge between users and our blockchain-based features.
  • Social Media Verification: For the engagement-to-earn system, we verify actions (like Twitter handle validations) through dedicated API endpoints, ensuring that rewards are given fairly and securely.
  • Utility Libraries: Tools like clsx for conditional styling and tailwind-merge for managing CSS classes further optimize our development process.

These integrations leverage tried-and-tested systems to enhance functionality and security, ensuring a richer experience for our users.

Security and Performance Considerations

Keeping our users safe and the platform fast is a top priority. Here's how we manage these areas:

Security Measures

  • Wallet Authentication: Using Thirdweb to safely connect diverse wallets ensures that only authenticated transactions occur on the blockchain.
  • Smart Contract Audits: Our smart contracts are built using OpenZeppelin best practices and are subject to rigorous testing and audits.
  • API Validation and Rate Limiting: Our endpoints use jsonwebtoken and in-memory (with a plan to move to systems like Redis) rate limiting to prevent abuse.

Performance Optimizations

  • Efficient Data Fetching: Axios and Next.js APIs ensure that data is loaded quickly, with page load times kept under 2 seconds under normal conditions.
  • Scalable Infrastructure: Hosting on Vercel and using CI/CD pipelines ensure that our system can handle growth without compromising speed.

These measures work together to protect users' data and provide a consistently high-performance experience.

Conclusion

In summary, our technology choices for Primape Markets are carefully selected to align with our goals of providing a secure, fast, and engaging prediction market platform. These choices not only meet the current needs of Primape Markets but also set a strong foundation for future enhancements, ensuring the project stays innovative and user-friendly in the ever-evolving world of decentralized applications.