> For the complete documentation index, see [llms.txt](https://docs.pixeljourney.xyz/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.pixeljourney.xyz/pxlabs-innovation-lab/pxlabs/px-dev-examples.md). # PxDev Examples Vault: 170+ Pixel-Perfect Educational Code Quests > **The complete, production-grade educational map for building Web3 the Pixel Journey way.** From curious explorer to confident on-chain architect — one pixel at a time. Welcome to the **PxDev Examples Vault** — the crown jewel of our developer education efforts inside PxLabs. After more than **1,050 days** of relentless building since Pixel Journey first landed on the WAX Blockchain in 2023, and following the legendary Spring 2024 Pixal PFP mint that ignited our community, we have reached a profound milestone. We have transformed our GitHub organization into a true **open-source educational powerhouse** dedicated to making every corner of Web3 accessible, understandable, and *fun* through the warm, pixel-perfect lens of Pixel Journey. **** ## Our Deep Audit of the Pixel Journey GitHub Org We have thoroughly audited the current state and future vision of the entire organization: * **Public repositories** (visible to all): `gitbook-docs` (the living source of these very docs), `pixel-journey-standards`, `pixel-journey-templates`, `Article-Drafts`, `pixel-journey.github.io`, `alcor-ui` (fork for reference), and the organization profile. * **170+ repositories total** initiated across the org. The vast majority are private during final polishing but are rapidly approaching top-tier educational standards. * Every repository follows our unified **Px Standards**, leverages our **Px Templates**, and aligns with the **Px Design System** for visual and experiential consistency. In their **completed future vision**, these repositories will not be simple code dumps. They will be self-contained, beautifully documented **educational quests** — each one a guided journey that teaches real production patterns we actually use across PxWallet, PxHot, PxMarket, PxStaking, and the entire Px Packages framework. All repos are currently under active development. They will soon be publicly available with complete educational layers, runnable examples, edge-case deep dives, and direct ties back to our Pixal economy, verifiable mechanics, and community-first ethos. ## The Three Foundational Pillars (Completed Vision) These three repositories form the bedrock upon which the entire 170+ vault is built. In their fully realized form they will be living references for the entire Web3 builder community. ### 1. pixel-journey-design-system **** *Status: Private preview — request access or watch for public release* **Future Completed Vision**: The single source of truth for every visual and interactive element in the Pixel Journey ecosystem. A comprehensive, token-based design system featuring our signature luxury-dark glassmorphic aesthetic, CRT scanlines, responsive pixel grids, 120Hz fluid animations, haptics-ready components, and fully accessible PxUI primitives. Every portal, dApp, and example in the vault will import and extend this system so builders inherit pixel-perfect consistency without reinventing the wheel. ### 2. pixel-journey-templates (The Official Handbook & AI Collaboration Layer) **** *Status: Private preview — request access or watch for public release* **Future Completed Vision**: The central coordination layer and living handbook for *how we build* everything in the Pixel Journey organization — including how we collaborate with specialized AI agents. It defines the standards, recommended patterns, architectural principles, ecosystem overview, and high-quality AI prompt templates that keep every Px project consistent, high-quality, educational, production-ready, and fast to develop. **7 Foundational Principles** (non-negotiable, detailed in the handbook): 1. **ZERO Custom Contract Overhead** — Prefer client-side and existing on-chain primitives. 2. **Client-Side Sovereignty** — Users control their experience and keys. 3. **On-Chain Entropy for Randomness** — Fair, verifiable randomness. 4. **WharfKit First** — Session Kit for seamless wallet integration. 5. **Design System Alignment** — Consistent beautiful UI/UX. 6. **Educational Excellence** — Every artifact teaches and empowers. 7. **Config-Driven & Composable** — Flexible, maintainable architectures. It includes quick-start paths for new humans and AI agents, specialized AI personas (px-core-architect, wallet-security-engineer, educational-documenter, etc.), pattern overviews, educational quality standards, and ready-to-use project scaffolds (Next.js dApp, analytics grids, etc.). This handbook works hand-in-glove with the Standards Codex and Design System. Every quest in the PxDev Examples Vault is built to exemplify these principles and patterns in production code. ### 3. pixel-journey-standards (The Living Standards Codex) **** *Status: Private preview — request access or watch for public release* **Future Completed Vision**: The official **Pixel Journey Standards Codex** — the single source of truth for what "Px Brand Standards & Levels of Excellence" means across strategy, code quality, documentation, educational value, UI/UX, security, and alignment with our principles. It is built for **long-term participants** (humans and AI collaborators) who want to create extraordinary, educational, and empowering Web3 experiences. Core architectural principles include: * **Existing Public Primitives First** — Build excellent UI/UX and client-side systems on top of public WAX/Antelope infrastructure. * **Client-Side State & Local-First** — Hyperion + encrypted local storage as source of truth. * **On-Chain Entropy** — TX hash + block header derivation for verifiable mechanics (the foundation of PxHot pairing and trustless randomness). The codex covers UI/UX design pillars, engineering foundations (testing, versioning, documentation, observability, security review), educational blueprints, quality tools (scorecards, checklists, AI self-audit guides), and monorepo standards. It is tightly integrated with the templates repo and these very docs. Every quest in the PxDev Examples Vault is designed to exemplify and teach these standards in action. ## The PxDev Examples Vault — Categorized Educational Quests (Future Completed Form) In their fully polished and public state, the 170+ repositories will be organized into clear categories. Each repository will function as a complete, self-contained level in a grand educational game — with crystal-clear READMEs that explain *why* a pattern exists, runnable code you can clone and experiment with immediately, exhaustive comments, edge-case "boss fights," and explicit connections back to real Pixel Journey production systems (verifiable TX seeds, Pixal tier logic, PXJ economy loops, on-chain XP/streaks, etc.). Below is the high-level map of what the completed vault will offer. This is how we will lead new explorers through **absolutely all of Web3** — starting on WAX and expanding outward. ### WAX & Antelope Blockchain Fundamentals **Purpose in completed vision**: Take builders from "What is a smart contract?" to confident interaction with WAX resources, verifiable transactions, and core Antelope patterns used across our entire ecosystem. **Example Quests (future public repos)**: * `px-wax-smart-contract-101` — Complete introduction to eosio.token, actions, tables, and notifications with Pixel Journey flavor. * `px-resource-powerup-and-staking-patterns` — Production patterns for CPU/NET/RAM management, power-up flows, and staking integration. * `px-verifiable-tx-memo-seeds` — The exact technique behind PxHot pairing and trustless on-chain randomness (On-Chain Entropy principle in action). **Skills unlocked**: Smart contract reading/writing, resource economics, on-chain verifiability, debugging with Hyperion. ### Next.js 15 + Modern Frontend dApp Architecture **Purpose**: Master the exact stack we use for PxWallet, PxHot, and future portals. Real-time data, beautiful UX, and production reliability. **Example Quests**: * `px-nextjs-15-wharfkit-pixel-shell` — Full boilerplate with our glassmorphic/CRT theme, state management, and signing flows. * `px-real-time-leaderboard-and-xp-system` — Live updating leaderboards, streaks, badges, and on-chain XP tracking. * `px-dapp-state-management-zustand-tanstack` — Battle-tested patterns for complex, cached, reactive dApp state. **Skills unlocked**: Modern React/Next.js Web3 frontend, real-time UX, performant data layers. ### NFT, PFP & AtomicAssets Mastery **Purpose**: Everything needed to build rich NFT experiences, PFP galleries, tier systems, and integrations with our Pixal economy. **Example Quests**: * `px-atomicassets-pfp-gallery-with-hot-or-not` — Full gallery + embedded verifiable voting arena. * `px-pixal-tier-logic-holder-stacker-whale-kraken` — On-chain and frontend logic for our four-tier Pixal system plus WaxRock. * `px-nft-mint-burn-stake-crafting-flows` — Complete lifecycle patterns used in recycling, crafting, and airdrops. **Skills unlocked**: AtomicAssets SDK, NFT metadata, staking mechanics, economy loops. ### DeFi, Swaps, Analytics & Live Data Grids **Purpose**: Build the beautiful, informative analytics surfaces and DeFi interactions that power PxTicker-style experiences and yield optimization. **Example Quests**: * `px-alcor-swap-and-routing-integration` — Full swap flow with quotes, routing, and slippage protection. * `px-live-price-and-analytics-grid` — Animated, real-time grids for WAX, PXJ, WPIXAL, and ecosystem tokens. * `px-on-chain-defi-yield-and-arbitrage-watchers` — Patterns for monitoring farms, LP rewards, and simple automation. **Skills unlocked**: DEX integration (Alcor + others), data visualization, DeFi user flows. ### Wallet Architectures, Extensions & Key Management **Purpose**: The most security-sensitive and user-critical part of Web3. Learn how we build safe, delightful wallet experiences and tools. **Example Quests**: * `px-chrome-mv3-extension-vault-patterns` — Background scripts, content scripts, popup UI, and secure signing flows. * `px-encrypted-vault-and-auto-sign` — Master password vaults, encrypted storage, and optional auto-sign for trusted dApps. * `px-cross-chain-key-derivation-wax-evm-solana` — Secure derivation paths without ever exposing private keys (core to future multi-chain vision). **Skills unlocked**: Chrome Extension MV3, secure key management, self-custody UX, cross-chain architecture. ### Verifiable On-Chain Mechanics & Game Systems **Purpose**: The secret sauce behind PxHot and other interactive experiences. Learn how to build trustless, fun, verifiable gameplay and progression. **Example Quests**: * `px-hot-or-not-voting-arena-full` — Complete verifiable pairing, voting, reward splitting, and anti-cheat patterns. * `px-xp-streaks-badges-and-leaderboards` — On-chain progression systems with anti-sybil and fair reward distribution. * `px-on-chain-randomness-and-game-mechanics` — TX-memo seeds, commit-reveal, and other verifiable randomness techniques (directly embodying our On-Chain Entropy principle). **Skills unlocked**: Verifiable computation, game design on-chain, fair and transparent mechanics. ### i18n, PWA, Offline Resilience & Pixel UX Polish **Purpose**: Make your dApps feel premium, accessible worldwide, and resilient even when the chain is quiet. **Example Quests**: * `px-i18n-8-plus-locales-complete` — Full internationalization setup with our exact locale files and tooling. * `px-pwa-offline-first-and-service-worker` — Patterns that let experiences continue gracefully offline. * `px-glassmorphic-crt-haptics-and-120hz-ux` — The complete visual and feel language of Pixel Journey. **Skills unlocked**: Internationalization, Progressive Web Apps, delightful micro-interactions and accessibility. ### Automation, Tooling, Bots & Advanced Infrastructure **Purpose**: The behind-the-scenes systems that keep our ecosystem running smoothly and our own development velocity high. **Example Quests**: * `px-hyperion-history-indexing-and-hooks` — Production patterns for rich transaction history and analytics. * `px-automation-schedulers-and-resource-monitors` — Safe automation for power-ups, claims, and monitoring. * `px-ai-assisted-dev-and-agent-orchestration` — Meta-patterns for how we leverage AI agents while maintaining human oversight and code quality (aligned with our AI self-audit standards and specialized personas in the templates handbook). **Skills unlocked**: Backend automation, indexing, monitoring, responsible AI-augmented development. ### Standards, Testing, Security & Documentation Excellence **Purpose**: The "how we keep everything sane and trustworthy at scale" layer. Every serious builder eventually needs this. **Example Quests**: * `px-security-audit-checklist-for-wax-dapps` — Our internal security review process turned into an educational checklist (directly from the Standards Codex). * `px-testing-strategies-unit-integration-e2e` — Practical testing approaches for smart contracts and frontends. * `px-documentation-and-knowledge-base-patterns` — How we structure READMEs, guides, and these very docs for maximum clarity (educational blueprint standards in action). **Skills unlocked**: Professional engineering practices, security mindset, maintainable codebases. ## Cross-References & Related Resources The PxDev Examples Vault does not exist in isolation. It is designed to work hand-in-hand with the rest of our documentation ecosystem: * [**For Developers**](https://docs.pixeljourney.xyz/journey-use-cases/for-developers/) — The welcoming hub page that funnels builders into this vault and the broader resources. * [**WAX / Antelope Developer Guides**](https://docs.pixeljourney.xyz/education/antelope-ecosystem-guides/wax/developer-guides/) — Theory, best practices, and WharfKit patterns that pair perfectly with the runnable quests here. * [**Solana Developer Guides**](https://docs.pixeljourney.xyz/education/solana-ecosystem-guides/developer-guides/) — Complementary modern patterns; many frontend, state, and architectural lessons from the vault translate directly. * [**EVM Developer Guides**](https://docs.pixeljourney.xyz/education/evm-ecosystem-guides/developer-guides/) — Mature tooling and cross-chain patterns; shared principles from the vault apply across ecosystems. * [**PxLabs Overview**](https://docs.pixeljourney.xyz/pxlabs/) — The innovation lab home of this vault, Px Packages, and all our experimental platforms. * [**Px Packages & Px Portals**](https://docs.pixeljourney.xyz/pxlabs/px-packages/) — The modular foundation and architectural vision that many of these examples support and exemplify. * **GitHub Org**: — Star it, request access to private repos, and watch for new public educational releases. ## How the PxDev Examples Vault Completes Your Web3 Journey Most Web3 tutorials teach isolated concepts in a vacuum. The PxDev Examples Vault teaches **complete, interconnected journeys** — the exact patterns, trade-offs, and philosophies we have battle-tested across 1,050+ days of production building on WAX and our expanding multi-chain vision. New builders can start with the fundamentals and progressively unlock: * Full-stack dApp development on WAX * Secure wallet and key management * Rich NFT and economy systems * Real-time interactive experiences * Multi-chain thinking and cross-chain derivation * Professional engineering standards (directly from our Living Standards Codex) * AI-augmented development workflows (from the templates handbook) All while staying inside the playful, meme-loving, community-first, educational soul of Pixel Journey. This vault, together with our massive Education section (ecosystem guides for WAX, Solana, EVM and more) and the persona-based Journey Use Cases, makes these docs the most complete, welcoming, and pixel-perfect on-ramp to Web3 that exists today. ## Your Next Steps as a Pixel Dev Explorer 1. Visit **** and star the organization. 2. Browse or search for repositories. Request access on any private repo that excites you (or message us on Discord / @PxJourney — we happily grant early access to genuine builders). 3. Clone a quest that matches your current level, run it locally, and start experimenting. 4. Join the Discord, share what you build, and help shape future quests. Every public release of these repositories will include clear "Completed Vision" badges and migration notes so you always know you are learning production-grade, future-proof patterns. **From our 2023 WAX genesis, through the Spring 2024 Pixal mint, to 170+ developer quests today — the map is now yours.** The pixelverse of code is wide open. Now it is your turn to start minting knowledge, building beautiful experiences, and contributing back to the journey. *** **Crafting pixels. Building journeys. Teaching the future.** 🛸🪅 *All content is educational. DYOR. Not financial advice. Development is iterative — these repositories and this documentation will continue evolving with the ecosystem. Your feedback directly shapes the final pixel-perfect form.*