Forem: Documenso

Deploying Documenso with Vercel, Supabase and Resend

Ephraim Duncan — Fri, 08 Sep 2023 08:18:28 +0000

In this article, we'll walk you through how to deploy and self-host Documenso using Vercel, Supabase, and Resend.

You'll learn:

How to set up a Postgres database using Supabase,
How to install SMTP with Resend,
How to deploy your project with Vercel.

If you don't know what Documenso is, it's an open-source alternative to DocuSign, with the mission to create an open signing infrastructure while embracing openness, cooperation, and transparency.

Prerequisites

Before we start, make sure you have a GitHub account. You also need Node.js and npm installed on your local machine (note: you also have the option to host it on a cloud environment using Gitpod for example; that would be another post). If you need accounts on Vercel, Supabase, and Resend, create them by visiting the Vercel, Supabase, and Resend websites.

Checklist:

[ ] Have a GitHub account
[ ] Install Node.js
[ ] Install npm
[ ] Have a Vercel account
[ ] Have a Supabase account
[ ] Have a Resend account

Step-by-Step guide to deploying Documenso with Vercel, Supabase, and Resend

To deploy Documenso, we'll take the following steps:

Fork the Documenso repository
Clone the forked repository and install dependencies
Create a new project on Supabase
Copy the Supabase Postgres database connection URL
Create a .env file
Run the migration on the Supabase Postgres Database
Get your SMTP Keys on Resend
Create a new project on Vercel
Add Environment Variables to your Vercel project

So, you're ready? Let’s dive in!

Step 1: Fork the Documenso repository

Start by creating a fork of Documenso on GitHub. You can do this by visiting the Documenso repository and clicking on the 'Fork' button. (Also, star the repo!)

Choose your GitHub profile as the owner and click on 'Create fork' to create a fork of the repo.

Step 2: Clone the forked repository and install dependencies

Clone the forked repository to your local machine in any directory of your choice. Open your terminal and enter the following commands:



# Clone the repo using Github CLI
gh repo clone [your_github_username]/documenso

# Clone the repo using Git
git clone <https://github.com/[your_github_username]/documenso.git>

You can now navigate into the directory and install the project’s dependencies:



cd documenso

npm install

Step 3: Create a new project on Supabase

Now, let's set up the database.

If you haven't already, create a new project on Supabase. This will automatically create a new Postgres database for you.

On your Supabase dashboard, click the 'New project' button and choose your organization.

On the 'Create a new project' page, set a database name of documenso and a secure password for your database. Choose a region closer to you, a pricing plan, and click on 'Create new project' to create your project.

Step 4: Copy the Supabase Postgres database connection URL

In your project, click the 'Settings' icon at the bottom left.

Under the 'Project Settings' section, click 'Database' and scroll down to the 'Connection string' section. Copy the 'URI' and update it with the password you chose in the previous step.

Step 5: Create a `.env` file

Create a .env file in the root of your project by copying the contents of the .env.example file.

Add the connection string you copied from your Supabase dashboard to the DATABASE_URL variable in the .env file.

The .env should look like this:



DATABASE_URL="postgres://postgres:[YOUR-PASSWORD]@db.[YOUR-PROJECT-REF].supabase.co:5432/postgres"

Step 6: Run the migration on the Supabase Postgres Database

Run the migration on the Supabase Postgres Database using the following command:



npx prisma migrate deploy

Step 7: Get your SMTP Keys on Resend

So, you've just cloned Documenso, installed dependencies on your local machine, and set your database using Supabase. Now, SMTP is missing. Emails won't go out! Let's fix it with Resend.

In the Resend dashboard, click 'Add API Key' to create a key for Resend SMTP.

Next, add and verify your domain in the 'Domains' section on the sidebar. This will allow you to send emails from any address associated with your domain.

You can update your .env file with the following:



SMTP_MAIL_HOST='smtp.resend.com'

SMTP_MAIL_PORT='25'

SMTP_MAIL_USER='resend'

