Introduction to Appwrite's Avatar API

In today's post, I will be introducing Avatar API provided by Appwrite and how you can use this service provided by Appwrite in your next project.

Getting Started with Appwrite

• Appwrite is a Secure Open-Source Backend Server for Web, Mobile & Flutter Developers. It is a self-hosted solution that provides developers with a set of easy-to-use and integrates REST APIs to manage their core backend needs.
• I would recommend checking out the Appwrite Documentation to learn more about Appwrite and various services offered by appwrite.
• You can refer to the official documentation of Avatar API to learn more.

Intro to Avatar API

Out of all the wonderful services offered by Appwrite, this is one great API you can integrate into your project 🚀

• This API eases your task with respect to app icons, images, and avatars, that is, you will no longer have to worry about searching for icons or avatars on various platforms. Now, you can get everything using just one API.
• The API also provides you with additional options to change image size and quality, as well options to crop the image.
• In the next section, I will introduce various services provided by this API briefly.

Different ways you can use this API

To get country flag icons

• You can get the country flag icons of various countries in the following manner. You will have to pass the 2 digit country code of the country whose flag icon you wish to obtain, like here, we have passed in to get the Indian flag icon. Follow the Installation Guide in order to access the console so that you can get your project endpoint and project UID.

const sdk = new Appwrite();
sdk
    .setEndpoint('') // Your API Endpoint
    .setProject(''); // Your project ID
let result = sdk.avatars.getFlag(in);
console.log(result); // Resource URL

To get Favicons

• We can also use this service to get all of our favorite icons from any website we want by passing the website URL in the function below.

const sdk = new Appwrite();
sdk
    .setEndpoint('') // Your API Endpoint
    .setProject(''); // Your project ID
let result = sdk.avatars.getFavicon('https://favicon.io/');
console.log(result); // Resource URL

To generate QR Code Image

• This particular feature is very cool and handy and helps to convert a particular text to a QR Code image. Isn't that really cool! Like here, I have passed my own name 😉

const sdk = new Appwrite();
sdk
    .setEndpoint('') // Your API Endpoint
    .setProject(''); // Your project ID
let result = sdk.avatars.getQR('DRISHTI'); 
console.log(result); // Resource URL

To get Image from URL

• We can use this endpoint to fetch a remote image URL and crop it to any image size you want. This endpoint is very useful if you need to crop and display remote images in your app or in case you want to make sure a 3rd party image is properly served using a TLS protocol. You can do this in the following manner.

const sdk = new Appwrite();
sdk
    .setEndpoint('') // Your API Endpoint
    .setProject(''); // Your project ID
let result = sdk.avatars.getImage('https://appwrite.io/images/logo.png');
console.log(result); // Resource URL

To get User initials

• Another great service, you can use this function to the initials of the user name or email and display it on your app. If your function is empty, you will get the initials of the logged-in user, if you wish to display any particular name you can pass that as a parameter. Know More about the different parameters you can pass

const sdk = new Appwrite();
sdk
    .setEndpoint('') // Your API Endpoint
    .setProject('');// Your project ID
let result = sdk.avatars.getInitials();
console.log(result); // Resource URL

Similarly you can also use this service to get the various credit card company icons and also icons of various browsers.

This is how you can make use of Appwrite's Avatar API in your next project and simplify the task of adding images and icons in your next app.