Implementing a Tag Feature with Suggestions Using React Tag Autocomplete

This article was originally published on bmf-tech.com . I was thinking of developing a tag feature from scratch, but I found many convenient React Components, so I decided to use them. Environment React Babel Browserify React Tag Autocomplete npm Introduction Install React Tag Autocomplete using npm. npm install --save react-tag-autocomplete There are various ways to include it, but in this environment, we will use require. var ReactTags = require('react-tag-autocomplete'); Now we are ready. Implementation // Various parts omitted <div id="react-tag-autocomplete"></div> There is a Usage section on github , but let's consider a case where we modify it a bit to fetch data by hitting an API. (Here, we use superagent.) The API returns a JSON response like this: [{"id":1,"name":"Programming"},{"id":2,"name":"Housework"},{"id":3,"name":"Home Security"},{"id":4,"name":"Early to Bed, Early to Rise"},{"id":5,"name":"Three-Day Monk"}] Debugging res.body.skills var ReactTags = require('react-tag-