SMTP_MAIL_PASSWORD='YOUR_RESEND_API_KEY'

MAIL_FROM='noreply@[YOUR_DOMAIN]'

Step 8: Create a new project on Vercel

You set the database with Supabase and are SMTP-ready with Resend. Almost there! The next step is to deploy the project — we'll use Vercel for that.

On your Vercel dashboard, create a new project using the forked project from your GitHub repositories. Select the project among the options and click 'Import' to start running Documenso.

Step 9: Add Environment Variables to your Vercel project

In the 'Configure Project' page, adding the required Environmental Variables is essential to ensure the application deploys without any errors.

Specifically, for the NEXT_PUBLIC_WEBAPP_URL and NEXTAUTH_URL variables, you must add .vercel.app to your Project Name. This will form the deployment URL, which will be in the format: https://[project_name].vercel.app.

For example, in my case, the deployment URL is https://documenso-supabase-web.vercel.app.

This is a sample .env to deploy. Copy and paste it to auto-populate the fields and click ‘Deploy.’ Now, you only need to wait for your project to deploy. You’re going live — enjoy!



DATABASE_URL='postgresql://postgres:typeinastrongpassword@db.njuigobjlbteahssqbtw.supabase.co:5432/postgres'

NEXT_PUBLIC_WEBAPP_URL='https://documenso-supabase-web.vercel.app'

NEXTAUTH_SECRET='something gibrish to encrypt your jwt tokens'

NEXTAUTH_URL='https://documenso-supabase-web.vercel.app'

# Get a Sendgrid Api key here: <https://signup.sendgrid.com>

SENDGRID_API_KEY=''

# Set SMTP credentials to use SMTP instead of the Sendgrid API.

SMTP_MAIL_HOST='smtp.resend.com'

SMTP_MAIL_PORT='25'

SMTP_MAIL_USER='resend'

SMTP_MAIL_PASSWORD='YOUR_RESEND_API_KEY'

MAIL_FROM='noreply@[YOUR_DOMAIN]'

NEXT_PUBLIC_ALLOW_SIGNUP=true

Wrapping up

Congratulations! 🎉 You've successfully deployed Documenso using Vercel, Supabase, and Resend. You're now ready to create and sign your own documents with your self-hosted Documenso!

In this step-by-step guide, you learned how to:

set up a Postgres database using Supabase,
install SMTP with Resend,
deploy your project with Vercel.

Over to you! How was the tutorial? If you enjoyed it, please do share! And if you have any questions or comments, please reach out to me on Twitter / X (DM open) or Discord.

We're building an open-source alternative to DocuSign and welcome every contribution. Head over to the GitHub repository and leave us a Star!

Switching to Discord

fmerian — Thu, 17 Aug 2023 10:12:04 +0000

We’re switching to Discord.

Documenso is an open-source DocuSign alternative, built with community and transparency in mind.

So, when we started working on the project, we quickly set up a Slack workspace to start engaging with community members.

As the community grows (reached 2K stars on GitHub and 100 community members on Slack), we felt the need to set up a more community-friendly environment.

The Documenso team is growing, too. Lucas joined Timur, then Ephraim and David recently joined the journey. We want to stay in touch with the community as much as possible and avoid context-switching to focus on work, support, and fun.

We’re an open-source project and focus on building a great developer experience. So, when we thought of a Slack replacement, community- and developer-friendly, Discord was an obvious choice — not to mention that it would help us keep up with OSS friends, too.

So, we’re switching all conversations, team- and community-wide, to Discord.

In this post, we won’t debate why we’re switching — Slack vs. Discord is a long-lasting debate with pros and cons, and fans on both sides. There are great stories and threads on the topic. We just don’t want to write yet another story here.

Instead, we’ll focus on how we plan to make the switch.

Who is this story for?

First, we wrote this post for the team so we’re ready for the switch. Then we post it online because we value transparency and thought it might help the community.

For community members, this story would help you understand how we plan to make the switch and give you the guidance to fully embrace the new experience.

