DEV Community

Cover image for How One Developer Recreated AirDrop Using Just JavaScript

How One Developer Recreated AirDrop Using Just JavaScript

Abdisalan on December 12, 2020

Have you ever used AirDrop on iPhone or Mac? Okay, If you haven't then can you imagine seamlessly sharing files between phones or a laptop at the ...
Collapse
 
braydentw profile image
Brayden W ⚡️ •

Wow, this is so cool! I use my iPhone and Windows laptop a lot so this is a super efficient solution. 👍

Collapse
 
abdisalan_js profile image
Abdisalan •

Same! Its so useful for sharing photos 🤩

Collapse
 
barca00 profile image
barca00 •

Very interesting post. I always wondered how does airdrop work and this post sums in short all the answers.

Collapse
 
abdisalan_js profile image
Abdisalan •

AirDrop uses a proprietary HTTP based protocol over WiFi! Kinda similar but different from WebRTC. SnapDrop was just clever enough to use WebRTC for the same effect.

Collapse
 
crimsonmed profile image
Médéric Burlet •

Thanks a lot for the interesting topic! Loved reading through it.
I had two questions:

Doesn't airdrop use Bluetooth and Wi-Fi instead of webrtc?

Did you inspire yourself from send-anywhere.com/ as this is a korean startup that uses webrtc to transfer files from device to device directly. I figure this is closer to what you built than airdrop.

Collapse
 
abdisalan_js profile image
Abdisalan •

Interesting I’ve never heard of them but that’s a cool product!

Collapse
 
ur5us profile image
Juri Hahn •

Not to complain about the software but as Joseph Buchma pointed out there’s sharedrop.io/ which is also open source github.com/cowbell/sharedrop and much older, started about 6 years ago.

Collapse
 
abdisalan_js profile image
Abdisalan •

So what? No one is allowed to do this once it’s been done once? This project is also open source

Collapse
 
ur5us profile image
Juri Hahn •

Relax dude! If we put your title in context, especially the part “How One Developer […]” it just sounds dishonest due to lack of giving credit where credit’s due.

Thread Thread
 
abdisalan_js profile image
Abdisalan •

Apologies that my words came off that way! I’m merely challenging your complaint that someone already made a similar project before. 😊

Thread Thread
 
ur5us profile image
Juri Hahn •

Hence why I started with “Not to complain about the software […]”. I just found your title presumptuous given an older implementation also written in JavaScript exists, albeit using EmberJS. Both repos also have multiple committers as opposed to one. I just challenged one particular aspect of your otherwise interesting post because I felt that it didn’t need to be this way. For me personally, it somewhat detracts from the otherwise good content because I’ve known about and used ShareDrop for a long time.

Thread Thread
 
abdisalan_js profile image
Abdisalan •

Thanks for taking the time to give constructive feedback!

Collapse
 
shostarsson profile image
Rémi Lavedrine •

That's a great discovery.

I love Airdrop. Nevertheless as a Linux user myself, I often face limitations to it. :-)
I am using shredrop.io to replace airdrop but I am going to give snapdrop a try.
WebRTC is a great peace of technology so it's nice to know that snapdrop relies on it.

Thanks again for sharing it and explaining it.
Great job.

Collapse
 
yum profile image
Antariksh Verma •

JavaScript and Material Design have just outdone themselves! Congrats on this app!

Collapse
 
abdisalan_js profile image
Abdisalan •

They really have! I didn’t make the app though just to be clear 😅 I figured out the architecture and wanted to share that

Collapse
 
chaycek profile image
challey17 •

super interesting, great article!

Collapse
 
abdisalan_js profile image
Abdisalan •

Thank you! 🤩

Collapse
 
vaibhavkhulbe profile image
Vaibhav Khulbe •

That's amazing! I will surely use it 💯

Collapse
 
abdisalan_js profile image
Abdisalan •

It’s been a critical part of my workflow for the last week, Happy to share this awesome tool!

Collapse
 
marlonanthony profile image
Marlon Decosta •

Super cool! Thanks for writing this up. I'm def checking this out later.

Collapse
 
eissorcercode99 profile image
The EisSorcer •

