Inspiration
I was inspired by change.org's modern approach to the old-school petition clipboard.
What it does
- Allows users to create petitions about topics they care about.
- Enables users to sign petitions they agree with.
How we built it
I started with the excellent "T3 Stack" which provides a modern, opinionated way to write full-stack web apps and provides the plumbing between a variety of helpful libraries out of the box. I created a template in Hellosign that is generic enough to be used for any of Sapling's petitions. When a user wants to sign a petition, I ask Hellosign to generate a document from that template, setting the petition's URL to personalize the document.
Challenges we ran into
I ran into some trouble letting users create an account while generating a petition. I think it's best to ask users to make an account when the reason for making an account is obvious to them. This meant baking account creation into the petition flow, but this meant "exiting" the petition creation flow to send the user to a login page, then remembering what the title of their petition was. I ended up storing the title of their petition in local storage and retrieving it from there to create the petition after the user was logged in.
Accomplishments that we're proud of
A simple signing experience. Under the hood, when the user clicks the "Sign" button on a petition, we ask Hellosign to generate a document based on the template, then ask Hellosign to generate a signature URL for that document, then ask the Hellosign Embedded library on the user's browser to open that link. But from the user's perspective, assuming they're already signed in, they simply click Sign and a modal appears requesting their signature.
What we learned
Though it was challenging to get the petition creation flow working for users who didn't already have an account with us, I learned a valuable pattern that I can re-use and build upon in future projects. The inconvenience was worth using the excellent NextAuth library, which supports a variety of authentication providers out of the box, including Dropbox. I'd like to add Dropbox login to this project.
What's next for Saplings
- Listen to webhook requests from Hellosign and use them to inform the petition's signature count (signature count is just a random number right now)
- Allow petition admin to view signed documents
- Allow designating decision makers and letting them view signed documents
- Allow editing the body of a petition
- Include title and body of petition in each document to be signed so that there is a record of the petition's state at the time the user indicated agreement with it
- Allow logging in with Dropbox
- Create a home/explore page that highlights popular petitions.
Built With
- hellosign-v3
- jamstack
- mysql
- netlify
- next-auth
- next.js
- node.js
- planetscale
- prisma
- react
- serverless
- t3-stack
- tailwindcss
- trpc
- typescript
Log in or sign up for Devpost to join the conversation.