Welcome to DokiCupid, an internet dating software made for anime characters!

DokiCupid are a duplicate of this common dating site OkCupid. Japan term “doki-doki” represent the sounds of your respective defeating cardio and is also often familiar with show excited thoughts of fancy.

DokiCupid features individual profiles, matchmaking, blocked look, and instant-messaging between users.

This software uses Rails and Postgres regarding back-end, and React/Redux to deal with the front-end.

Note: DokiCupid had been a two-week task provided as an element of App Academy’s full-stack program.

Modify (02/05/20): DokiCupid has become mobile-friendly!

1. Javascript
2. Ruby on Rails
3. PostgreSQL
4. HTML
5. CSS/SCSS

1. React.js
2. Redux
3. Rails ActionCable for realtime messaging
4. jQuery for AJAX API demands
5. AWS S3 buckets for user avatar and visibility photos
6. BCrypt for Individual Verification
7. NPM zipcodes to assess range between consumers

After logging in, people become welcomed using the Doubletake webpage which shows profile previews for consumers that the existing user has not yet matched up with. Customers is able to see their match percentage with each displayed individual and have the solution to see that user’s profile.

Enjoy and Research

The Explore web page gets previews of user profiles for users who aren’t however paired with the latest individual, along with the distance from and being compatible rating with each individual.

http://fabwags.com/wp-content/uploads/2013/04/tony-and-cathy.jpg” alt=”escort service Round Rock”>

The Search page permits a person to filter potential suits by tags like particular characteristics attributes, sex detection, and precisely what the various other individual are “looking for” with this software. Multiple labels are specified in the past, together with results will showcase users that fulfill all of these requirement. Users can also decide to type these effects by compatibility percentage in growing or reducing purchase.

Most my personal React ingredients made use of once you understand who current user was already paired with, whom they had formerly “liked”, and which users got “liked” all of them, in order to choose which records will be presented. If the state decided not to already hold these records, a GET request was developed to /api/matches .

The techniques earlier labeled as on current_user reference methods I explained on individual model, for instance the soon after:

Whenever checking out a person’s very own visibility page, a user can choose to view, modify, or erase their profile. When editing, people also can connect extra images with their profile or remove any established images.

Whenever customers head to various other customers’ profiles, they’re able to “like”, or consult become matched up with, the consumer these are generally watching. When the wanted individual chooses to “like” all of them back, a match is made enabling the two customers to deliver messages to one another.

Matches and texting

From the Matches web page, people is able to see who they really are currently paired with, just who they “liked”, and just who “liked” them. When two customers mutually “like” both, the match is done, and one associated with the users may start a discussion utilizing the some other on communications page. Real time cam between matched consumers was implemented using activity wire in Rails.

Because one dialogue should are present in conversations desk associated with databases for a couple of matched up consumers, I composed a-scope strategy :between when you look at the dialogue model used whenever trying to produce a discussion during the control. If a person currently is available in the database, the existing a person is came back; if a current conversation is not discovered, the strategy brings a new conversation within two people and return that talk.

One of the more challenging areas of this venture had been configuring Action cable tv for real-time texting.

In MessagesChannel , We defined a way create which will take in information and helps to create an email for the database with this facts. Then, it shows the outlet object on “messages_channel” referenced during the subscribed way.