How to add personal details such as title, followers, social media profile and badges

In this guide, will show you how you can use me queries in Hashnode’s GraphQL API to fetch and integrate personal details.

The me query returns details of the current authenticated user and here’s how it looks:

query Me {
  me {
    id
    username
    name
    bio {
      markdown
      html
      text
    }
    profilePicture
    socialMediaLinks {
      website
      github
      twitter
      instagram
      facebook
      stackoverflow
      linkedin
      youtube
    }
    emailNotificationPreferences {
      weeklyNewsletterEmails
      activityNotifications
      generalAnnouncements
      monthlyBlogStats
      newFollowersWeekly
    }
    badges {
      id
      name
      description
      image
      dateAssigned
      infoURL
      suppressed
    }
    publications {
      edges {
        ...UserPublicationsEdgeFragment
      }
      pageInfo {
        ...PageInfoFragment
      }
      totalDocuments
    }
    posts {
      edges {
        ...UserPostEdgeFragment
      }
      nodes {
        ...PostFragment
      }
      pageInfo {
        ...OffsetPageInfoFragment
      }
      totalDocuments
    }
    followersCount
    followingsCount
    tagline
    dateJoined
    location
    availableFor
    tagsFollowing {
      id
      name
      slug
      logo
      tagline
      info {
        ...ContentFragment
      }
      followersCount
      postsCount
      posts {
        ...FeedPostConnectionFragment
      }
    }
    ambassador
    provider
    deactivated
    betaFeatures {
      id
      key
      title
      description
      url
      enabled
    }
    email
    unverifiedEmail
    followers {
      nodes {
        ...UserFragment
      }
      pageInfo {
        ...OffsetPageInfoFragment
      }
      totalDocuments
    }
    follows {
      nodes {
        ...UserFragment
      }
      pageInfo {
        ...OffsetPageInfoFragment
      }
      totalDocuments
    }
    drafts {
      edges {
        ...UserDraftEdgeFragment
      }
      pageInfo {
        ...PageInfoFragment
      }
      totalDocuments
    }
    role
    techStack {
      nodes {
        ...TagFragment
      }
      pageInfo {
        ...OffsetPageInfoFragment
      }
      totalDocuments
    }
  }
}

Here’s an example of how you can use it to fetch particular details such as: username, number of followers, badges received from Hashnode and social media profiles.

Step 1: Go to Account Settings on your profile.

Step 2: Click on the Developer option from the left sidebar and then click on Generate token to get the access token that we will be using below.

const query = `
  query Me {
    me {
      id
      name
      followersCount
      badges {
        name
        description
        image
      }
      socialMediaLinks {
        twitter
        linkedin
      }
    }
  }
`;

fetch('https://gql.hashnode.com', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer YOUR_AUTH_TOKEN'  // Replace with your actual token
  },
  body: JSON.stringify({ query })
})
  .then(response => response.json())
  .then(data => {
    const me = data.data.me;
    console.log(`Name: ${me.name}`);
    console.log(`Followers: ${me.followersCount}`);
    console.log(`Twitter: ${me.socialMediaLinks.twitter}`);
    console.log(`LinkedIn: ${me.socialMediaLinks.linkedin}`);

    console.log('Badges:');
    me.badges.forEach(badge => {
      console.log(`- ${badge.name}: ${badge.description}`);
    });
  })
  .catch(error => console.error('Error:', error));

Here’s how the output will look like:

Updated on