My second Project as a Software Developer

A React Native Mobile Application that can scan qr codes, add nfts to cart, and checkout using stripe.

1. Open Camera on Button Press
2. Scan QR Code using Camera
3. Open a page from the scanned QR code
4. Create Expo project
5. Install QR code Libraries
6. Create a view with button
7. On button press open Camera
8. Scan QR Code
9. If QR Code is NFT, open the associated link

Update:

I have come across a number of expo libraries, tools, and react native aids that helped me create a working MVP app here:

QR Code Scanner - Snack

useEffect Hook lets you perform side effects in function components, here it is an async function awaiting Permission to the camera.

Update: I was given 3 repos to work on

1. MobileNFT
2. MobileNFT-Kiosk
3. MobileNFT-API

Design Markup

I’ll be using some of my own repos for this, I’ll update once back end talks to front end.

Connect Any API to your Smart Contracts

Showed boss what I had and he didn'tLike that I used opensea API

He wants me to build a custom Front end and backend.

MVP Update:

The app now uses swiper, expo, stripe, and firebase/firestore to function as in this diagram:

FAST FORWARD:

At this point we’ve achieved an MVP versions using 3 separate projects.

• React native: A mobile app for browsing NFTs and Scanning QR Codes from the Kiosk
• Create-React-App: A static kiosk where the respective NFT is displayed with a QR code that is understandable to the Mobile App
• Nextjs: A react app for curators and admins to manage the NFT’s displayed and available

The react native app was built using Expo with a snack published to demonstrate QR code functionality.

The Kiosk is to be displayed on ATM owned by Chainbytes LLC

The NextJS App takes advantage of the NextJS internal API and NextAuth library to allow for API functionality with the React Native App.

Making the App better

Feature Requests

React Native

• Create customer on checkout- no initial auth
• NFT Card display — Display individual NFT’s in their own card

NextJS

• Add multiple network support (Currently just Ethereum)
• Move to personal smart contract for Minting