Write Letter Submission - DigitalOcean App Platform Hackathon
Tags: dohackathon
Published: 2021-01-10 12:27:22

## What I built
Write Letter - where you can write and talk about anything freely openly and anonymously.

### Category Submission: Random Roulette

### App Link
https://write-letter-ay2j8.ondigitalocean.app/

### Screenshots
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/xjorwhcpk0wern5dma9q.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/iwz4dintgzmb3tman0oi.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/nvrlm048hb0bkxa76m0u.png)

### Description
Write Letter is web app that allow anyone to write and talk about anything openly and anonymously

Write Letter has difference from other is that Write Letter have no grouping for each letter (except hashtag) the idea is to get peoples start talking.

#### Features
- No Sign-Up required
- Write anything, just be polited
- 2 types of writing (see below)
- Dark/Light mode

#### Writing Types
- Post: just normally posting it visible publicly to anyone
- Paper Plane: unlike normal posting, it get send to randomly to one stranger !

### Link to Source Code
- Client: https://github.com/littleboycoding/write-letter
- GraphQL (Apollo): https://github.com/littleboycoding/write-letter-apollo

### Permissive License
[MIT License](https://opensource.org/licenses/MIT)

## Background
I'm gonna be honnest, at first I was meant to create app for those who looking for people with same interested.

Why ? because at college I was unable to talk to anyone, they are unlike me, I want to have a team or group with same interested in web development to start developing some stuff !.

But I found out that there are many great tools for that out there.

Then it turn out became Write Letter !

### How I built it
I used DigitalOcean as Static Site hosting and as GraphQL API server with MongoDB Atlas as Database. Along the way I learnt a lot of new stuff ! the list are
- GraphQL with Apollo
- MongoDB with and not with MongoDB Atlas
- React (with typescript)
- YAML syntax

### Additional Resources/Info
There are GraphQL API for developer to integrated with my app !
- [Lived URL](https://write-letter-ay2j8.ondigitalocean.app/apollo)
- [SDL](https://gist.github.com/littleboycoding/33a77e24921cdc750c2cef6a6c7af882)

You can deploy to your own DigitalOcean's App Platform with one click button below

### For client
[![Deploy to DO](https://www.deploytodo.com/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/littleboycoding/write-letter/tree/master)

### For server
[![Deploy to DO](https://www.deploytodo.com/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=https://github.com/littleboycoding/write-letter-apollo/tree/main)

I also created timelapse of creation progress, [playlist are here](https://www.youtube.com/watch?v=pD3KuT2LQPw&list=PLQr5jU29HY0Z4ZXI6FXSHfIvYr4WGOajO)
{% youtube pD3KuT2LQPw %}
I've used small script which I wrote myself, it can record and compile into timelapse video check it out [here](https://github.com/littleboycoding/timelapse)

Thank you very much for this hackathon I learn a lot along the way, Sorry for my bad english, I'm still learning it.