ProofKit

Motivation

Learn more about why ProofKit was created, and how it's intended to help you.

The ProofKit CLI aims to make web development easier for beginners and more efficient for experienced devs. Its opinionated structure allows for more than just a starter template or bootstrapping tool, but code-mod scripts that can modify a project after the initial setup.

ProofKit is not a JavaScript framework. It's also not the only way to build a web app. It's simply our experience of building web apps encapsulated into a CLI tool to help you structure your project and add to it over time. Each template is just a starting point, and you are free to modify any part of it as you see fit.

For the New Web Dev

The world of JavaScript and web development is vast. It can feel like you don't know where to start or that there are too many options to choose from. ProofKit is not another JavaScript framework, but merely a CLI with some opinions to help you get started building a new web app.

ProofKit assumes that you already have some basic programming skills, perhaps from another language or low-code tool. You are a problem solver who's not afraid of troubleshooting, and you probably get a little thrill when the computer finally does what you intended for it to do!

After you start a new ProofKit project, we encourage you to play around with it! Use git to commit the initial changes, then feel free to move files around, knowing you can always safely revert your changes to a known working state. We often learn best by doing, and a functional codebase is a great learning tool for you to dive into web development.

Learning Resources

A list of subjects and tutorials to guide your web development journey.

The ProofKit Tech Stack

Here is a list of the frameworks and packages that you'll come across in a ProofKit project, the reasons why we chose them, and links to their own docs.

Browser-based Frameworks / Packages

Next.js

A well-supported open-source React framework for full-stack web applications. This means it runs code on your frontend (in the client's web browser) and backend (on the web server, or API routes). It makes it easy to get a web app up and running with all the features that we expect from a modern web app and is used by companies of all sizes to power their online presence.

Shadcn/ui NEW

A themeable component library for React. We use their default components and styles to build apps very quickly, but with the option of adding custom styles or themes later if needed. Shadcn/ui also includes many helpful React hooks, and they provide a Modal and Notification system to ProofKit apps.

Using the shadcn CLI, you can install any component or utility from any compatible library. This makes shadcn the best choice for the most flexible and customizable apps. Some of our favorite shadcn-compatible libraries are:

Tailwind CSS NEW

A utility-first CSS framework for rapidly building custom user interfaces. It's used by shadcn (and related libraries) to style the components and pages in your app.

Tanstack Query

Sometimes also known as "React Query"; a library for managing server state in React. It's used by ProofKit to fetch data from external sources, such as REST APIs, so we can be certain that the "shape" of our data matches what we expected during development.

Zod

A type-safe validation library for JavaScript and TypeScript. It's used by ProofKit to validate all inputs from external sources, such as REST APIs, so we can be certain that the "shape" of our data matches what we expected during development. It's also used in form validation.

next-safe-action

A wrapper around Next.js actions that include middleware (for easily checking that a user is signed in) and input validation with zod schemas.

Authentication

Clerk

A hosted authentication service that is extremely easy to set up and use. It's a great choice to secure most customer-facing web apps, including built-in features such as Social logins, magic link, multi-factor authentication, and more.

Better-Auth (self-hosted)

For when you need a bit more flexibility or if you want to self-host the authentication layer within your existing FileMaker solution. Better-auth is a great choice for this, and the proofkit/better-auth adapter allows you to use FileMaker as your backend database, including automated schema migrations to easily add any necessary tables and fields to your FileMaker file.