Nuxt3 Website development + Crypto
Budget: $750 – $1,500 USD
Website development + Crypto minting
The site must use Nuxt3 + Strapi and Postgresql as the database.
The project is to create the website not to write any game code.
Website pages
-------------
Home page
- A static version of the home page is already implemented.
- Convert from React into a .vue file. There's no point for this to be in script and split into multiple functions, put into a single .vue file, the way it is now just makes it harder to edit.
- Embed a game rooms component from the Games Page showing 5 active game rooms (if there are)
Signup - with Email/Password auth OR just a Crypto wallet (that is already implemented for the referral system). In this case they can optionally add a username password later to link to that account.
Login
Forgot password pages for authentication - get a password reminder if they're registered their email.
Game Rooms page
- See image below
- Lists all active rooms, so users can pick from a room to join
- Create a new room button.
Create Room page
This creates a new room as a host. A host earns a % from hosting a game.
Set the settings for the game room you're creating,
Game type - [from a list of 3rd party games]
Room description (string)
Game specific settings (some string)
Public/private (add the option, but no need to implement private restrictions for now)
Max players
Stake - Fixed value / variable
Entrance criteria [open / password / membership NFT by default]
Play criteria [password / Membership NFT by default]
Game page container. I’ve created the template for this already. It needs
Authenticate that the user is allowed to play the game.
Contains an IFrame with a link to the 3rd party game content.
You need to pass an auth token on the game URL. The game will decode this and get the balance.
Add authentication checks around game page with the Webcam code (1 hour, it's already written in Nuxt3)
Room chat functionality (already in the game container)
A user can enter a room as a watcher.
User account page
Update password
Upload image
Balances / Wallets. If a user signs up with username/email they can then link multiple crypto wallets to it.
Referral dashboard. This is the existing /dashboard page.
Shows how many people clicked your links etc
Shows the URL a user needs to refer somebody else
The same referral mechanism can be used track players spending on games, not just when they purchase NFT’s from a mint.
Minting page
Initially there will only be one type of NFT. This is a membership NFT.
White list mechanism, some way to register for the NFT drops. Maybe just registering for the site is enough?
Use Postgresql for the RDBMS.
DB Structure.
Users
Username
Password
Email
Wallets / Balance
Permissions
Gameprovider
Name
Gametype
Game name
Game url
Game provider
SecretKey
Gameroom
roomname
Gametype
Roomhost (User)
Transactions
Gameroom
Rating
FromUser
ToUser
Referrals (current style below)
id: Number
referer: Number
walletAddress: String
referralCode: String
earned: Number
timestamp: String
Game API [DRAFT] (to be discussed)
Games are from 3rd party game providers.
- authentication. The website should pass the game a #token. The game will decode that to get information about the user.
- Debit / Credit User Room Balance. The game is responsible for updating user balances based on the outcome of the game
User joins a room, site appends #token to game url.
Notes
-----
We'll aim to deploy the site statically pre-rendered for static hosting with a node js.
I need to decide on the block chain we'll use for the NFT's, a Token and any smart chain logic that may be needed.
The project is considered work for hire so all IP is owned by myself.
The site must use Nuxt3 + Strapi and Postgresql as the database.
The project is to create the website not to write any game code.
Website pages
-------------
Home page
- A static version of the home page is already implemented.
- Convert from React into a .vue file. There's no point for this to be in script and split into multiple functions, put into a single .vue file, the way it is now just makes it harder to edit.
- Embed a game rooms component from the Games Page showing 5 active game rooms (if there are)
Signup - with Email/Password auth OR just a Crypto wallet (that is already implemented for the referral system). In this case they can optionally add a username password later to link to that account.
Login
Forgot password pages for authentication - get a password reminder if they're registered their email.
Game Rooms page
- See image below
- Lists all active rooms, so users can pick from a room to join
- Create a new room button.
Create Room page
This creates a new room as a host. A host earns a % from hosting a game.
Set the settings for the game room you're creating,
Game type - [from a list of 3rd party games]
Room description (string)
Game specific settings (some string)
Public/private (add the option, but no need to implement private restrictions for now)
Max players
Stake - Fixed value / variable
Entrance criteria [open / password / membership NFT by default]
Play criteria [password / Membership NFT by default]
Game page container. I’ve created the template for this already. It needs
Authenticate that the user is allowed to play the game.
Contains an IFrame with a link to the 3rd party game content.
You need to pass an auth token on the game URL. The game will decode this and get the balance.
Add authentication checks around game page with the Webcam code (1 hour, it's already written in Nuxt3)
Room chat functionality (already in the game container)
A user can enter a room as a watcher.
User account page
Update password
Upload image
Balances / Wallets. If a user signs up with username/email they can then link multiple crypto wallets to it.
Referral dashboard. This is the existing /dashboard page.
Shows how many people clicked your links etc
Shows the URL a user needs to refer somebody else
The same referral mechanism can be used track players spending on games, not just when they purchase NFT’s from a mint.
Minting page
Initially there will only be one type of NFT. This is a membership NFT.
White list mechanism, some way to register for the NFT drops. Maybe just registering for the site is enough?
Use Postgresql for the RDBMS.
DB Structure.
Users
Username
Password
Wallets / Balance
Permissions
Gameprovider
Name
Gametype
Game name
Game url
Game provider
SecretKey
Gameroom
roomname
Gametype
Roomhost (User)
Transactions
Gameroom
Rating
FromUser
ToUser
Referrals (current style below)
id: Number
referer: Number
walletAddress: String
referralCode: String
earned: Number
timestamp: String
Game API [DRAFT] (to be discussed)
Games are from 3rd party game providers.
- authentication. The website should pass the game a #token. The game will decode that to get information about the user.
- Debit / Credit User Room Balance. The game is responsible for updating user balances based on the outcome of the game
User joins a room, site appends #token to game url.
Notes
-----
We'll aim to deploy the site statically pre-rendered for static hosting with a node js.
I need to decide on the block chain we'll use for the NFT's, a Token and any smart chain logic that may be needed.
The project is considered work for hire so all IP is owned by myself.