Skip to content

Latest commit

 

History

History
60 lines (39 loc) · 1.8 KB

README.md

File metadata and controls

60 lines (39 loc) · 1.8 KB

CheemsChat

Check out the hosted link on heroku (might not work all the time cause free tier)

https://cheems-or-not.herokuapp.com/

This is a Chat app with two rooms (Memeshowdown and General)

  • General is a regular chat channel where you can text and upload images with other clients.

  • Memeshowdown is the same as General but with a bot that tells you how cheemsy you're meme is.

This is What a Cheems Meme is

Alt text

FrontEnd

  • Made with vanilla javascript

  • Image detection using Tensorflow.js

  • Responsive design(viewable in both mobile and desktop browser)

    Code Structure

    • main.js => major site logic
    • predict.js => tensorflow.js model execution happens here
    • render.js => renders the text and image messages
    • utilfunc => some helper functions used by frontend
    • style.css => since there are only two pages this has all the styling
    • tfjsmodel/ => contains the model and the pretrained weights

After an image is uploaded and !judgememe is entered the bot runs the tensorflow.js model and returns a %ge confidence in whether it is a "cheems" meme or not.

I used Azure's service called computer vision .ai to get the model imported as tensorflow.js. I want to make my own model's with tf.js in the future cause it's just so cool.

Backend

  • Node.js server using Express

  • Socket.io used for Realtime Chat

    Code Structure

    • server.js => major site logic
    • utils => contains formaters for messages

Images Of the Site

Alt text

Setting up dev environment (incase you want to contribute or just use it)