Note
Kenchi was a privacy-first Chrome extension originally created to supercharge support tools, and built to be a generic sidebar for the internet. We unfortunately shut down in late 2022, but thought our app had enough novel technical approaches that made it worth open sourcing—so here we are! Kenchi is now available under the MIT license. You'll find here an extension built to work reliably on any third-party site, chock-full of convenience features like a robust message passing library built with extensions in mind, keyboard shortcuts, local caching, a GraphQL-driven webapp, robust reporting engine, fine-grained permissions, GitHub-style PRs for support content, a custom document editor, and much more.
If you're looking to build your own support tools in house, or looking for inspiration from a battle tested Chrome extension, we hope you find this code heplful. Shared with 💜 by co-founders Brian Krausz and Michael Schade, and previous team members Dave Cole, Katie Talwar, Kevin Ingersoll, and Pantera Arzhintar. If you have any issues, reach out to Brian or Michael and we'll do our best to help.
Important
Since this was a commercial application, we had a number of licenses and custom IDs in use you'll need to update if you want to stand up the app in full:
Fonts: If you'd like the site to look the same as our production site, you'll need to purchase a license to the delightful Neue Machina font by Pangram Pangram Foundry. Place these files in packages/site/src/fonts/: PPNeueMachina-Light.woff, PPNeueMachina-Light.woff2, PPNeueMachina-Regular.woff, and PPNeueMachina-Regular.woff2
Icons: For FontAwesome Pro icons, add your FontAwesome auth token to your .npmrc
env files: We make references to our published Chrome IDs, Sentry DSN, and other unique IDs in various .env files. Update the various .env files (find packages -name ".env*") with your own IDs.
- Install and start Docker Desktop
- Install Homebrew
brew install node@16 pnpm tmux overmind postgres- If your laptop has node install already you'll have the wrong version in your PATH.
brewwill display a message indicating this. - To check, run
node --versionand see if it's 16. - If it's not, run
export PATH="/opt/homebrew/opt/node@16/bin:$PATH"' >> ~/.zshrcfollowed by. ~/.zshrcand try again.
- If your laptop has node install already you'll have the wrong version in your PATH.
- Set up git
- Add your
@kenchi.comemail address to your GitHub account - Set up SSH key and add it to your GitHub account
git config --global user.name "Your Name"git config --global user.email "[email protected]"
- Add your
- Clone this repo via
git clone [email protected]:kenchi/kenchi.git - Go to https://github.com/settings/tokens and create a personal access token with
repoandread:packagespermissions. No expiration is fine.npm config set "//npm.fontawesome.com/:_authToken" 264E9B96-1535-4EEB-B97E-F7E324F74805npm login --registry=https://npm.pkg.github.com- Enter your Github username, the access token you just made as the password, and your @kenchi.com email.
cp packages/backend/sample.env packages/backend/.envpnpm install./packages/backend/dev/init_env(follow the instructions to install mkcert and update /etc/hosts)pnpm -C packages/backend migrate up
packages/backend/README.mdpackages/frontend/README.md
pnpm start:appis the place to start, it'll run everything you need to work on Kenchi the application.pnpm startwill also run admin and Kenchi website.
In dev, you can access the GraphQL playground at https://api.kenchi.dev/playground. Query to your heart's content! Try this for example:
{
viewer {
user {
id
}
}
}See this doc: docs/making-api-changes.md
- Merge your PR
- Make sure the tests pass on
main. Head to https://github.com/kenchi/kenchi/commits/main and wait for that green check mark next to your commit. ✅ - Pull the latest
main. - Push to the prod branch for the service you wish to deploy. You can see the full list of prod branches at https://github.com/kenchi/kenchi/branches/all?query=prod. For the frontend for example, do
git push origin main:prod-frontendFrom there, Render will take over and deliver your code to our customers. You can observe the deploy process in the Render dashboard.
A cautionary note: Render will gladly deploy a broken branch! If things somehow go south, fear not. You can rollback to an earlier, happy deploy in Render.
To deploy your branch to staging, simply push your branch (ex: my-nifty-branch) to the staging branch on origin like so:
git push origin my-nifty-branch:staging