giagnus64 / chitter-chatter-front-end

A messaging app that plays sounds and animations with every message.

Chitter-Chatter

A messaging app that plays sounds and animations with every message.

Features

Users are able to send and recieve messages with other users. When a user types a letter on the site, a sound and animation will play. Users can replay the sounds and animations that play when other users send them messages. Users are also able to edit their information.

Demo

Live(Login:test)| Video

Built with

Back-end

• Ruby on Rails - Server Framework
• PostgreSQL - Database

Front-end

• Vanilla HTML, Custom CSS for styling
• webpack - Script and Asset bundler
• Paper.js - Vector Graphics Scripting Library
• howler.js - JavaScript Audio Library

Installation

Requirements

• Node.js
• Installing Ruby
• PostgreSQL

In your clone/fork of this repo:

npm install - #installs all dependencies
npm run start - #opens webpack dev server - will refresh upon changes in JS
npm run build - #compiles final product and pushes to dist folder

The instructions for the back-end of this app are here. You'll need to clone/fork both repos and change your fetch URLS if you want to change the API. Otherwise, the app will make calls to the API hosted on heroku.

License

MIT