Make a three-page client handbook before buying a knowledge base
Turn repeated handover questions into a small, searchable website using local Markdown and a free documentation generator.
An editable three-page handbook, a locally reviewed website and a clear decision about whether publishing needs a paid service.
Start with the answers your recipient needs, then choose the tools. VS Code writes the source; VitePress turns it into a navigable website. This original FreeStack exercise uses a fictional Bramble brand handover. It is documentation-based guidance, not a report of a tested provider workflow or real client result. Official sources checked 19 October 2026; the walkthrough follows the provider’s stable VitePress 1.6.4 documentation rather than its 2.0 alpha.
Free boundaries before you start
Source checks for this workflow. These notes clarify older catalogue summaries; they do not change your saved toolkit.
Visual Studio Code · checked 2026-10-19
Free for private and commercial core editing. The Microsoft distribution licence differs from the MIT Code-OSS source licence. Local Markdown editing and preview need no AI plan. Copilot, model services and extensions have separate accounts, licences and usage limits; no free hosted compute is included.
Official FAQ explicitly says installing and using core editor features needs no account. Connected AI or sync services have separate requirements.
VitePress · checked 2026-10-19
Free MIT-licensed documentation generator. This workflow follows stable 1.6.4, with local search, local builds and no generation-credit plan. Hosting, domains and private access are separate.
No provider account step appears in the documented local package-manager setup. Hosting and connected services have separate requirements.
A small example to aim for
Write once.
Make the next step clear.
FreeStack layout concept. The search field and file example are illustrative, not functional controls or a provider screenshot.
FreeStack example output · illustrative, not a provider screenshot or a tested export.
Jump to a step
Choose three questions, not a whole support portal
Write down the questions that keep interrupting a handover. For this fictional identity pack: Which file should I use? How do the colours work? How do I request an update? Give each answer one page and one intended reader. Decide whether the finished handbook can be public before putting any client information into it. Start with sample filenames and invented contact details. Leave search analytics, chatbots, accounts and ticketing outside this first version.
Write the source in a normal project folder
In VS Code, create a handbook folder and write the answers as Markdown. Start each page with a descriptive heading. Put the next action first, followed by a short example and any exception. For the files page, explain the difference between ready-to-use SVG or PNG exports and editable sources. Preview the Markdown with VS Code’s built-in preview. Keep the actual client assets outside this sample project; link to approved delivery locations only when you are ready to publish.
Add the smallest publishing layer
Install a supported Node.js release and use a terminal in the handbook folder. For the stable version checked here, install with npm add -D vitepress@1.6.4, then run npx vitepress init. Choose ./docs and the default theme. Keep the generated scripts for local development, production build and preview. Move the handbook content into docs/index.md, docs/files.md and docs/updates.md. Keep the package manifest and lockfile with your source so the chosen version is recorded. Follow the stable setup guide if your package manager differs.
Give the reader a route and one useful search
Set the site title to Bramble handbook. In the VitePress theme configuration, add navigation to Start here, Files and Updates, pointing to /, /files and /updates. Use the documented themeConfig.search option with provider set to local for built-in local search. Keep links and headings literal: Use the light logo on dark backgrounds is more helpful than Brand magic. Do not add a separate search service for this small example. Write one sentence on the home page telling the reader which page to open first.
Review the built output as a recipient
Run npm run docs:build, then npm run docs:preview using the generated scripts. Review the served production output, not only the editing preview. Follow every link, search for a real filename, resize the window and navigate with the keyboard. Ask someone unfamiliar with the project to answer the three starting questions using only the handbook. Record misunderstandings and change the copy. A local preview is not a public deployment, and a successful build does not prove the answers are useful.
Publish only when the requirement is clear
For the ./docs layout, the default publishable output is docs/.vitepress/dist. Use an existing approved static host and check its own account, bandwidth, commercial-use and access rules. A subdirectory deployment needs the correct base path; follow the stable deployment guide. Keep the editable Markdown and configuration backed up separately from the built files. FreeStack editorial upgrade triggers: consider paid hosting or a managed knowledge base only when you need a named feature such as private client access, non-technical editing, an agreed support service or a specific traffic allowance. The handbook alone does not justify another membership.
Your workflow, connected.
Follow the steps and carry the output into the next stage. These are suggested handoffs, not automatic integrations.
- 02Write the answers
Core local editing needs no account; AI and extensions are optional.
Editable Markdown pages - 03Generate the site
VitePress builds pages; it supplies no hosting subscription or private portal.
A local documentation project
Provider information
Check current plans and documentation before committing to a workflow.
View 7 provider links
- VitePress stable 1.6.4: installation, wizard and local scripts
- VitePress stable: build output, preview and base path
- VitePress stable: local search configuration
- VitePress stable: navigation configuration
- VitePress: MIT software licence
- VS Code: built-in Markdown editing and preview
- VS Code: free commercial use, no-account core editor and distribution licence
A couple of useful questions
What stays free, and what can cost money?
VS Code’s core editor is free for private and commercial use. VitePress is MIT-licensed software for local builds, with no recurring generation-credit plan in this workflow. Your hardware and storage apply. Hosting, domains, external search, AI models and third-party services have their own terms; none is included here.
Do I need an account?
Microsoft explicitly says core VS Code editing needs no account. VitePress’s documented local installation is a package-manager workflow with no provider account step. A publishing host, remote Git service or optional AI assistant can require an account separately. This guide does not verify every host’s requirements.
Why use stable 1.6.4 rather than copy the latest-looking commands?
The provider currently presents a 2.0 alpha alongside stable 1.6.4. This guide names its documentation version so setup and configuration are consistent. Before starting a future project, check the provider’s current stable version and migration notes rather than mixing instructions across releases.
What does Save this toolkit keep?
The existing FreeStack flow saves VS Code and VitePress to your private stack after sign-in. It does not upload your handbook, install software, create a host account or back up the files. Keep the source in your own approved storage.
What would you try?
Share your result or ask a specific question about this workflow.
Join the conversation
