Received; Twilio Hackathon submission
Tags: twiliohackathon, showdev, vue, opensource
Published: 2020-04-29 17:55:55

Hello, 

## What I built

I've build a web app that enable people to create a gateway to receive and store files from their friends, co-workers and themselves.

Basically, when a user signup a private bucket will be created for him. He can eventually organize it by folders and create a public access point (write-only)  for a specific folder using a unique password.

Each user has a unique username which will identify his bucket. Guests need to provide a password for the bucket to unlock a specific folder in it. Then they can upload files for the subject.

#### Category Submission: 
With this submission I've aimed mainly for: Exciting X-Factors. I've planned to integrate Cloud Storage APIs too (For syncing and backups) to fit Interesting Integrations but I run out of time apparently.

## Demo Link
 
I've implemented & deployed a MVP on Azure, the plan I've picked not perfect so it may face some latency or slow downs.

[https://received.azurewebsites.net](https://received.azurewebsites.net)

## Link to Code
{% github https://github.com/sunchayn/received %}

## How I built it (what's the stack? did I run into issues or discover something new along the way?)

I've used Laravel 7, VueJs and Tailwind to tailor this app. I've worked with BDD approach to make sure that the critical features are well covered and implemented. Also, to ensure flexibility of third party services and test-ability I've approached Adapter pattern to encapsulate the SMS logic for instance. [see in Github](https://github.com/sunchayn/received/tree/master/app/Services/SMS)

** Twilio Stack **
I've used:
- Twilio Verify API
- Twilio Authy API
- Twilio SendGrid
- Twilio Programmable SMS
check this [Services Guide](https://github.com/sunchayn/received/blob/master/__guide/SERVICES.md) to learn more how and where I've implemented them.

Twilio Programmable SMS example

![Twilio Programmable SMS](https://dev-to-uploads.s3.amazonaws.com/i/rm3nbc37jti3pa7k0vt8.jpeg)

## Additional Resources/Info
here are some additional snapshot from within the app

### Bucket Browser
The main interaction point of the app, here users can create and manage folders. Share and revoke access. Download and delete folders & files.

![Bucket](https://dev-to-uploads.s3.amazonaws.com/i/u1q84gkftnlwn74rqrez.PNG)

![Folder creation](https://dev-to-uploads.s3.amazonaws.com/i/q4x78jicb2ex0ugj4u44.gif)

![Folder sharing](https://dev-to-uploads.s3.amazonaws.com/i/2mf6q0wpmjukknn6a451.gif)

### Public access point

Here's an example how guest can unlock and upload files to a folder within a bucket.

![Public access point](https://dev-to-uploads.s3.amazonaws.com/i/ku7sj3gvy890ip1av6ke.gif)

### Settings
eventually users can change their profile settings, update their username, phone number, change folder passwords, update notifications preferences...

![settings](https://dev-to-uploads.s3.amazonaws.com/i/q4ye417ny1lvpmba3fwf.PNG)

## Last thoughts
The most satisfying moment about this project is when I immedately started to use it. I was in need for such a service for a long time. Many times I've needed to send files for my self with full quality without the need to authenticate to my account in a random computer. An example for using it to send myself the screenshot for the SMS notification (and later on this screenshots itself)

![Mobile upload](https://dev-to-uploads.s3.amazonaws.com/i/07m991i5zkh38wc22l7i.jpeg)

---

Thanks for reading, I hope you've liked the app. All feed-backs are welcomed. Let me know if I missed something for my submission.