Skip to Main Content

Quickstart: creating your Profile with JSON

Add your Profile

There are 4 ways you can add your Profile with json, but for this Quickstart we will use the GitHub UI.

To do this, you need a GitHub account. If you do not have one yet, you can create one for free with an email address and password.

  1. Log in to your GitHub Account
  2. Visit the BioDrop repo

BioDrop GitHub repo

  1. If you wish to be kept up to date with the repo, hit that "Star" at the top right

Start BioDrop

  1. Click on Fork

create a new fork

  1. Accept the default fork creating a copy of the BioDrop project in your account - this will take you to the forked repo

BioDrop form

  1. Click add file and select "create new file"

Create new file

  1. In the file path at the top, add data/ followed by your GitHub username, exactly as it appears including capitalisation, and then append .json to it.

For example for username "SaraJaoude":

  • Correct: BioDrop/data/SaraJaoude.json (including capitalisation in filename)
  • Incorrect: BioDrop/data/sarajaoude.json (filename capitalisation does not match username capitalisation)

create json file

  1. For the file contents use the json structure below:
{
  "name": "Sara Jaoude",
  "bio": "Lawyer turned **Digital Nomad**. Travel enthusiast Yoga & Peloton aficionado"
}
fieldtypedescription
namestringYour display name on your Profile
biostringYour description about yourself (you can use markdown here)
  1. Now add links to your social media and other content (for example: website) so they appear on your Profile.
{
  "name": "Sara Jaoude",
  "bio": "Lawyer turned **Digital Nomad**. Travel enthusiast Yoga & Peloton aficionado",
  "links": [
    {
      "name": "Follow me on Twitter",
      "url": "https://twitter.com/SaraJaoude",
      "icon": "FaTwitter"
    }
  ]
}

note: do not have duplicate links (url)

fieldtypedescription
namestringThe display name for the button
urlstringFull url to the resource
iconstringThe icon you would like displayed. We support the following icon sets: Fa and Si from React Icons. You can search available icons

propose new file

To add more links, add another object inside the links collection. For example:

"links": [
    {
      "name": "Follow me on Twitter",
      "url": "https://twitter.com/SaraJaoude",
      "icon": "FaTwitter"
    },
    {
      "name": "Follow me on Instagram",
      "url": "https://www.instagram.com/eddieandsaraexplore/",
      "icon": "FaInstagram"
    }
  ]
  1. Scroll to the bottom and commit new file by adding the commit message that starts data: followed by your GitHub username (for example data: SaraJaoude)

You can skip optional extended message

  1. Click create new branch and you can use the default name provided
  2. Then, click Propose new file

propose new file

DropdownDescriptionExample values
1st dropdownBase repository (destination)EddieHubCommunity/BioDrop
2nd dropdownBase repository branch (destination)main
3rd dropdownYour repository (source)your-username/BioDrop
4th dropdownYour repository branch (source)your-username-patch-1

The first dropdown for the base repository (destination) should be set to EddieHubCommunity/BioDrop not your username your-username/BioDrop.

compare across forks

  1. Click Create pull request
  2. The description will be filled with a template, please fill in the appropriate sections

create pull request

  1. Click Create pull request

  2. Now you need to wait to have your Pull Request (changes) reviewed

pull request

An approving review from one of BioDrop's maintainers will show a green check mark next to their id.

maintainer review

  1. You will receive a GitHub notification when you have a comment, review, or your Pull Request has been merged
  2. Once merged, your profile will be available a few minutes later on your custom URL (BioDrop.io/SaraJaoude)

merged pull request

Example Profiles

Looking for inspiration? You can view the full profile docs for an example.

Next steps