For founders and makers who would like to switch too, in one way or another, this story would help you handle the transition with a detailed guide.

Switching to Discord

We’re switching to Discord, step by step. First, we’re moving team conversations, then we’re moving the community with a 15-day buffering.

The detailed plan goes like this:

2023-07-25 t=0: Timur starts setting up the Discord server and sends invites to the team.
2023-07-26 t+1: The team switches to Discord. The objective is to get used to the product and to customize it to feel at home and, when we’re ready to welcome the community, to make new members feel at home, too.
2023-08-02 t+8: We announce to the community the upcoming changes in the different channels — GitHub, Twitter, and Slack.
- GitHub
- [ ] Create new Pull Request
- [ ] Add story to the blog
- [ ] Update link to the community
- [ ] Start a new Discussion

https://documen.so/discord

Happy Wednesday!

TL,DR: We’re switching to Discord. [Join the fun!](https://documen.so/discord)

We want to build a beautiful, open-source DocuSign alternative. As we're growing (reached 2.3K Stars), we feel the need to have a more community- and developer-friendly environment to share ideas, support, and memes.

Make sure to join the server to keep up to date on all things Documenso.

Oh and, spoiler alert, there may be some swag there 👀

See you there!
Flo

Twitter
- [ ] Tweet the announcement
- [ ] Pin Tweet
- [ ] Update link in bio

The Open Source DocuSign Alternative.

http://documen.so/github
http://documen.so/discord
http://documen.so/manifest

Slack
- [ ] Post message in #general
- [ ] Pin post
- [ ] Set topic and description
- [ ] Archive channels: #code-review #how-to #meet-and-greet #random-memes #self-hosting #support

Happy Wednesday!

TL,DR: We’re switching to Discord. [Join the fun!](https://documen.so/discord)

We want to build a beautiful, open-source DocuSign alternative. As we're growing (reached 2.3K Stars), we feel the need to have a more community- and developer-friendly environment to share ideas, support, and memes.

Make sure to [join the server](https://documen.so/discord) to keep up to date on all things Documenso.

Oh and, spoiler alert, there may be some swag there 👀

See you there!
Flo

We're switching to Discord. Join the fun: https://documen.so/discord

2023-08-09 t+15: 7 days later, we send a reminder on Slack.
- Slack
- [ ] Schedule reminder in #general

Friendly reminder: we're switching to Discord and will soon disconnect this Slack workspace.

Join the fun! https://documen.so/discord

2023-08-16 t+22: 15 days later, we’re making the final edits to the Slack workspace.
- Slack
- [ ] Edit posting permissions in #general
- [ ] Disconnect Slack

Final thoughts

We’re at the very, early stage on our journey to building a beautiful, open-source DocuSign alternative. We want to build a great developer experience with the open-source community and, switching to Discord, we want to set up the foundations of an open, safe place for community members to get in touch, brainstorm ideas, and have fun.
It doesn’t mean we won’t ever switch back to Slack. The tools of today aren’t the ones of tomorrow. We don’t delete the Slack workspace, we archive it, and keep the documenso handle. May it be just an au revoir?
For now, we’re pushing forward and are eager to welcome you on Discord. Make sure to join the server in order to keep up to date on all things Documenso. See you there!

Forem: Documenso

Deploying Documenso with Vercel, Supabase and Resend

Prerequisites

Step-by-Step guide to deploying Documenso with Vercel, Supabase, and Resend

Step 1: Fork the Documenso repository

Step 2: Clone the forked repository and install dependencies

Step 3: Create a new project on Supabase

Step 4: Copy the Supabase Postgres database connection URL

Step 5: Create a .env file

Step 6: Run the migration on the Supabase Postgres Database

Step 7: Get your SMTP Keys on Resend

Step 8: Create a new project on Vercel

Step 9: Add Environment Variables to your Vercel project

Wrapping up

Switching to Discord

Who is this story for?

Switching to Discord

Final thoughts

Step 5: Create a `.env` file