ML4W: Toxicity Detector by Tensorflow

    Toxicity classifier and Tensorflow.js

    👉 Play with it here 👉 Source code is here

    This project is based on Toxicity classifier model by Tensorflow.js and bootstrapped with Create React App.

    The idea is to use the toxicity classifier model trained by Tensorflow to build an instant detector for the inputs. If toxic content is detected, the textarea would transition to black canvas to cover it. Only removing the toxic content would reveal the text again.

    This app is only listening to dynamic user input at the moment, but it could possibly be combined with web crawler to process target content for future application.

    toxicity detector demo

    Programming takeaways

    code highlight

    The API that Tensorflow model provided is really robust. It's a beautiful functional chain constructed with Promises. Because I'd like to build the interface without submit button to have the experience of smooth and immediate response, I had to figure out a way to put transition views between the async function calls.

    I made the functions as clean as possible to prevent side effects of data mutation, and chain them together to achieve the outcome I was looking for.