Omg Thank you for this brilliance! Well explained

Collapse
 
abdisalan_js profile image
Abdisalan •

Thanks! 😁 Just sharing what I found interesting

Collapse
 
gadrawingz profile image
Gad Iradufasha •

Awesomely terrible!

Collapse
 
jonrandy profile image
Jon Randy 🎖️ •

This app is 5 years old. Interesting it suddenly appears here

Collapse
 
abdisalan_js profile image
Abdisalan •

Yup! I found it a week ago when I wanted to airdrop my stuff from my iPhone to windows PC. It felt like magic so I had to figure out how it worked and share it 😊

Collapse
 
micahlt profile image
Micah Lindley •

I've been an avid Snapdrop fan for about three years now, and I've never been happier. It's fast, simple, and works on any device. Great article!

Collapse
 
abdisalan_js profile image
Abdisalan •

Thanks! Loving it too! I just discovered it one week ago 😄

Collapse
 
boxpiperapp profile image
BOX PIPER •

Great work man!

Collapse
 
abdisalan_js profile image
Abdisalan •

Thank you! 🙏🏾

Collapse
 
sefrem profile image
sefrem •

With Telegram you could also transfer files between different platforms and if you are already using at as messenger you dont' need to install any additional apps.

Collapse
 
ben profile image
Ben Halpern •

🤯

Collapse
 
josephbuchma profile image
Joseph Buchma •

Good work!
What are main differences compared to sharedrop.io/ ?

Collapse
 
dario_wd_coding profile image
Dario Presutti •

Very very intersting thanks to share!

Collapse
 
gerardocrdena14 profile image
Gerardo Cárdenas •

This technology opens a world of many solutions... as the one written by Brayden W.
I really motivated with this technology.

Collapse
 
gotheer profile image
gotheer •

Thanks for writing this post.
Webrtc is not the only technology which can offer same fonctionalities on the browser.

Collapse
 
abdisalan_js profile image
Abdisalan •

Thanks! What other protocol offers peer to peer file sharing?

Collapse
 
gotheer profile image
gotheer •

Maybe this link can help:
w3c.github.io/webrtc-quic/

Collapse
 
phongduong profile image
Phong Duong •

Great. Thank you

Collapse
 
andrewbaisden profile image
Andrew Baisden •

Good read thanks for posting.

Collapse
 
ronaldohoch profile image
Ronaldo Hoch •

Awesome!

Collapse
 
mikaoelitiana profile image
Mika Andrianarijaona •

Great job !!

Collapse
 
abdisalan_js profile image
Abdisalan •

Thank you!! 🙏🏾

Collapse
 
potentialstyx profile image
PotentialStyx •

Thanks for the overview of this project!

Collapse
 
mdirshadengineer profile image
Md Irshad •

SO cool bro

Collapse
 
hassam7 profile image
Hassam Ali •

Is it possible to use this on local network which is not connected to internet?

Collapse
 
abdisalan_js profile image
Abdisalan •

Theoretically yes! I think you can go offline after the devices share their ice. I haven’t tested this though😅
You could also figure out a way to share the ice while offline, maybe copy from one computer and paste to the other?

Collapse
 
moopet profile image
Ben Sinclair •

That's... actually pretty cool.

Collapse
 
abdisalan_js profile image
Abdisalan •

🔥🔥🔥 Yup 🔥🔥🔥

Collapse
 
ganes1410 profile image
Ganesh R •

Awesome use of WerbRTC. Great work 👍

Collapse
 
abdisalan_js profile image
Abdisalan •

Just to be clear, I didn't make this 😅 I just thought it was super cool and wanted to know how it worked, then it became a blog post haha

Collapse
 
agustinustheo profile image
Agustinus Theodorus •

Love the article!

Collapse
 
abdisalan_js profile image
Abdisalan •

Thanks! :D

Collapse
 
wassimbj profile image
Wassim Ben Jdida •

why doesnt it use websocket directly ? great article btw

Collapse
 
abdisalan_js profile image
Abdisalan •

Thanks! Web sockets are slower and have to send the data to the server so it’s costs more bandwidth.