DAGSNAP

• 

  App Not Connected

• 

  Connect Modal

• 

  Connection Request to Metamask

• 

  Connected with Metamask

• 

  App Connected

• 

  Send Crypto Modal

• 

  Receive Crypto Modal

🌟 Inspiration

MetaMask's limited blockchain support inspired us to integrate DAG functionality using MetaMask Snaps, expanding crypto accessibility 🚀.

🔧 What it does

DagSnap enables users to:

• 🪙 Create a DAG wallet
• 💳 Buy, send, and manage DAG tokens
• 📲 Directly interact with DAG through MetaMask

🛠️ How we built it

We developed a custom MetaMask Snap and integrated DAG chain into it by using dag4.js. We built everything from scratch, as there were no existing Next.js + Snap templates available, so we developed our own template 💡.

🧗‍♂️ Challenges we ran into

Being first-time builders with MetaMask Snaps, we faced several challenges:

• 🔍 Searching for Snap examples that used Next.js led to no results
• ⚙️ Integrating dag4.js threw numerous errors
• 💡 We eventually resolved these issues by moving to a proxy server

🏆 Accomplishments that we're proud of

• 🎉 Successfully integrating DAG functionality into MetaMask, making it more versatile for users
• 🖥️ Building a Next.js boilerplate with Snaps functionality
• ✨ Designing an awesome UI for DAG with MetaMask Snap

📚 What we learned

We gained valuable insights into:

• 🛠️ MetaMask Snap development
• 🔗 DAG blockchain, including metagraphs, rewards, APIs, and its ecosystem

🔮 What's next for DagSnap

• 🚀 Expanding features and improving UI/UX
• 🔗 Supporting additional DAG-based tokens
• 🌐 Publishing the Snap and hosting it on a dedicated domain

Built With

• coingecko
• dag
• dag4.js
• express.js
• metagraphs
• metamask
• metamask-snaps
• nextjs
• tailwindcss
• typescript