Company handbook template

This is a company handbook template meant to be used by any company that wants an easy to setup but highly customizable public or private handbook. It is implemented in Next.js with Simple.css for easy styling, and is inspired by great handbooks like the ones made by GitLab and Sourcegraph. It is intended to help you get some of the basic infrastructure up and running quickly, with the key difference that company handbook-specific data sources are built in. For example:

• Static content
  • Company information
  • Company-wide practices (for example, communication and async)
  • Values
  • Per-department guides
  • How to use the handbook content
• Dynamic content
  • Team member bios (to be added)
  • Feature lists (to be added)
  • Pricing tiers (to be added)
  • Product areas (to be added)

Sample site

You can browse a sample site containing the latest deployed template from main here at https://company-handbook-template-iota.vercel.app/.

Contributing

Although it's early days, contributors are welcome! Feel free to open an issue to discuss. There's lots to implement.

Principles

Opinionated examples

This template is designed to be opinionated. It includes examples and content that are based on lessons learned we've seen work well in many places. You're of course free to diverge and remove/add anything you like, but we explicitly are aiming for a starting point that people new to these kinds of handbooks can get value and learn from.

Ease of use

Most company handbooks will be used by both technical and non-technical team members, so it's important that we make the basic editing use case as easy as possible. We do this by making the base content easy to find, and using basic markdown for nearly all pages.

Wiki vs. static site

You might be wondering why not just use a wiki or live document editor instead of a static site for your company handbook. The main reason is the pull request workflow, where every proposed change can first be discussed using the features built-in to the merge flow of your code host. These preserve the "who" and "why" for a change much better than the alternatives, which is very important in the context of a company handbook.

Additionally, changes to a handbook often require updates to multiple places to ensure things remain consistent, and this is also not well handled by a wiki.

Finally, a static site offers a much deeper level of customization and automation for teams that want to go down that route.

Configuration

There are various configuration values in next.config.mjs:

• editRepositoryBase contains the path to your code host's edit page for your repo, which is used to create an "Edit this page" link on every page. This only works as-is if every page in your site uses the .md extension, which is the default behavior.

Editing instructions

The handbook is 'self-documenting' in that the content describing how to edit it is built and deployed with the handbook itself. You can read everything by browsing the editing documentation in this repository or at /editing/ on your deployed site.

Project configuration and deployment

Preview

Preview the example live on StackBlitz:

Deploy your own

Deploy the example using Vercel:

Use locally

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example https://github.com/async-go/company-handbook-template company-handbook-app
# or
yarn create next-app --example https://github.com/async-go/company-handbook-template company-handbook-app

Deploy it to the cloud with Vercel (Documentation).