OmeDEV is an Omegle clone that lets you connect "randomly" with stranger developers to have a nice chat.

When you connect with someone, the chats attempts to be anonymous by searching for the first room available, if it does not exist one will be created for you. The next user will automagically be joined in a FIFO style (First in, First out). To prevent predictions on who will be joining theres a random delay applied to each user. Your messages are sent and received through websocket and only the rooms ids are stored in database for no longer than one day.

Note The code is not optimized nor compatible with the good practices. Read more

Table of Contents

• Motivation
• Usage
  • Demo
  • Light theme
  • Dark theme
• Development
• Tech Stack
• How to Contribute
• License

Motivation

This project has been made to participate in the DEV MongoDB Atlas Hackathon 2022, it is my first chat application and my first time using some of the tools that I've chosen on the Tech Stack.

I've learned a ton but the biggest lesson was to always try to organize the ideas and plan out before coding. This application was built while I was learning about how everything would work, so there was little to no planning in the project.

Usage

To start chats you can simple click on the Text button and wait until someone connects with you.

You can send messages by pressing Enter or clicking on the Send button. You can leave a chat at anytime by closing the browser tab/window or pressing Stop, this will trigger an event notifying the other person that you've disconnected.

The app is fully responsive and it has auto scroll whenever new messages or events arrives, so it should be easy and fun to use in mobile devices.

Demo

Light theme

Dark theme

Development

Clone the repo and install the dependencies

$ git clone https://github.com/mateusabelli/omedev.git

$ cd omedev

$ npm install

Set up MongoDB and Pusher env variables

# .env.local
PUSHER_APP_ID=
PUSHER_KEY=
NEXT_PUBLIC_PUSHER_KEY= SAME AS PUSHER_KEY
PUSHER_SECRET=
PUSHER_CLUSTER=
NEXT_PUBLIC_PUSHER_CLUSTER= SAME AS PUSHER_CLUSTER
NEXT_PUBLIC_URL=http://localhost:3000

Next is the database URL for Prisma

# .env
DATABASE_URL=

With everything ready you can now run the app

npm run dev

Tech Stack

This project was built using:

• NextJS
• Typescript
• Chakra UI
• Pusher Channels
• Axios
• Prisma
• MongoDB Atlas

How to Contribute

All contributions are welcome and much appreciated!

• Take a look at the existing Issues or create a new issue!
• Fork the Repo. Then, create a branch for any issue that you are working on. Finally, commit your work.
• Create a Pull Request (PR), which will be promptly reviewed and given suggestions for improvements by the community.
• Add screenshots or screen captures to your Pull Request to help us understand the effects of the changes proposed in your PR.

Read more

License

This project is under the MIT license, read the LICENSE file for more details.