From e09fb46d33eb679a2803b1426ca764370fd6c69f Mon Sep 17 00:00:00 2001 From: Lulox Date: Thu, 21 Nov 2024 20:07:15 -0300 Subject: [PATCH] Added roadmap page, improved README and About page --- README.md | 59 +----- packages/nextjs/app/about/About.tsx | 9 + packages/nextjs/app/roadmap/Roadmap.tsx | 265 ++++++++++++++++++++++++ packages/nextjs/app/roadmap/page.tsx | 18 ++ packages/nextjs/components/Footer.tsx | 6 + 5 files changed, 302 insertions(+), 55 deletions(-) create mode 100644 packages/nextjs/app/roadmap/Roadmap.tsx create mode 100644 packages/nextjs/app/roadmap/page.tsx diff --git a/README.md b/README.md index 8883058..7acb911 100644 --- a/README.md +++ b/README.md @@ -1,69 +1,18 @@ Social protocol where interactions are monetized πŸ’° allowing users to earn through engaging with their community πŸ«‚. -❓ To know what this project aims to be, [see the about page](https://punksociety.xyz/about). +❓ To know what this project aims to be, [read the about page](https://punksociety.xyz/about). -πŸ“₯ To see pending development tasks, [see this Trello](https://trello.com/b/HLBnvKSu/punksociety) - -# 🀘 Roadmap - -## 🐣 Phase 1 (MVP) - -- βœ… **Create PunkPosts contract** -- βœ… **Create PunkProfile contract to register users info and socials** -- βœ… **PunkSociety contract:** Social interactions -- βœ… **Post creation tool** -- βœ… **User profile page** -- βœ… **Search**: By address or username -- βœ… Enable options for sharing on other platforms -- Enable following users, liking, commenting and sharing posts -- **Incentive model**: Likes and comments send $ to the user on the other end -- Posting is paid and interactions sends a fee to owner -- **Individual post viewer** -- **Multi-language support**: Switch between languages - -## πŸ“ˆ Phase 2 (Business model) - -- ⏸️ **Avalanche L1 with USDC as native gas:** Use an Avalanche L1 with USDC as native gas (Reference: [Create an Avalanche L1](https://docs.avax.network/tooling/create-deploy-avalanche-l1s/create-avalanche-l1)) -- ⚠️ **USDC Staking/Lending model**: Bridged USDC can be lent or staked on AAVE and/or Compound (or similar) so users can earn interest on their USDC while using the platform -- **Fees**: PunkSociety collects fees from USDC lending revenue -- **Easy onramp tool**: Easy USDC buying tool for onboarding new users. (Reference:[FundButton from Coinbase](https://onchainkit.xyz/fund/fund-button) | [OnchainKit extension for Scaffold-ETH 2](https://github.com/scaffold-eth/create-eth-extensions/tree/onchainkit)) -- **Built-in bridge manager**: Built-in simple tool for bridging USDC and NFTs to and from Avalanche, Base, Ethereum, and other EVM chains (Reference: [avalanche-interchain-token-transfer](https://github.com/ava-labs/avalanche-interchain-token-transfer) | [Chainlink CCIP Cross Chain Tokens](https://docs.chain.link/ccip/tutorials/cross-chain-tokens)) -- **Dashboard Insights**: Track and analyze your revenue - -## 🌐 Phase 3 (Indexing) - -- **Integrate The Graph to index activity** and save RPC calls (Reference: [Bootstrap a Full Stack Modern dapp using the Scaffold-ETH CLI and Subgraph Extension](https://siddhantk08.hashnode.dev/bootstrap-a-full-stack-modern-dapp-using-the-scaffold-eth-cli-and-subgraph-extension) | [The Graph tool for creating a subgraph](https://thegraph.com/docs/en/developing/creating-a-subgraph/)) -- **Notification system** -- Search by post content - -## πŸ’¬ Phase 4 (Social enhancement) - -- **Direct messages:** Allow users to send private messages to each other (Reference [Push Protocol](https://push.org/)) -- Enable audio, video and links with preview type of posts -- **Polls**: Allow users to create polls -- **Customization**: Allow users to customize their profile appearance -- **Collections**: Create and share collections of posts -- **Groups**: Allow users to create and join groups with custom chat and newfeed -- **Categories**: Allow users to categorize their posts, filter by category and search by category - -## πŸ‘¨β€πŸ¦½ Phase 5 (Ease of use) - -- **Educational Content**: Include onboarding tutorials and step-by-step guides to help users understand what they can do on the platform -- **Web 2.5 social login with account abstraction:** Sign up and log in with Google, Twitter, Instagram, etc. (Reference: [wagmi-thirdweb Connect Button](https://github.com/thirdweb-example/wagmi-thirdweb?ref=blog.thirdweb.com)) -- **Accesibility support**: For the hearing and visually impaired, the app should be ARIA compliant to support screen readers and other assistive technologies (Reference: [ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA)) -- **Add special metadata to NFTs** for screen readers and SEO +πŸ“₯ Pending development tasks [on this Trello board](https://trello.com/b/HLBnvKSu/punksociety) # 🀘 Development -πŸ“₯ To see pending development tasks, [see this Trello](https://trello.com/b/HLBnvKSu/punksociety) - ## πŸ› οΈ Technical details βš™οΈ Currently built using [Scaffold-ETH 2](https://scaffoldeth.io/), [Foundry](https://book.getfoundry.sh/), [OnchainKit](https://onchainkit.xyz/), [Pinata](https://pinata.cloud/), [Vercel](https://vercel.com/), [NextJS](https://nextjs.org/), [RainbowKit](https://rainbowkit.com/), [Wagmi](https://wagmi.sh/), [Viem](https://viem.sh/), and [Typescript](https://www.typescriptlang.org/). -🏦 Considering using protocols: [Circle USDC](https://www.circle.com/) as native gas, [The Graph](https://thegraph.com/) for indexing events, [Uniswap](https://app.uniswap.org/) and similar with an aggregator for token swaps, [AAVE](https://aave.com/), [Compound](https://compound.finance/) and similar options for generating interest on bridged [ERC20](https://ethereum.org/en/developers/docs/standards/tokens/erc-20/), [Chainlink](https://chain.link/) for price oracles, [Push Protocol](https://push.org/) for notifications and messages, [Thirdweb](https://thirdweb.com/) for social login with account abstraction. +🏦 Considering using protocols: [Circle USDC](https://www.circle.com/) as native gas, [The Graph](https://thegraph.com/) for indexing events, [AAVE](https://aave.com/) for earning interest on USDC, [Chainlink](https://chain.link/) for cross-chain NFT bridging. -πŸ“œ Considering using contracts: [Ownable](https://docs.openzeppelin.com/contracts/2.x/access-control) and [Upgradeable](https://docs.openzeppelin.com/upgrades-plugins/1.x/writing-upgradeable) from [OpenZeppelin](https://www.openzeppelin.com/) or [Solady](https://github.com/Vectorized/solady) for contract ownership. [EIP712 Signatures](https://eips.ethereum.org/EIPS/eip-712). +πŸ“œ Considering using contracts: ERC721, [Ownable](https://docs.openzeppelin.com/contracts/2.x/access-control) and [Upgradeable](https://docs.openzeppelin.com/upgrades-plugins/1.x/writing-upgradeable) from [Solady](https://github.com/Vectorized/solady) for contract ownership. And maybe [EIP712 Signatures](https://eips.ethereum.org/EIPS/eip-712) for some gasless activity. πŸ”— To be deployed on [Avalanche L1](https://github.com/ava-labs/avalanche-starter-kit) and Bridge [ERC20](https://ethereum.org/en/developers/docs/standards/tokens/erc-20/) and [ERC721](https://ethereum.org/en/developers/docs/standards/tokens/erc-721/) using [Avalanche Interchain Token Transfer](https://github.com/ava-labs/avalanche-interchain-token-transfer) and [Chainlink CCIP Transfer Tokens](https://docs.chain.link/ccip/tutorials/cross-chain-tokens) with [EVM compatible chains](https://ethereum.org/en/developers/docs/scaling/sidechains/#evm-compatibility). diff --git a/packages/nextjs/app/about/About.tsx b/packages/nextjs/app/about/About.tsx index 6871fd6..4bb1c86 100644 --- a/packages/nextjs/app/about/About.tsx +++ b/packages/nextjs/app/about/About.tsx @@ -249,6 +249,15 @@ export const About = () => { +
+

Wanna know how we're doing?

+
+ + + +
+
+

Meet us! 🀘

diff --git a/packages/nextjs/app/roadmap/Roadmap.tsx b/packages/nextjs/app/roadmap/Roadmap.tsx new file mode 100644 index 0000000..82a73b8 --- /dev/null +++ b/packages/nextjs/app/roadmap/Roadmap.tsx @@ -0,0 +1,265 @@ +"use client"; + +import Link from "next/link"; +import { NFTMetaData } from "~~/utils/simpleNFT/nftsMetadata"; + +export interface Post extends Partial { + postId?: number; + uri: string; + user: string; + date?: string; +} + +export const Roadmap = () => { + return ( +
+
+
+ {/* INSERT HERE A GIF SHOWING HOW A LIKE BECOMES MONEY */} + {/* Animation clicking a like button and increasing USDC balance */} +
+

+ PunkSociety roadmap!🀘 +

+ + + What we've done and what will we do next! 🎯 + +
+
+
+ +
+

What is this about?

+
+ + + +
+
+ +
+
+

+ 🀘 Roadmap +

+ +
+

+ 🐣 Phase 1 (MVP) +

+
    +
  • + βœ… Create PunkPosts contract +
    • +
  • + βœ…{" "} + Create PunkProfile contract to register users info and socials +
    • +
  • + βœ… PunkSociety contract: Social interactions +
    • +
  • + βœ… Post creation tool +
    • +
  • + βœ… User profile page +
    • +
  • + βœ… Search: By address or username +
    • +
  • + βœ… Enable options for sharing on other platforms +
    • +
  • + βœ… Enable following users, liking, commenting and sharing posts +
    • +
  • + Incentive model: Likes and comments send $ to the user on the other end +
    • +
  • Posting is paid and interactions send a fee to the owner
    • +
  • + Individual post viewer +
    • +
  • + Multi-language support: Switch between languages +
    • +
+
+ +
+

+ πŸ“ˆ Phase 2 (Business model) +

+
    +
  • + ⏸️ Avalanche L1 with USDC as native gas: Use an Avalanche L1 with USDC as native gas + + Create an Avalanche L1 + +
    • +
  • + ⚠️ USDC Staking/Lending model: Bridged USDC can be lent or staked on AAVE and/or + Compound (or similar) so users can earn interest on their USDC while using the platform +
    • +
  • + Fees: PunkSociety collects fees from USDC lending revenue +
    • +
  • + Easy onramp tool: Easy USDC buying tool for onboarding new users. + + FundButton from Coinbase + {" "} + | + + OnchainKit extension for Scaffold-ETH 2 + +
    • +
  • + Built-in bridge manager: Built-in simple tool for bridging USDC and NFTs to and from + Avalanche, Base, Ethereum, and other EVM chains + + avalanche-interchain-token-transfer + {" "} + | + + Chainlink CCIP Cross Chain Tokens + +
    • +
  • + Dashboard Insights: Track and analyze your revenue +
    • +
+
+ +
+

+ 🌐 Phase 3 (Indexing) +

+
    +
  • + Integrate The Graph to index activity and save RPC calls + + Bootstrap a Full Stack Modern dapp using the Scaffold-ETH CLI and Subgraph Extension + {" "} + | + + The Graph tool for creating a subgraph + +
    • +
  • + Notification system +
    • +
  • Search by post content
    • +
+
+ +
+

+ πŸ’¬ Phase 4 (Social enhancement) +

+
    +
  • + Direct messages: Allow users to send private messages to each other + + Push Protocol + +
    • +
  • Enable audio, video, and links with preview type of posts
    • +
  • + Polls: Allow users to create polls +
    • +
  • + Customization: Allow users to customize their profile appearance +
    • +
  • + Collections: Create and share collections of posts +
    • +
  • + Groups: Allow users to create and join groups with custom chat and newsfeed +
    • +
  • + Categories: Allow users to categorize their posts, filter by category and search by + category +
    • +
+
+ +
+

+ πŸ‘¨β€πŸ¦½ Phase 5 (Ease of use) +

+
    +
  • + Educational Content: Include onboarding tutorials and step-by-step guides to help users + understand what they can do on the platform +
    • +
  • + Web 2.5 social login with account abstraction: Sign up and log in with Google, Twitter, + Instagram, etc. + + wagmi-thirdweb Connect Button + +
    • +
  • + Accessibility support: For the hearing and visually impaired, the app should be ARIA + compliant to support screen readers and other assistive technologies + + ARIA + +
    • +
  • + Add special metadata to NFTs: for screen readers and SEO +
    • +
+
+
+
+
+ ); +}; diff --git a/packages/nextjs/app/roadmap/page.tsx b/packages/nextjs/app/roadmap/page.tsx new file mode 100644 index 0000000..01991fc --- /dev/null +++ b/packages/nextjs/app/roadmap/page.tsx @@ -0,0 +1,18 @@ +import { Roadmap } from "./Roadmap"; +import type { NextPage } from "next"; +import { getMetadata } from "~~/utils/scaffold-eth/getMetadata"; + +export const metadata = getMetadata({ + title: "Roadmap", + description: "Built with πŸ— Scaffold-ETH 2", +}); + +const RoadmapPage: NextPage = () => { + return ( + <> + + + ); +}; + +export default RoadmapPage; diff --git a/packages/nextjs/components/Footer.tsx b/packages/nextjs/components/Footer.tsx index d1cbc8a..de49010 100644 --- a/packages/nextjs/components/Footer.tsx +++ b/packages/nextjs/components/Footer.tsx @@ -87,6 +87,12 @@ export const Footer = () => { Β· +
+ + Roadmap + +
+ Β·
Code