Dappland
How to add your Dapp to Dappland
If you are currently working on a dApp in StarkNet/ZkSync ecosystem, you should definitely list your dApp on Dappland for a wider reach.
To ensure all images are of the same resolution, we have created some specific standards you need to adhere to. Here are the required images, and their required resolutions:
- 1.dApp logo - 320 x 320px
- 2.dApp banner - 1920 x 400px
- 3.dApp preview - 700 x 400px
PS: Here's a Figma template created to help you do this easily. Just create a copy and customize it to fit your dApp.
To help make this tutorial intuitive, we describe adding an example dApp called docsdapp to Dappland.
Having optimized our images, it's now time to draft out the content for our page. This will be divided into 2 sections:
- 1.
- 2.Navigate to
/public/dapps
and create a folder with the name of your dApp. - 3.Add all your optimized images to the folder.
We created a sample JSON file here, which you would need to copy to the
/data
folder. Rename this file with your dApp name in small letters i.e docsdapp.json.
Having done this, we will need to edit/customize the information present in the JSON file to match our dApp.
The sample JSON code contains very detailed instructions, you should be able to customize it, following the given instructions.
{
"name": "DocsDapp",
"description": "An example dapp to educate developers on how they could add their dapps to Dappland",
"short_description": "Argent Dappland example",
"tags": [
"Onramps",
"Social",
"DAOs"
], //Remove all that don't apply
"contracts": [
{
"name": "docsDapp contract",
"address": "0x06e0d9c78d2e51bd2c9017771fb038ddab1cd224ed5ad603bf96f06060714751"
}
],
"goerliContracts": [
{
"name": "docsDapp goerli contract",
"address": "0x06e0d9c78d2e51bd2c9017771fb038ddab1cd224ed5ad603bf96f06060714751"
}
],
"audits": [
{
"name": "Nethermind audits",
"url": "https://docsdapp-nethermind-audit.com"
}
],
"verified": false, // Change to true if all contracts verified on starkscan
"dotw": false, //leave 'false'
"links": {
"website": "https://docsdapp.com",
"careers": "https://docsdapp.com/careers",
"twitter": "https://twitter.com/docsdapp",
"telegram": "",
"discord": "",
"github": "https://github.com/docsdapp",
"youtube": "",
"medium": "",
"mirror": "https://mirror.xyz/docsdapp"
},
"twitterName": "docsdapp",
"teamInfo": {
"founded": "2022-05-24T00:00:00.000Z",
"anonymous": false // If at least one of the founders has a public profile with their real name linked to the project, set this to true.
},
"tokens": [
{ // Delete contents if no token
"address": "0x00da114221cb83fa859dbdb4c44beeaa0bb37c7537ad5ae66fe5e0efd20e6eb3", // Starknet token address
"symbol": "DAI"
}
],
"media": {
"logoUrl": "/dapps/docsdapp/dapp-logo-docsdapp.png",
"bannerUrl": "/dapps/docsdapp/dapp-preview-docsdapp.png",
"previewUrl": "/dapps/docsdapp/dapp-header-docsdapp.png",
"gallery": [
{
"url": "/dapps/docsdapp/dapp-header-docsdapp.png",
"description": "Gallery Preview"
}
]
}
}
Ensure all your Image URLs point to the images which we earlier uploaded to
/public/dapps
Having completed the steps above, we are now fully ready to go live! Head over to your forked repository, and create a Pull request.
Once you've opened a Pull request, someone from the Argent team will review it and contact you if there is any need for clarification.
Last modified 13d ago