Git Product home page Git Product logo

rendezvous's Introduction

rendezvous

This app was created to have fun, learn some stuff and take part in the twilio + DEV hackathon ๐Ÿฅณ

๐Ÿ“œ Summary

Visitors of the site can invite participants to video conference meetings answering a simple form that emails everyone on their behalf

The meeting room name is picked for you using a unique id to reduce collisions since meetings links are public

Participants click on the link in their email and join the video conference right on the website

โ„น Emails are sent using sendgrid through serverless functions and the video conference runs on an embedded jitsi meet client

๐Ÿ— Building it

rendezvous was bootstrapped with create-react-app

Requirements

  • Node.js and yarn (or npm) for development
  • Zeit CLI (for testing the serverless Node.js runtime through zeit now)

Required Environment Variables

Add the following to a .env file at the project root

RENDEZVOUS_HCAPTCHA_SECRET='your_hcaptcha_secret'
RENDEZVOUS_APP_SECRET='anything_you_want_here'
SENDGRID_API_KEY='your_sendgrid_api_key'
  • RENDEZVOUS_HCAPTCHA_SECRET is used for setting up https://www.hcaptcha.com/
  • RENDEZVOUS_APP_SECRET is used as the secret for the hmac messages in the serverless functions when generating the confirmation code
  • SENDGRID_API_KEY is to configure Twilio SendGrid

Then just run

yarn    # install dependencies
now dev # start development instance

If you don't require the serverless runtime you can just run

yarn start

๐Ÿš€ Deploying

If you wish to deploy to zeit, just make sure to setup git integration and the create-react-app template

Then add the same secrets from your env file to now using their cli and configure a now.json file, for example:

# Adding sendgrid api key to now using the cli
now secrets add sendgrid_api_key your_sendgrid_api_key

and the now.json file

{
  "env": {
    "SENDGRID_API_KEY": "@sendgrid_api_key",
    "RENDEZVOUS_APP_SECRET": "@rendezvous_app_secret",
    "RENDEZVOUS_HCAPTCHA_SECRET": "@rendezvous_hcaptcha_secret"
  }
}

Alternatively, you could deploy a backend of your choice using the same convention for handling the client side requests that validates the email and send the form data to invite participants


๐Ÿค” Wait, why not just use meet.jit.si ?

When using the public jitsi server you risk choosing a name that someone else is already using and could end up in some stranger's room

This risk is minimized by picking the name for you using the nanoid library when sending the invites through rendezvous

There is also no invite option on meet.jit.si without integrating with either a Google or Microsoft calendar, an email just makes things easier for a simple rendezvous

โœ… Can I still join a meeting through meet.jit.si ?

Absolutely, this is just a sugar built on top of it, you will only need the meeting room and the password if there is one

Additionally, the embedded client support for mobile browsers isn't as good as the jitsi app yet, so rendezvous will show a download link when opened from a mobile a device

Resources

  • Video Conference through Jitsi
  • Emails through SendGrid ๐Ÿ“ง
  • Base css from MVP.css โœจ (with a few modifications)
  • All potential hCaptcha earnings are donated to Wikimedia foundation ๐Ÿค—

License

MIT ยฉ this-fifo

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.