Static Websites

Imagine being able to create a custom static website and update it's contents right from your phone without having to redeploy it!

That's exactly what we built. You can now use our Next.js template to automatically fetch your notes via the API and refresh your static website instantly. No redeploy. No commands to run. No webhooks. It just works.

We are leveraging the “Incremental Static Regeneration” feature of Next.js to keep the static website and your Collected notes in sync.

Features

• Incremental Regeneration - Deploy once and get incremental updates on your site everytime you create or update notes.
• Dark Mode Support - Detect from system preference and per-site support user preference.
• Links on the note - List all the links used at the bottom of each note.
• Search - Search between all of your notes.
• Easy to customize - Create a new repo based on this way and start customizing the look & feel.

Get Started

Make sure you have created a Collected Notes premium account. Then go to your site settings and click on “Create static website”, it should take you to the static deployments page.

Step 1: Create your static deployment

Click on the “Deploy with Vercel” button and follow the instructions.

Step 2: Configure your static website

When prompted for your environmental variables use these values shown in your static deployments page.

Step 3: Tell Collected Notes about your static website domain

Last step. Simply add the domain of your static website deploymenty on your site settings. Go to “Edit Site” > Advanced and enter your domain.

This will enable a new visibility option for your notes. All notes marked as “Showing on site” will automatically show up on your static site!

Here’s a sample static website ↗

🎉