feat: added frontned, configure README.md, .gitignore .env

.gitignore

@@ -1 +1,23 @@
-build/*
+marketplace_contract/build/*
+
+test_smartcontract/node_modules/
+test_smartcontract/package-lock.json/
+test_smartcontract/.env/
+
+frontend/.env
+*.env
+*.env.local
+*.env.development
+*.env.production
+
+#ignore all those node_modules and npm, pnpm , yarn lock files
+frontend/node_modules/
+*node_modules/
+*.next
+*pnpm-lock.yaml
+*package-lock.json
+*yarn.lock
+*.log
+
+front-end/node_modules/
+

README.md

@@ -0,0 +1,146 @@
+# QuestismOS – Ranked Gamified NFTs Marketplace with zkLogin to better bridge Web2 to Web3.
+
+## 🏆 Overview
+
+**QuestismOS** is a **gamified NFT marketplace** built on **Sui** that allows NFTs to **level up or rank up** when completing certain quests or tasks.  
+Our mission is to create a **better bridge from Web2 to Web3**, making blockchain accessible, rewarding, and fun.
+
+Players and collectors can **buy, sell, auction, and interact** with NFTs that evolve dynamically over time — creating a sense of progression like in gaming.  
+We also implement **zkLogin** for seamless onboarding and **dynamic NFT fields** to support special items, seasonal promotions, and rewards for active buyers.
+
+---
+
+## 🎯 Key Features
+
+### 🖼 NFT Marketplace Core
+- **Mint NFTs** with security checks.
+- **Buy & Sell NFTs** with configurable transaction fees (2–5%).
+- **Auction System** with bidding logic.
+- **Dynamic NFTs** that level up or rank up based on trades, purchases, or quest completions.
+- **Rarity Display** on all listing cards.
+- **Special/Seasonal Categories** (e.g., Summer Sale).
+
+### 🎮 Gamification & Rewards
+- Incentivized early buyers and reviewers via **Reward Pool**.
+- Rank-up system for frequent traders.
+- Coupons and perks for loyal buyers.
+
+### 🛡 Web3 & Security
+- zkLogin integration for **passwordless authentication**.
+- Gas optimization with verification and parallel processing.
+- Optional Web2 backend integration (Supabase) for history and user profiles.
+
+### 🌍 Blockchain for Good
+Aligned with **United Nations’ Sustainable Development Goals (SDGs)**, QuestismOS promotes:
+- **Sustainable commerce** through transparent NFT provenance.
+- **Global accessibility** with zkLogin for non-crypto-native users.
+
+---
+
+## 📂 Project Structure
+
+
+### Frontend (React + TypeScript)
+devmatch2/src/
+  ├── components/
+  │ ├── AuctionPopUp.tsx # Auction interaction UI
+  │ ├── ListingPopUp.tsx # NFT listing form
+  │ ├── Navbar.tsx # Navigation bar
+  │ ├── nftCard.tsx # NFT card with rarity display
+  ├── pages/
+  │ ├── Auction.tsx # Auction page
+  │ ├── Landing.tsx # Home & marketplace overview
+  │ ├── Minting.tsx # NFT minting page
+  ├── App.tsx # App routing & layout
+  ├── constants.ts # Contract addresses & config
+  ├── index.css # Styling
+  ├── Layout.tsx # Page layout wrapper
+  ├── main.tsx # App entry point
+  ├── marketplace.tsx # Marketplace UI & contract integration
+  ├── networkConfig.ts # Sui network settings
+  ├── OwnedObjects.tsx # Display user-owned NFTs
+  ├── WalletStatus.tsx # Wallet connection & status
+  └── vite-env.d.ts
+
+
+### Smart Contracts (Move)
+marketplace_contract/
+├── sources/
+│ ├── bidding.move # Auction and bidding logic
+│ ├── marketplace.move # Core marketplace functions (list, buy, sell)
+│ ├── nft.move # NFT object definitions and minting logic
+├── tests/
+│ └── marketplace_contract_tests.move
+└── Move.toml # Sui Move package configuration
+
+
+---
+
+## 🛠 Tech Stack
+
+### Blockchain & Smart Contracts
+- **Sui Move** – Marketplace, NFT, and auction logic.
+- **zkLogin** – Secure passwordless authentication.
+- **Dynamic Fields** – For NFT rank-up and seasonal categorization.
+
+### Frontend
+- **React + TypeScript**
+- **Vite** – Fast build and hot-reload.
+- **Supabase (optional)** – Web2 backend for user history and profiles.
+
+### Development Tools
+- **Figma** – UI/UX prototyping.
+- **Lucidchart** – Architecture diagramming.
+- **Canva** – Pitch deck creation.
+
+---
+
+## 🏗 Architecture
+
+*import the pic later..
+
+
+---
+
+## 🚀 Getting Started on your own local machine..
+
+### Prerequisites
+- Node.js 18+
+- pnpm / npm
+- Sui CLI installed and configured
+
+### Install Frontend
+```bash
+cd devmatch2
+pnpm install
+pnpm run dev
+```
+
+---
+
+## 📜 Hackathon Tracks
+### SUI Track
+- zkLogin Application – Seamless onboarding.
+
+- On-chain Marketplace – Dynamic NFTs & auctions.
+
+### Blockchain for Good Track
+Aligns with SDG 17 goals for sustainability and accessibility. (be more specific later..)
+
+### ChatAndBuild Track
+Leverages Web3 tech for real-world relevance and originality.
+
+## 🤝 Contributions
+Smart Contracts: Wen Zhe, Ian Hon
+
+Frontend & Wallet Integration: Ang Jianming, Ian Hon, Jun Kai
+
+Backend (Supabase): Ian Hon
+
+UI/UX: Jun Kai, Yao Ren
+
+Slides & Pitch Deck: Yao Ren , Ang Jianming
+
+
+## 📄 License
+Apache License – See LICENSE for details.

devmatch2/README.md

@@ -1,92 +1,92 @@
-# Sui dApp Starter Template
-
-This dApp was created using `@mysten/create-dapp` that sets up a basic React
-Client dApp using the following tools:
-
-- [React](https://react.dev/) as the UI framework
-- [TypeScript](https://www.typescriptlang.org/) for type checking
-- [Vite](https://vitejs.dev/) for build tooling
-- [Radix UI](https://www.radix-ui.com/) for pre-built UI components
-- [ESLint](https://eslint.org/) for linting
-- [`@mysten/dapp-kit`](https://sdk.mystenlabs.com/dapp-kit) for connecting to
-  wallets and loading data
-- [pnpm](https://pnpm.io/) for package management
-
-For a full guide on how to build this dApp from scratch, visit this
-[guide](http://docs.sui.io/guides/developer/app-examples/e2e-counter#frontend).
-
-## Deploying your Move code
-
-### Install Sui cli
-
-Before deploying your move code, ensure that you have installed the Sui CLI. You
-can follow the [Sui installation instruction](https://docs.sui.io/build/install)
-to get everything set up.
-
-This template uses `testnet` by default, so we'll need to set up a testnet
-environment in the CLI:
-
-```bash
-sui client new-env --alias testnet --rpc https://fullnode.testnet.sui.io:443
-sui client switch --env testnet
-```
-
-If you haven't set up an address in the sui client yet, you can use the
-following command to get a new address:
-
-```bash
-sui client new-address secp256k1
-```
-
-This well generate a new address and recover phrase for you. You can mark a
-newly created address as you active address by running the following command
-with your new address:
-
-```bash
-sui client switch --address 0xYOUR_ADDRESS...
-```
-
-We can ensure we have some Sui in our new wallet by requesting Sui from the
-faucet `https://faucet.sui.io`.
-
-### Publishing the move package
-
-The move code for this template is located in the `move` directory. To publish
-it, you can enter the `move` directory, and publish it with the Sui CLI:
-
-```bash
-cd move
-sui client publish --gas-budget 100000000 counter
-```
-
-In the output there will be an object with a `"packageId"` property. You'll want
-to save that package ID to the `src/constants.ts` file as `PACKAGE_ID`:
-
-```ts
-export const TESTNET_COUNTER_PACKAGE_ID = "<YOUR_PACKAGE_ID>";
-```
-
-Now that we have published the move code, and update the package ID, we can
-start the app.
-
-## Starting your dApp
-
-To install dependencies you can run
-
-```bash
-pnpm install
-```
-
-To start your dApp in development mode run
-
-```bash
-pnpm dev
-```
-
-## Building
-
-To build your app for deployment you can run
-
-```bash
-pnpm build
-```
+# Sui dApp Starter Template
+
+This dApp was created using `@mysten/create-dapp` that sets up a basic React
+Client dApp using the following tools:
+
+- [React](https://react.dev/) as the UI framework
+- [TypeScript](https://www.typescriptlang.org/) for type checking
+- [Vite](https://vitejs.dev/) for build tooling
+- [Radix UI](https://www.radix-ui.com/) for pre-built UI components
+- [ESLint](https://eslint.org/) for linting
+- [`@mysten/dapp-kit`](https://sdk.mystenlabs.com/dapp-kit) for connecting to
+  wallets and loading data
+- [pnpm](https://pnpm.io/) for package management
+
+For a full guide on how to build this dApp from scratch, visit this
+[guide](http://docs.sui.io/guides/developer/app-examples/e2e-counter#frontend).
+
+## Deploying your Move code
+
+### Install Sui cli
+
+Before deploying your move code, ensure that you have installed the Sui CLI. You
+can follow the [Sui installation instruction](https://docs.sui.io/build/install)
+to get everything set up.
+
+This template uses `testnet` by default, so we'll need to set up a testnet
+environment in the CLI:
+
+```bash
+sui client new-env --alias testnet --rpc https://fullnode.testnet.sui.io:443
+sui client switch --env testnet
+```
+
+If you haven't set up an address in the sui client yet, you can use the
+following command to get a new address:
+
+```bash
+sui client new-address secp256k1
+```
+
+This well generate a new address and recover phrase for you. You can mark a
+newly created address as you active address by running the following command
+with your new address:
+
+```bash
+sui client switch --address 0xYOUR_ADDRESS...
+```
+
+We can ensure we have some Sui in our new wallet by requesting Sui from the
+faucet `https://faucet.sui.io`.
+
+### Publishing the move package
+
+The move code for this template is located in the `move` directory. To publish
+it, you can enter the `move` directory, and publish it with the Sui CLI:
+
+```bash
+cd move
+sui client publish --gas-budget 100000000 counter
+```
+
+In the output there will be an object with a `"packageId"` property. You'll want
+to save that package ID to the `src/constants.ts` file as `PACKAGE_ID`:
+
+```ts
+export const TESTNET_COUNTER_PACKAGE_ID = "<YOUR_PACKAGE_ID>";
+```
+
+Now that we have published the move code, and update the package ID, we can
+start the app.
+
+## Starting your dApp
+
+To install dependencies you can run
+
+```bash
+pnpm install
+```
+
+To start your dApp in development mode run
+
+```bash
+pnpm dev
+```
+
+## Building
+
+To build your app for deployment you can run
+
+```bash
+pnpm build
+```