-p-1600%20(1)%20(1).png)
In this 5-step tutorial brought to you by our front developer François, you’ll learn everything there is to know to get started with Sentiment Analysis using JavaScript (Vue 3 + Vite) and put it into practice with a tiny project 🚀: a chat in which only positive messages are accepted. Eden AI provides an easy and developer-friendly API that allows you to perform Sentiment Analysis.
To install Kindchat, you can access François's GitHub repository here.
Also known as Opinion Mining, Sentiment Analysis is an NLP (Natural Language Processing) technique that detects positive, negative, or neutral sentiment in text. Businesses can use Sentiment Analysis to automatically understand how people are talking about a specific service or product and understand customer needs on social media, in feedback, or in support tickets instead of sorting through this data manually.
If you want to learn more about what NLP can offer, feel free to check our selection of the Best Natural Language Processing APIs. Also, if you are interesting in using Sentiment Analysis with Python, we recommand reading our tutorial How to use Sentiment Analysis API with Python.
Now that we’ve covered what Sentiment Analysis is and what it does, we can start building our KindChat app! Note: for the purpose of this video, everything will be done on the client side. Obviously, this kind of verification should be done on the backend in order to hide your API keys.
This is a fairly simple Vue.js application: a message-sending system in which we’ll enter a message in the form and send it, and later check if the message entered is positive so that it can be sent in this chat (triggered by the function sendMessage). Feel free to clone the GitHub repository to try Kindchat.
First and foremost, make sure to create an account on Eden AI for free. Then, you will be able to get your API key 🔑 directly from the homepage with free credits offered by Eden AI.
.svg)
Next, you’ll need to copy-paste the API key from Eden AI in a tiny environment file to stock it in a variable called "VITE_API_KEY" as such:
First, you'll need to copy the snippet code in JavaScript from Eden AI's Sentiment Analysis API and paste it directly into your function. Don’t forget to add the API key !
💡 If you look closer at the Sentiment Analysis code snippet, you’ll see that some language parameters are needed. If you’re interested in using language detection in your project, you’ll need to code it beforehand. We won’t discuss it here, though our video covers it all.
Then, create a sentimentAnalysis function (including the language parameter obtained if you wish to use it) and fill in the provider and text parameters (the user’s message). With Eden AI, you can choose from a wide range of different engines you want that best suit your data and project. Eventually, you’ll only need to return the promise from axios.request so that you can process it in the sendMessage function.
Now let’s have a look at the Sentiment Analysis API response. As indicated in our documentation, for each provider there is an "items" array containing the sentiment and the associated sentiment_rate. In the case of our application, we are only be interested in the positive sentiment. Keep in mind that some providers may return a sentiment_rate for neutral or negative sentiments.
First, you’ll need to store the sentiment analysis response asynchronously in a variable called sentimentResponse, which is an await of sentimentAnalysis, a function to which we have passed the language we obtained previously in the video as a parameter.
Next, store the positive sentiment score obtained in the entryMessage object score attribute which is null by default. If this value is sufficient, you will add the message to the message list displayed on the interface:
Then, you can search in these items the object relevant to positive sentiment and recover the sentiment rate with a console.log. The score will be stored in the entreMessage.score :
🙌 We’re almost there ! You'll need to add the message to the list of messages if its score is higher than a certain value, and store this value in a variable called minimum_rate. What we want is for the following line of code to run only when a certain condition is verified: messageList.value.push (entrMessage.content).
This is a perfect opportunity to use a computed property which is a method that will only be triggered when the value of reactive object changes. This computed property (called here isPositive) will return true in case the score is higher than the minimum rate, otherwise, it’ll return false.
At this point, you can add to the sendMessage function the isPostive condition and add the message to the list of messages only if isPositive is true. If it’s not the case you’ll simply return and end the logic. The rest of the function won’t change, it simply scroll automatically down the page when a message is sent.
Congrats ! 🥳 You can now test the app.
Now, if you write a positive message, the message appears in the chat. If you write negative comment, the message should not appear in the chat (the content of entryMessage.content is reset only when isPositive is True, so the negative message doesn’t disappear from the form).
Last but not least, you can give visual feedback to the user indicating when his message doesn’t meet the conditions when the score is obtained. To do so, you’ll need to create a small paragraph which will appear only if isPositive is false and if the score of the entryMessage is different from null.
The output :
Thanks to Language Detection, you can also try Sentiment Analysis with other languages. Whatever the language used, Language Detection will indicate the right language to provide to the Sentiment Analysis API which will then estimate if the message is positive or not.
That’s it with our KindChat App! 😎 Sentiment analysis with JavaScript has never been easier! Our unique API makes Sentiment Analysis accessible to all developers. You can use multiple Sentiment Analysis APIs from different providers in addition to multiple languages in just a few lines of code. You can also check our Open Source AI APIs project on GitHub. If you want something even easier, you can use our Sentiment Analysis APIs on Make.
If you have questions regarding this tutorial, the Eden AI community can help you out on its Discord Server.
🔥 Eden AI simplifies the use and deployment of AI technologies by providing a unique API connected to the best AI APIs. Eden AI is the future of AI use in business and provides:
You can directly start building now. If you have any questions, feel free to chat with us!
Get startedContact salesDrop your email and we'll get back to you ASAP to answer any questions you have or just to say hi —we promise not to spam you!
-p-500.webp){kind=small}
-p-500.webp){kind=small}
.svg)
