Harmony is a project I started as my final project while at Flatiron. Harmony is a chat/messaging app with support for rich text editing as well as images and gifs. Harmony uses TipTap to allow users to format and style text beyond what could normally be done with a normal form text field. Harmony also uses the Giphy API and custom CSS to allow users to search for and select GIFS to send as messages. To allow users to send images as both posts and replies to posts Harmony uses ActiveStorage to associate images with posts and replies. In the deployed version of Harmony AWS S3 is being used to store the images.
Harmony's home page.
After signing in or creating an account you can join either create a room or enter a room code from an existing room.
After joining a room users can view messages in different channels.
By searching for a gif users can send gifs. To see replies users can click the down arrow symbol on a message
To add a new reply users can click the plus symbol on a message. As admin of a room you can add moderators through the member modal by clicking on the channel/room display in the corner. The member modal also has the rooms join code that could be given to other users to join a room.
After cloning down the repo from within the directory of the project you can run the following commands to view the project:
bundle install
rails db:create
rails db:migrate
rails db:seed
rails s
These commands will install dependencies, create a postgres database, migrate and create tables, and seed the database before starting the API's server.
Next you'll need to open another instance of your terminal and navigate to the projects directory, to start the front end server with the following commands:
cd client
npm install
npm start