After playing with React, Svelte, and Angular over the past year, I wanted to try to build something in vanilla JavaScript. I previously built an emoji picker for Svelte, so I thought I would adapt that to plain JavaScript. The result was Emoji Button.

Emoji Button is a plain JavaScript emoji picker that can be used in any JavaScript application, regardless of framework.

You call the EmojiButton function passing a HTML button element, and a callback. Clicking the button will trigger the emoji picker, and when an emoji is picked, the callback will be executed with the selected emoji.

Some of its features include:

• Skin tone variations
• Emoji search
• Saves recently used emojis

It was a bit more challenging building this with vanilla JavaScript without the tools of templating, reactivity, and data binding. All in all, it was a fun project, and hopefully someone out there will find it useful!

• Demo here: https://joeattardi.github.io/emoji-button/
• GitHub project: https://github.com/joeattardi/emoji-button
• npm package: https://www.npmjs.com/package/@joeattardi/emoji-button