Browser Sync on Steroids

Easily collaborate by syncing webpages, scrolling behavior and clipboard in realtime with just a chrome extension! Great for stackoverflow and for sharing documentation to coworkers nearby!

Comment

Inspiration

We were inspired by Apple's seamless syncing of information (Universal Clipboard etc.) across different devices. Unfortunately, this feature is only supported by devices in the Apple ecosystem.

We found it particularly frustrating needing to open services such as web.whatsapp.com or emailing ourselves to get webpages or clipboard information across browsers on different devices. We wanted this feature to be cross-platform (supported by both Windows and Mac OS X operating systems), hence giving rise to this project.

Download

https://dummyhnr.tech/

Use Case

This easy-to-install Chrome extension syncs information (such as the current URL, scrolling etc.) on the master laptop with other follower (i.e slaves) computers. This feature is extremely useful in various scenarios.

Personal Use

  • Picking up where you left off on another laptop

Educational Settings

  • The teacher's laptop (i.e master) is able to ensure that the students' laptop (i.e slaves) do not wander off into games/Youtube videos.

For Development

  • Helps developers collaborate by sharing documentation and code snippets seamlessly through link and clipboard sharing.

The master sets a unique pincode to be entered into 'slave' devices to ensure privacy and facilitate link, clipboard and scrolling sharing.

How we built it

  • NodeJS to provide a backend to sync different information across different laptops
  • Microsoft Azure for hosting our application in the cloud
  • HTML5/CSS extension UI to provide a clean user interface for the user to interact with
  • jQuery to dynamically apply and render changes on the DOM of the webpage
  • Chrome Extension API to package our application as one bundle

Challenges we ran into

  • Asynchronous operations in Node.js causes later code blocks to be executed first, which was something that we did not account for when writing the code initially.
  • There were various Content Security Policy (CSP) guidelines that we had to abide by and configure our project for.
  • We also forgot to resolve Promises in JavaScript, causing the application to not work properly initially.

Accomplishments that we are proud of

  • We managed to successfully integrate the Chrome Extension API with Node.js as backend on a Microsoft Azure environment, even though it was our first time with the API.
  • As much as we initially thought this idea was infeasible, we still managed to build this application in the span of 24 hours.

What we learned

  • Various 'hard' skills, such as integration of different technologies and specific APIs.
  • Various 'soft' skills, such as teamwork and communication

What's next for sync

  • Sync even more information, such as photos, videos etc.
  • Expand support for other browsers
Share this project:

Updates