@knowcode/doc-builder 1.9.30 → 1.9.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (196) hide show
  1. package/package.json +12 -2
  2. package/.claude/settings.local.json +0 -56
  3. package/CACHE-BUSTING-GUIDE.md +0 -82
  4. package/CLAUDE.md +0 -86
  5. package/CONTRIBUTING.md +0 -148
  6. package/GITHUB_SETUP.md +0 -203
  7. package/RELEASE-NOTES-1.7.5.md +0 -64
  8. package/Screenshot 2025-07-22 at 19.51.21.png +0 -0
  9. package/Screenshot 2025-07-26 at 17.06.49.png +0 -0
  10. package/add-user-clive.sql +0 -35
  11. package/add-user-lindsay-fixed.sql +0 -85
  12. package/add-user-lindsay.sql +0 -68
  13. package/add-user-pmorgan.sql +0 -35
  14. package/add-user-robbie.sql +0 -35
  15. package/add-wru-users.sql +0 -105
  16. package/debug-login.sql +0 -30
  17. package/doc-builder.config.js +0 -126
  18. package/doc-builder.config.js.backup.1753793768283 +0 -47
  19. package/doc-builder.config.js.backup.1753803964423 +0 -114
  20. package/doc-builder.config.js.backup.1753945707032 +0 -115
  21. package/doc-builder.config.js.backup.1754059241330 +0 -115
  22. package/doc-builder.config.js.backup.1754119567787 +0 -123
  23. package/doc-builder.config.js.backup.1754120048862 +0 -124
  24. package/doc-builder.config.js.backup.1754120529913 +0 -124
  25. package/doc-builder.config.js.backup.1754218469785 +0 -124
  26. package/doc-builder.config.js.backup.1754384764054 +0 -124
  27. package/doc-builder.config.js.backup.1754567425847 +0 -124
  28. package/doc-builder.config.js.backup.1754568137859 +0 -126
  29. package/doc-builder.config.js.backup.1754569388252 +0 -126
  30. package/doc-builder.config.js.backup.1754576694123 +0 -126
  31. package/doc-builder.config.js.backup.1755031374829 +0 -126
  32. package/doc-builder.config.js.backup.1755034500990 +0 -126
  33. package/doc-builder.config.js.backup.1755034809236 +0 -126
  34. package/grant-access.sql +0 -15
  35. package/html/11.png +0 -0
  36. package/html/404.html +0 -115
  37. package/html/README.html +0 -522
  38. package/html/Screenshot 2025-08-12 at 21.35.07.png +0 -0
  39. package/html/about-doc-builder.html +0 -491
  40. package/html/auth.js +0 -157
  41. package/html/claude-workflow-guide.html +0 -525
  42. package/html/css/notion-style.css +0 -2502
  43. package/html/documentation-index.html +0 -471
  44. package/html/guides/authentication-default-change.html +0 -370
  45. package/html/guides/authentication-guide.html +0 -509
  46. package/html/guides/cache-control-anti-pattern.html +0 -361
  47. package/html/guides/claude-workflow-guide.html +0 -1074
  48. package/html/guides/configuration-guide.html +0 -472
  49. package/html/guides/document-standards.html +0 -518
  50. package/html/guides/documentation-standards.html +0 -694
  51. package/html/guides/html-embedding-guide.html +0 -461
  52. package/html/guides/image-modal-guide.html +0 -515
  53. package/html/guides/next-steps-walkthrough.html +0 -638
  54. package/html/guides/phosphor-icons-guide.html +0 -584
  55. package/html/guides/private-directory-authentication-troubleshooting.html +0 -555
  56. package/html/guides/private-directory-authentication.html +0 -541
  57. package/html/guides/public-site-deployment.html +0 -431
  58. package/html/guides/search-engine-verification-guide.html +0 -542
  59. package/html/guides/seo-guide.html +0 -661
  60. package/html/guides/seo-optimization-guide.html +0 -887
  61. package/html/guides/supabase-auth-implementation-plan.html +0 -543
  62. package/html/guides/supabase-auth-integration-plan.html +0 -671
  63. package/html/guides/supabase-auth-setup-guide.html +0 -498
  64. package/html/guides/supabase-authentication-complete-guide.html +0 -866
  65. package/html/guides/troubleshooting-guide.html +0 -633
  66. package/html/guides/vercel-deployment-auth-setup.html +0 -337
  67. package/html/guides/windows-setup-guide.html +0 -859
  68. package/html/image-modal-test.html +0 -318
  69. package/html/index.html +0 -522
  70. package/html/js/auth.js +0 -157
  71. package/html/js/main.js +0 -1754
  72. package/html/launch/README.html +0 -297
  73. package/html/launch/bubble-plugin-specification.html +0 -933
  74. package/html/launch/go-to-market-strategy.html +0 -663
  75. package/html/launch/launch-announcements.html +0 -593
  76. package/html/login.html +0 -102
  77. package/html/logout.html +0 -18
  78. package/html/private/cache-control-anti-pattern.html +0 -429
  79. package/html/private/launch/README.html +0 -371
  80. package/html/private/launch/auth-cleanup-summary.html +0 -361
  81. package/html/private/launch/bubble-plugin-specification.html +0 -1007
  82. package/html/private/launch/go-to-market-strategy.html +0 -737
  83. package/html/private/launch/launch-announcements.html +0 -667
  84. package/html/private/launch/vercel-deployment-auth-setup.html +0 -417
  85. package/html/private/next-steps-walkthrough.html +0 -679
  86. package/html/private/supabase-auth-implementation-completed.html +0 -454
  87. package/html/private/supabase-auth-implementation-plan.html +0 -594
  88. package/html/private/supabase-auth-integration-plan.html +0 -704
  89. package/html/private/supabase-auth-setup-guide.html +0 -555
  90. package/html/private/test-private-doc.html +0 -302
  91. package/html/private/user-management-tooling.html +0 -601
  92. package/html/prompts/Screenshot 2025-08-02 at 08.49.55.png +0 -0
  93. package/html/prompts/beautiful-documentation-design.html +0 -784
  94. package/html/prompts/markdown-document-standards.html +0 -422
  95. package/html/prompts/project-rename-strategy-sasha-publish.html +0 -530
  96. package/html/robots.txt +0 -9
  97. package/html/sitemap.xml +0 -357
  98. package/html/test-questions/how-does-it-work%3F.html +0 -294
  99. package/html/test-questions/step-1%3A%20getting-started.html +0 -289
  100. package/html/test-questions/what-is-the-purpose.html +0 -293
  101. package/html/test-status.html +0 -281
  102. package/html/vercel-cli-setup-guide.html +0 -495
  103. package/html/vercel-first-time-setup-guide.html +0 -454
  104. package/html/vercel.json +0 -29
  105. package/html-static/11.png +0 -0
  106. package/html-static/404.html +0 -115
  107. package/html-static/README.html +0 -609
  108. package/html-static/Screenshot 2025-08-12 at 21.35.07.png +0 -0
  109. package/html-static/about-doc-builder.html +0 -578
  110. package/html-static/css/notion-style.css +0 -2502
  111. package/html-static/documentation-index.html +0 -558
  112. package/html-static/guides/authentication-default-change.html +0 -457
  113. package/html-static/guides/authentication-guide.html +0 -596
  114. package/html-static/guides/claude-workflow-guide.html +0 -1161
  115. package/html-static/guides/configuration-guide.html +0 -559
  116. package/html-static/guides/documentation-standards.html +0 -781
  117. package/html-static/guides/html-embedding-guide.html +0 -548
  118. package/html-static/guides/image-modal-guide.html +0 -602
  119. package/html-static/guides/phosphor-icons-guide.html +0 -671
  120. package/html-static/guides/private-directory-authentication-troubleshooting.html +0 -642
  121. package/html-static/guides/private-directory-authentication.html +0 -628
  122. package/html-static/guides/public-site-deployment.html +0 -518
  123. package/html-static/guides/search-engine-verification-guide.html +0 -629
  124. package/html-static/guides/seo-guide.html +0 -748
  125. package/html-static/guides/seo-optimization-guide.html +0 -974
  126. package/html-static/guides/supabase-authentication-complete-guide.html +0 -953
  127. package/html-static/guides/troubleshooting-guide.html +0 -720
  128. package/html-static/guides/windows-setup-guide.html +0 -946
  129. package/html-static/image-modal-test.html +0 -405
  130. package/html-static/index.html +0 -609
  131. package/html-static/js/main.js +0 -1754
  132. package/html-static/prompts/Screenshot 2025-08-02 at 08.49.55.png +0 -0
  133. package/html-static/prompts/beautiful-documentation-design.html +0 -871
  134. package/html-static/prompts/markdown-document-standards.html +0 -509
  135. package/html-static/prompts/project-rename-strategy-sasha-publish.html +0 -617
  136. package/html-static/robots.txt +0 -5
  137. package/html-static/sitemap.xml +0 -195
  138. package/html-static/test-questions/how-does-it-work%3F.html +0 -381
  139. package/html-static/test-questions/step-1%3A%20getting-started.html +0 -376
  140. package/html-static/test-questions/what-is-the-purpose.html +0 -380
  141. package/html-static/vercel-cli-setup-guide.html +0 -582
  142. package/html-static/vercel-first-time-setup-guide.html +0 -541
  143. package/manage-users.sql +0 -191
  144. package/migrate-to-domain-auth.sql +0 -47
  145. package/package/CACHE-BUSTING-GUIDE.md +0 -82
  146. package/package/CHANGELOG.md +0 -902
  147. package/package/README.md +0 -248
  148. package/package/assets/css/notion-style.css +0 -2211
  149. package/package/assets/js/auth.js +0 -67
  150. package/package/assets/js/main.js +0 -1565
  151. package/package/cli.js +0 -764
  152. package/package/index.js +0 -38
  153. package/package/knowcode-doc-builder-1.3.15.tgz +0 -0
  154. package/package/lib/builder.js +0 -32
  155. package/package/lib/config.js +0 -278
  156. package/package/lib/core-builder.js +0 -957
  157. package/package/lib/deploy.js +0 -497
  158. package/package/lib/dev-server.js +0 -96
  159. package/package/package.json +0 -34
  160. package/package/scripts/npx-runner.js +0 -27
  161. package/package/scripts/setup.js +0 -56
  162. package/package/test-cache-bust.sh +0 -43
  163. package/public-config.js +0 -22
  164. package/public-html/404.html +0 -115
  165. package/public-html/README.html +0 -149
  166. package/public-html/css/notion-style.css +0 -2036
  167. package/public-html/index.html +0 -149
  168. package/public-html/js/auth.js +0 -67
  169. package/public-html/js/main.js +0 -1485
  170. package/quick-test-commands.md +0 -40
  171. package/recordings/Screenshot 2025-07-24 at 18.22.01.png +0 -0
  172. package/recordings/mh-ls-22jul.txt +0 -2305
  173. package/screenshot.png +0 -0
  174. package/scripts/Screenshot 2025-07-23 at 15.39.41.png +0 -0
  175. package/setup-database-v2.sql +0 -53
  176. package/setup-database.sql +0 -41
  177. package/test-auth-config.js +0 -17
  178. package/test-cache-bust.sh +0 -43
  179. package/test-docs/README.md +0 -39
  180. package/test-html/404.html +0 -115
  181. package/test-html/README.html +0 -172
  182. package/test-html/auth.js +0 -97
  183. package/test-html/css/notion-style.css +0 -2036
  184. package/test-html/index.html +0 -172
  185. package/test-html/js/auth.js +0 -97
  186. package/test-html/js/main.js +0 -1485
  187. package/test-html/login.html +0 -102
  188. package/test-html/logout.html +0 -18
  189. package/update-domain.sql +0 -9
  190. package/user-access-view.sql +0 -49
  191. package/user-management/README.md +0 -301
  192. package/user-management/add-users.sh +0 -776
  193. package/user-management/create-user.js +0 -65
  194. package/user-management/users.txt +0 -15
  195. package/view-all-users.sql +0 -40
  196. package/wru-auth-config.js +0 -17
package/html-static/guides/windows-setup-guide.html DELETED
@@ -1,946 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <meta name="description" content="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel. Based on real...">
7
- <title>Windows Setup Guide for Claude Code &amp; @knowcode...</title>
8
-
9
- <meta name="generator" content="@knowcode/doc-builder by Knowcode Ltd">
10
- <meta name="author" content="Lindsay Smith">
11
- <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, claude, code">
12
- <meta name="robots" content="index, follow">
13
- <link rel="canonical" href="https://doc-builder-delta.vercel.app/guides/windows-setup-guide.html">
14
-
15
- <!-- Open Graph / Facebook -->
16
- <meta property="og:type" content="article">
17
- <meta property="og:url" content="https://doc-builder-delta.vercel.app/guides/windows-setup-guide.html">
18
- <meta property="og:title" content="Windows Setup Guide for Claude Code &amp; @knowcode...">
19
- <meta property="og:description" content="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel. Based on real...">
20
- <meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
21
- <meta property="og:site_name" content="@knowcode/doc-builder">
22
- <meta property="og:locale" content="en_US">
23
-
24
- <!-- Twitter Card -->
25
- <meta name="twitter:card" content="summary_large_image">
26
- <meta name="twitter:site" content="@planbbackups">
27
- <meta name="twitter:creator" content="@planbbackups">
28
- <meta name="twitter:title" content="Windows Setup Guide for Claude Code &amp; @knowcode...">
29
- <meta name="twitter:description" content="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel. Based on real...">
30
- <meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
31
-
32
- <!-- Custom Meta Tags -->
33
- <meta name="google-site-verification" content="FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ">
34
- <meta name="msvalidate.01" content="B2D8C4C12C530D47AA962B24CAA09630">
35
-
36
- <!-- Fonts -->
37
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
38
-
39
- <!-- Icons -->
40
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
41
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
42
-
43
- <!-- Mermaid -->
44
- <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
45
-
46
- <!-- Styles -->
47
- <link rel="stylesheet" href="../css/notion-style.css">
48
-
49
-
50
- <!-- Blue theme and white background overrides for static output -->
51
- <style>
52
- /* Override green colors with blue */
53
- :root {
54
- --primary: #2563eb;
55
- --primary-dark: #1d4ed8;
56
- --primary-light: #dbeafe;
57
- --accent: #3b82f6;
58
- --color-accent-green: #2563eb;
59
- --color-accent-emerald: #3b82f6;
60
-
61
- /* White backgrounds for cleaner appearance */
62
- --color-bg-secondary: #FFFFFF;
63
- --color-bg-tertiary: #FAFAFA;
64
- --color-bg-hover: #F8F9FA;
65
- }
66
-
67
- /* Override green status colors with blue variants */
68
- .nav-item.active {
69
- background-color: #dbeafe !important;
70
- color: #1d4ed8 !important;
71
- }
72
-
73
- .nav-item:hover {
74
- background-color: #eff6ff !important;
75
- }
76
-
77
- /* Override complete/success icons to blue */
78
- .ph-check-circle[style*="color: #059669"] {
79
- color: #2563eb !important;
80
- }
81
-
82
- /* Override README/home icon color */
83
- .ph-house[style*="color: #059669"] {
84
- color: #2563eb !important;
85
- }
86
-
87
- /* Override links */
88
- a {
89
- color: #2563eb;
90
- }
91
-
92
- a:hover {
93
- color: #1d4ed8;
94
- }
95
-
96
- /* Override buttons and interactive elements */
97
- .theme-toggle:hover,
98
- .menu-toggle:hover {
99
- background-color: #dbeafe;
100
- color: #1d4ed8;
101
- }
102
-
103
- /* Override nav title hover */
104
- .nav-title:hover {
105
- background-color: #eff6ff;
106
- }
107
-
108
- /* White backgrounds for sidebar and navigation */
109
- body:not(.dark-mode) .sidebar {
110
- background: #FFFFFF !important;
111
- background-color: #FFFFFF !important;
112
- border-right: 1px solid #E5E7EB !important;
113
- }
114
-
115
- body:not(.dark-mode) .nav-section {
116
- background: #FFFFFF !important;
117
- background-color: #FFFFFF !important;
118
- }
119
-
120
- body:not(.dark-mode) .nav-content {
121
- background: #FFFFFF !important;
122
- background-color: #FFFFFF !important;
123
- }
124
-
125
- body:not(.dark-mode) .navigation {
126
- background: #FFFFFF !important;
127
- background-color: #FFFFFF !important;
128
- }
129
-
130
- /* Subtle separation for nav sections */
131
- body:not(.dark-mode) .nav-section + .nav-section {
132
- border-top: 1px solid #F3F4F6;
133
- }
134
-
135
- /* Adjust hover states for white backgrounds */
136
- body:not(.dark-mode) .nav-item:hover {
137
- background-color: #F8F9FA !important;
138
- }
139
-
140
- body:not(.dark-mode) .nav-title.collapsible:hover {
141
- background-color: #F8F9FA !important;
142
- }
143
-
144
- /* Header stays white (already is) but ensure consistency */
145
- body:not(.dark-mode) .header {
146
- background: #FFFFFF !important;
147
- background-color: #FFFFFF !important;
148
- border-bottom: 1px solid #E5E7EB !important;
149
- }
150
-
151
- /* Ensure search box looks good on white */
152
- body:not(.dark-mode) .filter-input,
153
- body:not(.dark-mode) .sidebar-search {
154
- background: #F8F9FA !important;
155
- background-color: #F8F9FA !important;
156
- border: 1px solid #E5E7EB !important;
157
- }
158
-
159
- body:not(.dark-mode) .filter-input:focus,
160
- body:not(.dark-mode) .sidebar-search:focus {
161
- background: #FFFFFF !important;
162
- background-color: #FFFFFF !important;
163
- border-color: #2563eb !important;
164
- }
165
-
166
- /* Override breadcrumbs */
167
- .breadcrumbs a {
168
- color: #2563eb;
169
- }
170
-
171
- .breadcrumbs a:hover {
172
- color: #1d4ed8;
173
- background-color: #dbeafe;
174
- }
175
-
176
- /* Override filter icon */
177
- .filter-icon {
178
- color: #2563eb;
179
- }
180
-
181
- /* Override deployment info on hover */
182
- .deployment-date:hover {
183
- color: #2563eb;
184
- }
185
-
186
- /* Dark mode adjustments */
187
- body.dark-mode {
188
- --primary: #3b82f6;
189
- --primary-dark: #2563eb;
190
- --primary-light: #1e3a8a;
191
- --accent: #60a5fa;
192
- }
193
-
194
- body.dark-mode .nav-item.active {
195
- background-color: rgba(59, 130, 246, 0.1) !important;
196
- color: #60a5fa !important;
197
- }
198
-
199
- body.dark-mode .nav-item:hover {
200
- background-color: rgba(59, 130, 246, 0.05) !important;
201
- }
202
-
203
- body.dark-mode a {
204
- color: #60a5fa;
205
- }
206
-
207
- body.dark-mode a:hover {
208
- color: #93bbfc;
209
- }
210
- </style>
211
-
212
-
213
-
214
-
215
- <!-- Favicon -->
216
- <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✨</text></svg>">
217
-
218
- <script type="application/ld+json">
219
- {
220
- "@context": "https://schema.org",
221
- "@type": "TechArticle",
222
- "headline": "Windows Setup Guide for Claude Code & @knowcode/doc-builder",
223
- "description": "This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel. Based on real...",
224
- "author": {
225
- "@type": "Person",
226
- "name": "Lindsay Smith"
227
- },
228
- "publisher": {
229
- "@type": "Organization",
230
- "name": "Knowcode Ltd",
231
- "url": "https://knowcode.tech"
232
- },
233
- "datePublished": "2025-08-12T21:40:09.539Z",
234
- "dateModified": "2025-08-12T21:40:09.539Z",
235
- "mainEntityOfPage": {
236
- "@type": "WebPage",
237
- "@id": "https://doc-builder-delta.vercel.app/guides/windows-setup-guide.html"
238
- },
239
- "breadcrumb": {
240
- "@type": "BreadcrumbList",
241
- "itemListElement": [
242
- {
243
- "@type": "ListItem",
244
- "position": 1,
245
- "name": "@knowcode/doc-builder",
246
- "item": "https://doc-builder-delta.vercel.app"
247
- },
248
- {
249
- "@type": "ListItem",
250
- "position": 2,
251
- "name": "Guides",
252
- "item": "https://doc-builder-delta.vercel.app/guides/"
253
- },
254
- {
255
- "@type": "ListItem",
256
- "position": 3,
257
- "name": "Windows Setup Guide",
258
- "item": "https://doc-builder-delta.vercel.app/guides/windows-setup-guide.html"
259
- }
260
- ]
261
- }
262
- }
263
- </script>
264
- </head>
265
- <body>
266
-
267
-
268
-
269
-
270
- <!-- Breadcrumbs -->
271
- <nav class="breadcrumbs breadcrumbs-static" id="breadcrumbs" data-build-date="Aug 12, 2025, 09:40 PM UTC" data-doc-builder-version="1.9.29">
272
-
273
- <!-- Pre-rendered breadcrumb content for static builds -->
274
- <div class="breadcrumbs-content breadcrumbs-homepage">
275
- <div class="breadcrumbs-right">
276
- <span class="breadcrumb-date" title="Built with doc-builder v1.9.29">Last updated: Aug 12, 2025, 09:40 PM UTC</span>
277
- <button class="breadcrumb-pdf-btn" onclick="if(typeof exportToPDF !== 'undefined') exportToPDF(); else window.print();" title="Export to PDF" aria-label="Export to PDF">
278
- <i class="fas fa-file-pdf"></i>
279
- </button>
280
- </div>
281
- </div>
282
-
283
- </nav>
284
-
285
- <!-- Main Content -->
286
- <div class="main-wrapper">
287
- <!-- Sidebar -->
288
- <aside class="sidebar">
289
- <div class="sidebar-header">
290
- <div class="filter-box">
291
- <input type="text" placeholder="Search menu..." class="filter-input" id="nav-filter">
292
- <i class="fas fa-search filter-icon"></i>
293
- </div>
294
- </div>
295
- <nav class="navigation">
296
-
297
- <div class="nav-section" data-level="0">
298
- <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
299
- <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
300
- </a>
301
- <div class="nav-content">
302
- <a href="README.html" class="nav-item" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
303
- <a href="about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #2563eb;"></i> About Doc Builder</a>
304
- <a href="documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
305
- <a href="image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
306
- <a href="vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Vercel Cli Setup Guide</a>
307
- <a href="vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Vercel First Time Setup Guide</a></div></div>
308
- <div class="nav-section" data-level="1">
309
- <a class="nav-title collapsible expanded" href="#" data-target="nav-guides-1" >
310
- <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-book"></i> Guides
311
- </a>
312
- <div class="nav-content" id="nav-guides-1">
313
- <a href="guides/authentication-default-change.html" class="nav-item" data-tooltip="Starting from version 1.7.4, @knowcode/doc-builder now defaults to no authentication for all documentation sites."><i class="ph ph-file-text"></i> Authentication Default Change</a>
314
- <a href="guides/authentication-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase - a secure, scalable authentication platform."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Authentication Guide</a>
315
- <a href="guides/claude-workflow-guide.html" class="nav-item" data-tooltip="This guide demonstrates an efficient workflow for using Claude Code with a refined CLAUDE.md file to create high-quality documentation and deploy it..."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Claude Workflow Guide</a>
316
- <a href="guides/configuration-guide.html" class="nav-item" data-tooltip="This guide explains how @knowcode/doc-builder handles configuration files and settings."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Configuration Guide</a>
317
- <a href="guides/documentation-standards.html" class="nav-item" data-tooltip="This document defines the documentation standards and conventions for the @knowcode/doc-builder project."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Standards</a>
318
- <a href="guides/html-embedding-guide.html" class="nav-item" data-tooltip="Starting from version 1.9.2, doc-builder treats HTML files ( and ) as attachments that are automatically copied to your output directory during the..."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Html Embedding Guide</a>
319
- <a href="guides/image-modal-guide.html" class="nav-item" data-tooltip="When users click on any image in your generated documentation, it opens in a professional modal overlay with: Full-screen viewing experience Smooth..."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Image Modal Guide</a>
320
- <a href="guides/phosphor-icons-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder automatically converts Unicode emojis in your markdown files to beautiful Phosphor icons in the generated HTML."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Phosphor Icons Guide</a>
321
- <a href="guides/private-directory-authentication.html" class="nav-item" data-tooltip="The @knowcode/doc-builder provides flexible authentication options to protect your documentation."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Private Directory Authentication</a>
322
- <a href="guides/private-directory-authentication-troubleshooting.html" class="nav-item" data-tooltip="Private Directory Authentication Troubleshooting."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Private Directory Authentication Troubleshooting</a>
323
- <a href="guides/public-site-deployment.html" class="nav-item" data-tooltip="The @knowcode/doc-builder now supports deploying public documentation sites without authentication."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Public Site Deployment</a>
324
- <a href="guides/search-engine-verification-guide.html" class="nav-item" data-tooltip="Search engine verification provides access to powerful webmaster tools:."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Search Engine Verification Guide</a>
325
- <a href="guides/seo-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes comprehensive SEO (Search Engine Optimization) features to help your documentation rank better in search results and..."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Seo Guide</a>
326
- <a href="guides/seo-optimization-guide.html" class="nav-item" data-tooltip="Comprehensive guide to optimizing documentation for search engines. Learn SEO best practices, use built-in features, and improve your rankings."><i class="ph ph-check-circle" style="color: #2563eb;"></i> SEO Optimization Guide for @knowcode/doc-builder</a>
327
- <a href="guides/supabase-authentication-complete-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes built-in Supabase authentication that provides enterprise-grade security with zero configuration."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Supabase Authentication Complete Guide</a>
328
- <a href="guides/troubleshooting-guide.html" class="nav-item" data-tooltip="This guide helps you resolve common issues when using @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Troubleshooting Guide</a>
329
- <a href="guides/windows-setup-guide.html" class="nav-item active" data-tooltip="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Windows Setup Guide</a></div></div>
330
- <div class="nav-section" data-level="1">
331
- <a class="nav-title collapsible" href="#" data-target="nav-prompts-1" >
332
- <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-chat-circle-dots"></i> Prompts
333
- </a>
334
- <div class="nav-content collapsed" id="nav-prompts-1">
335
- <a href="prompts/beautiful-documentation-design.html" class="nav-item" data-tooltip="🎨 Beautiful Documentation Design Guide."><i class="ph ph-check-circle" style="color: #2563eb;"></i> Beautiful Documentation Design</a>
336
- <a href="prompts/markdown-document-standards.html" class="nav-item" data-tooltip="Detailed introduction to the topic..."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Markdown Document Standards</a>
337
- <a href="prompts/project-rename-strategy-sasha-publish.html" class="nav-item" data-tooltip="This document outlines the comprehensive strategy for renaming the @knowcode/doc-builder project to &quot;sasha-publish&quot;, including all package references,..."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Project Rename Strategy Sasha Publish</a></div></div>
338
- <div class="nav-section" data-level="1">
339
- <a class="nav-title collapsible" href="#" data-target="nav-test-questions-1" >
340
- <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-folder"></i> Test Questions
341
- </a>
342
- <div class="nav-content collapsed" id="nav-test-questions-1">
343
- <a href="test-questions/how-does-it-work%3F.html" class="nav-item" data-tooltip="This is a test file to verify that question marks work properly in filenames."><i class="ph ph-file-text"></i> How Does It Work?</a>
344
- <a href="test-questions/step-1%3A%20getting-started.html" class="nav-item" data-tooltip="Step 1: Getting Started."><i class="ph ph-file-text"></i> Step 1: Getting Started</a>
345
- <a href="test-questions/what-is-the-purpose.html" class="nav-item" data-tooltip="Understanding the purpose of our documentation system"><i class="ph ph-file-text"></i> What Is The Purpose?</a></div></div>
346
- </nav>
347
- <div class="resize-handle"></div>
348
- </aside>
349
-
350
- <!-- Content Area -->
351
- <main class="content">
352
- <div class="content-inner">
353
- <h1>Windows Setup Guide for Claude Code &amp; @knowcode/doc-builder</h1>
354
- <h2>Overview</h2>
355
- <p>This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel. Based on real troubleshooting experience, this guide addresses common Windows-specific challenges and provides clear solutions.</p>
356
- <h2>Quick Prerequisites Overview</h2>
357
- <p><strong>Required Accounts:</strong></p>
358
- <ul>
359
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> <strong>Claude Pro or Max</strong> subscription ($20-200/month) - <a href="https://claude.ai">claude.ai</a></li>
360
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> <strong>Vercel</strong> account (free Hobby plan) - <a href="https://vercel.com">vercel.com</a></li>
361
- <li><i style="font-size: 1.2em" class="ph ph-star" aria-label="star"></i> <strong>GitHub</strong> account (optional but recommended) - <a href="https://github.com">github.com</a></li>
362
- </ul>
363
- <p><strong>Required Software:</strong></p>
364
- <ul>
365
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Windows 10/11 with Administrator access</li>
366
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Node.js 14+ and npm - <a href="https://nodejs.org">nodejs.org</a></li>
367
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Git for Windows - <a href="https://gitforwindows.org">gitforwindows.org</a></li>
368
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> PowerShell 5.1+ (included with Windows)</li>
369
- <li><i style="font-size: 1.2em" class="ph ph-star" aria-label="star"></i> Visual Studio Code (recommended) - <a href="https://code.visualstudio.com">code.visualstudio.com</a></li>
370
- </ul>
371
- <h2>Understanding Claude vs Claude Code</h2>
372
- <h3>What&#39;s the Difference?</h3>
373
- <p><strong>Claude.ai</strong> (Web Interface):</p>
374
- <ul>
375
- <li>Browser-based chat interface</li>
376
- <li>General-purpose AI assistant</li>
377
- <li>Good for conversations and one-off tasks</li>
378
- <li>Limited file handling capabilities</li>
379
- </ul>
380
- <p><strong>Claude Code</strong> (Command-Line Tool):</p>
381
- <ul>
382
- <li>Terminal/command-line interface</li>
383
- <li>Specialized for software development</li>
384
- <li>Direct file system access</li>
385
- <li>Can read, write, and modify multiple files</li>
386
- <li>Integrated with your development workflow</li>
387
- <li>Requires Pro or Max subscription</li>
388
- </ul>
389
- <h3>Why Claude Code for Documentation?</h3>
390
- <p>Claude Code excels at:</p>
391
- <ul>
392
- <li>Reading entire codebases</li>
393
- <li>Generating multiple markdown files</li>
394
- <li>Updating existing documentation</li>
395
- <li>Creating consistent formatting</li>
396
- <li>Working directly in your project folder</li>
397
- </ul>
398
- <h2>The Three-Part System</h2>
399
- <p>Understanding the conceptual separation is crucial:</p>
400
- <table>
401
- <tr>
402
- <td width="33%">
403
-
404
- <h3>1. Claude Code</h3>
405
- <p><strong>Purpose</strong>: Create markdown content<br><strong>What it does</strong>: AI-powered content generation<br><strong>Output</strong>: <code>.md</code> files with documentation</p>
406
- </td>
407
- <td width="33%">
408
-
409
- <h3>2. doc-builder</h3>
410
- <p><strong>Purpose</strong>: Convert MD to HTML<br><strong>What it does</strong>: Beautiful static site generation<br><strong>Output</strong>: Styled HTML website</p>
411
- </td>
412
- <td width="33%">
413
-
414
- <h3>3. Vercel</h3>
415
- <p><strong>Purpose</strong>: Host the website<br><strong>What it does</strong>: Free web hosting<br><strong>Output</strong>: Live URL for your docs</p>
416
- </td>
417
- </tr>
418
- </table>
419
-
420
- <h2>Complete Prerequisites Summary</h2>
421
- <h3>Required Accounts</h3>
422
- <table>
423
- <thead>
424
- <tr>
425
- <th>Service</th>
426
- <th>Purpose</th>
427
- <th>Requirements</th>
428
- <th>Sign Up Link</th>
429
- </tr>
430
- </thead>
431
- <tbody><tr>
432
- <td><strong>Claude</strong></td>
433
- <td>AI content generation</td>
434
- <td>Pro ($20/mo) or Max ($200/mo) plan required</td>
435
- <td><a href="https://claude.ai">claude.ai</a></td>
436
- </tr>
437
- <tr>
438
- <td><strong>GitHub</strong></td>
439
- <td>Version control</td>
440
- <td>Free account (required for Vercel)</td>
441
- <td><a href="https://github.com">github.com</a></td>
442
- </tr>
443
- <tr>
444
- <td><strong>Vercel</strong></td>
445
- <td>Free web hosting</td>
446
- <td>Free Hobby account sufficient</td>
447
- <td><a href="https://vercel.com">vercel.com</a></td>
448
- </tr>
449
- </tbody></table>
450
- <h3>Software Requirements</h3>
451
- <table>
452
- <thead>
453
- <tr>
454
- <th>Software</th>
455
- <th>Version</th>
456
- <th>Purpose</th>
457
- <th>Required?</th>
458
- </tr>
459
- </thead>
460
- <tbody><tr>
461
- <td><strong>Windows</strong></td>
462
- <td>10 or 11</td>
463
- <td>Operating system</td>
464
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Required</td>
465
- </tr>
466
- <tr>
467
- <td><strong>Node.js</strong></td>
468
- <td>14.0+</td>
469
- <td>JavaScript runtime</td>
470
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Required</td>
471
- </tr>
472
- <tr>
473
- <td><strong>npm</strong></td>
474
- <td>(included)</td>
475
- <td>Package manager</td>
476
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Required</td>
477
- </tr>
478
- <tr>
479
- <td><strong>Git</strong></td>
480
- <td>Latest</td>
481
- <td>Version control</td>
482
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Required</td>
483
- </tr>
484
- <tr>
485
- <td><strong>PowerShell</strong></td>
486
- <td>5.1+</td>
487
- <td>Command line</td>
488
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Required</td>
489
- </tr>
490
- <tr>
491
- <td><strong>VS Code</strong></td>
492
- <td>Latest</td>
493
- <td>Code editor</td>
494
- <td><i style="font-size: 1.2em" class="ph ph-star" aria-label="star"></i> Recommended</td>
495
- </tr>
496
- </tbody></table>
497
- <h3>Administrative Requirements</h3>
498
- <ul>
499
- <li><strong>Administrator access</strong> on Windows (for PowerShell execution policy)</li>
500
- <li><strong>Internet connection</strong> for downloading tools and deploying</li>
501
- <li><strong>Email address</strong> for account creation</li>
502
- </ul>
503
- <h3>Installation Order</h3>
504
- <table>
505
- <thead>
506
- <tr>
507
- <th>Step</th>
508
- <th>Component</th>
509
- <th>Required For</th>
510
- <th>Download Link</th>
511
- </tr>
512
- </thead>
513
- <tbody><tr>
514
- <td>1</td>
515
- <td>Node.js &amp; npm</td>
516
- <td>doc-builder</td>
517
- <td><a href="https://nodejs.org/en/download/">Download Node.js</a></td>
518
- </tr>
519
- <tr>
520
- <td>2</td>
521
- <td>Git for Windows</td>
522
- <td>Claude Code</td>
523
- <td><a href="https://gitforwindows.org/">Download Git</a></td>
524
- </tr>
525
- <tr>
526
- <td>3</td>
527
- <td>Visual Studio Code</td>
528
- <td>Development</td>
529
- <td><a href="https://code.visualstudio.com/">Download VS Code</a></td>
530
- </tr>
531
- <tr>
532
- <td>4</td>
533
- <td>Claude Code CLI</td>
534
- <td>AI content</td>
535
- <td>Via npm (see below)</td>
536
- </tr>
537
- <tr>
538
- <td>5</td>
539
- <td>Vercel CLI</td>
540
- <td>Deployment</td>
541
- <td>Via npm (see below)</td>
542
- </tr>
543
- </tbody></table>
544
- <h3>Account Setup Checklist</h3>
545
- <ul>
546
- <li><p><input disabled="" type="checkbox">
547
- <strong>Claude Account</strong></p>
548
- <ul>
549
- <li><input disabled="" type="checkbox"> Sign up at <a href="https://claude.ai">claude.ai</a></li>
550
- <li><input disabled="" type="checkbox"> Subscribe to Pro ($20/mo) or Max ($200/mo) plan</li>
551
- <li><input disabled="" type="checkbox"> Verify email</li>
552
- <li><input disabled="" type="checkbox"> Note: Free plan does NOT include Claude Code access</li>
553
- </ul>
554
- </li>
555
- <li><p><input disabled="" type="checkbox">
556
- <strong>GitHub Account</strong> (Required)</p>
557
- <ul>
558
- <li><input disabled="" type="checkbox"> Sign up at <a href="https://github.com">github.com</a></li>
559
- <li><input disabled="" type="checkbox"> Configure username and email</li>
560
- <li><input disabled="" type="checkbox"> Enable 2FA (recommended)</li>
561
- <li><input disabled="" type="checkbox"> Required for Vercel deployment</li>
562
- </ul>
563
- </li>
564
- <li><p><input disabled="" type="checkbox">
565
- <strong>Vercel Account</strong></p>
566
- <ul>
567
- <li><input disabled="" type="checkbox"> Sign up at <a href="https://vercel.com">vercel.com</a> using GitHub</li>
568
- <li><input disabled="" type="checkbox"> Choose Hobby (free) plan</li>
569
- <li><input disabled="" type="checkbox"> Authorize Vercel to access GitHub</li>
570
- </ul>
571
- </li>
572
- </ul>
573
- <h2>Step 1: Enable PowerShell Script Execution</h2>
574
- <p><strong><i style="font-size: 1.2em" class="ph ph-warning-circle" aria-label="warning"></i> IMPORTANT</strong>: This must be done FIRST as Administrator</p>
575
- <h3>Open PowerShell as Administrator</h3>
576
- <ol>
577
- <li>Press <code>Windows + X</code></li>
578
- <li>Select <strong>Terminal (Admin)</strong> or <strong>Windows PowerShell (Admin)</strong></li>
579
- <li>Click <strong>Yes</strong> when prompted by User Account Control</li>
580
- </ol>
581
- <h3>Enable Script Execution</h3>
582
- <p>Run this command in the Administrator PowerShell:</p>
583
- <pre><code class="language-powershell">Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser
584
- </code></pre>
585
- <p>When prompted, type <code>Y</code> and press Enter.</p>
586
- <h3>Verify the Change</h3>
587
- <pre><code class="language-powershell">Get-ExecutionPolicy
588
- </code></pre>
589
- <p>Should return: <code>RemoteSigned</code></p>
590
- <h2>Step 2: Install Node.js and npm</h2>
591
- <h3>Download and Install</h3>
592
- <ol>
593
- <li>Go to <a href="https://nodejs.org/en/download/">Node.js Downloads</a></li>
594
- <li>Download the <strong>Windows Installer (.msi)</strong> for your system (64-bit recommended)</li>
595
- <li>Run the installer with these settings:<ul>
596
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Accept the license agreement</li>
597
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Default installation location</li>
598
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> <strong>IMPORTANT</strong>: Ensure &quot;npm package manager&quot; is checked</li>
599
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Add to PATH (should be checked by default)</li>
600
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Automatically install necessary tools (optional but recommended)</li>
601
- </ul>
602
- </li>
603
- </ol>
604
- <h3>Verify Installation</h3>
605
- <p>Open a <strong>new</strong> PowerShell window (not as admin) and run:</p>
606
- <pre><code class="language-powershell">node -v
607
- npm -v
608
- </code></pre>
609
- <p>You should see version numbers for both commands.</p>
610
- <h3>Troubleshooting npm Issues</h3>
611
- <p>If you get &quot;running scripts is disabled&quot; error:</p>
612
- <ol>
613
- <li>You didn&#39;t enable PowerShell execution policy (go back to Step 1)</li>
614
- <li>You need to close and reopen PowerShell after installing Node.js</li>
615
- <li>Try running PowerShell as Administrator</li>
616
- </ol>
617
- <h2>Step 3: Install Git for Windows</h2>
618
- <h3>Download and Install</h3>
619
- <ol>
620
- <li>Go to <a href="https://gitforwindows.org/">Git for Windows</a></li>
621
- <li>Download the installer</li>
622
- <li>Run with these recommended settings:<ul>
623
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Use Visual Studio Code as default editor</li>
624
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Git from the command line and also from 3rd-party software</li>
625
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Use bundled OpenSSH</li>
626
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Checkout Windows-style, commit Unix-style line endings</li>
627
- <li><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Use Windows&#39; default console window</li>
628
- </ul>
629
- </li>
630
- </ol>
631
- <h3>Verify Installation</h3>
632
- <pre><code class="language-powershell">git --version
633
- </code></pre>
634
- <h2>Step 4: Set Up Claude Code</h2>
635
- <h3>Understanding Claude Plans</h3>
636
- <p>Claude Code requires a Claude Pro or Team plan subscription:</p>
637
- <table>
638
- <thead>
639
- <tr>
640
- <th>Plan</th>
641
- <th>Price</th>
642
- <th>Claude Code Access</th>
643
- <th>Best For</th>
644
- </tr>
645
- </thead>
646
- <tbody><tr>
647
- <td><strong>Free</strong></td>
648
- <td>$0/month</td>
649
- <td><i style="font-size: 1.2em" class="ph ph-x-circle" aria-label="error"></i> No access</td>
650
- <td>Basic chat only</td>
651
- </tr>
652
- <tr>
653
- <td><strong>Pro</strong></td>
654
- <td>$20/month</td>
655
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Full access</td>
656
- <td>Individual developers</td>
657
- </tr>
658
- <tr>
659
- <td><strong>Max</strong></td>
660
- <td>$200/month</td>
661
- <td><i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i> Full access</td>
662
- <td>Power users, higher limits</td>
663
- </tr>
664
- </tbody></table>
665
- <p><strong>Important</strong>: Only Pro and Max plans include Claude Code access. The free Claude.ai plan does NOT support Claude Code. See <a href="https://support.anthropic.com/en/articles/11145838-using-claude-code-with-your-pro-or-max-plan">Using Claude Code with Pro/Max Plans</a></p>
666
- <h3>Install Claude Code CLI</h3>
667
- <pre><code class="language-powershell">npm install -g @anthropic/claude-code
668
- </code></pre>
669
- <h3>Initialize Claude Code</h3>
670
- <pre><code class="language-powershell">claude
671
- </code></pre>
672
- <p>Follow the prompts:</p>
673
- <ol>
674
- <li>Choose <strong>Dark mode</strong> or <strong>Light mode</strong></li>
675
- <li>Select <strong>Login with Claude account</strong></li>
676
- <li>Authorize in your browser</li>
677
- <li>Return to terminal when complete</li>
678
- </ol>
679
- <h3>Verify Setup</h3>
680
- <pre><code class="language-powershell">claude --version
681
- </code></pre>
682
- <h2>Step 5: Install @knowcode/doc-builder</h2>
683
- <h3>Global Installation (Recommended)</h3>
684
- <pre><code class="language-powershell">npm install -g @knowcode/doc-builder@latest
685
- </code></pre>
686
- <h3>Verify Installation</h3>
687
- <pre><code class="language-powershell">doc-builder --version
688
- </code></pre>
689
- <h3>Create Project Folder</h3>
690
- <pre><code class="language-powershell">cd Documents
691
- mkdir my-docs-project
692
- cd my-docs-project
693
- </code></pre>
694
- <h2>Step 6: Set Up Vercel</h2>
695
- <h3>Understanding Vercel Plans</h3>
696
- <table>
697
- <thead>
698
- <tr>
699
- <th>Plan</th>
700
- <th>Price</th>
701
- <th>Features</th>
702
- <th>Best For</th>
703
- </tr>
704
- </thead>
705
- <tbody><tr>
706
- <td><strong>Hobby</strong></td>
707
- <td>Free</td>
708
- <td>Unlimited static sites, HTTPS, Global CDN</td>
709
- <td>Personal projects, documentation</td>
710
- </tr>
711
- <tr>
712
- <td><strong>Pro</strong></td>
713
- <td>$20/month</td>
714
- <td>Team features, analytics, support</td>
715
- <td>Professional use</td>
716
- </tr>
717
- </tbody></table>
718
- <p>The free Hobby plan is perfect for documentation sites!</p>
719
- <h3>Create GitHub Account First</h3>
720
- <ol>
721
- <li>Go to <a href="https://github.com">GitHub</a></li>
722
- <li>Click <strong>Sign Up</strong></li>
723
- <li>Create username and verify email</li>
724
- <li>Complete account setup</li>
725
- </ol>
726
- <h3>Create Vercel Account (Requires GitHub)</h3>
727
- <ol>
728
- <li>Go to <a href="https://vercel.com">Vercel</a></li>
729
- <li>Click <strong>Sign Up</strong></li>
730
- <li>Choose <strong>Continue with GitHub</strong> (recommended)</li>
731
- <li>Authorize Vercel to access your GitHub</li>
732
- <li>Select <strong>Hobby</strong> plan (free)</li>
733
- </ol>
734
- <h3>Install Vercel CLI</h3>
735
- <pre><code class="language-powershell">npm install -g vercel@latest
736
- </code></pre>
737
- <h3>Login to Vercel</h3>
738
- <pre><code class="language-powershell">vercel login
739
- </code></pre>
740
- <p>This will open your browser for authentication.</p>
741
- <h2>Step 7: Complete Workflow Example</h2>
742
- <h3>1. Create Documentation with Claude Code</h3>
743
- <p>In Visual Studio Code terminal:</p>
744
- <pre><code class="language-powershell">claude
745
- </code></pre>
746
- <p>Then ask Claude to create documentation:</p>
747
- <pre><code>Create a comprehensive technical documentation for my API including authentication, endpoints, and examples
748
- </code></pre>
749
- <h3>2. Build HTML with doc-builder</h3>
750
- <pre><code class="language-powershell">doc-builder build
751
- </code></pre>
752
- <h3>3. Deploy to Vercel</h3>
753
- <pre><code class="language-powershell">doc-builder deploy
754
- </code></pre>
755
- <h4>First Deployment Setup Questions</h4>
756
- <p>You&#39;ll be prompted with several questions. Here&#39;s what each one means:</p>
757
- <p><strong>1. &quot;Set up and deploy?&quot;</strong> → Type <code>Y</code> (Yes)</p>
758
- <ul>
759
- <li>This confirms you want to deploy your documentation to Vercel</li>
760
- </ul>
761
- <p><strong>2. &quot;What is your project name?&quot;</strong> → Example: <code>my-api-docs</code></p>
762
- <ul>
763
- <li>This becomes your URL: <code>https://my-api-docs.vercel.app</code></li>
764
- <li>Also used as the project identifier in Vercel dashboard</li>
765
- </ul>
766
- <p> <strong>Naming Requirements:</strong></p>
767
- <ul>
768
- <li>Must be <strong>lowercase</strong> only</li>
769
- <li>Up to 100 characters long</li>
770
- <li>Can include: letters, numbers, <code>.</code> <code>_</code> <code>-</code></li>
771
- <li>Cannot contain: <code>---</code> (three consecutive hyphens)</li>
772
- <li>Must start with a letter</li>
773
- </ul>
774
- <p> <strong>Good examples:</strong> <code>my-docs</code>, <code>api-docs-v2</code>, <code>team_handbook</code><br> <strong>Bad examples:</strong> <code>My-Docs</code> (uppercase), <code>123-docs</code> (starts with number), <code>my---docs</code> (triple hyphen)</p>
775
- <p><strong>3. &quot;Which scope do you want to deploy to?&quot;</strong> → Select your account</p>
776
- <ul>
777
- <li>Choose your personal account or team name</li>
778
- </ul>
779
- <p><strong>4. &quot;Link to existing project?&quot;</strong> → Type <code>N</code> (No) for first time</p>
780
- <ul>
781
- <li>Choose <code>Y</code> only if you&#39;ve already created this project before</li>
782
- </ul>
783
- <p><strong>5. &quot;What&#39;s the name of your existing project?&quot;</strong> → Skip if you chose No above</p>
784
- <p><strong>6. &quot;In which directory is your code located?&quot;</strong> → Press Enter (accepts <code>./</code>)</p>
785
- <ul>
786
- <li>doc-builder already handles this correctly</li>
787
- </ul>
788
- <p><strong>7. &quot;Want to modify these settings?&quot;</strong> → Type <code>N</code> (No)</p>
789
- <ul>
790
- <li>The default settings are configured correctly by doc-builder</li>
791
- </ul>
792
- <h3>4. Make Site Public</h3>
793
- <p>After deployment:</p>
794
- <ol>
795
- <li>Go to <a href="https://vercel.com/dashboard">Vercel Dashboard</a></li>
796
- <li>Click your project</li>
797
- <li>Go to <strong>Settings</strong> → <strong>Deployment Protection</strong></li>
798
- <li>Set <strong>Vercel Authentication</strong> to <strong>Disabled</strong></li>
799
- <li>Click <strong>Save</strong></li>
800
- </ol>
801
- <p>Your documentation is now live at <code>https://your-project.vercel.app</code>!</p>
802
- <h2>Common Windows Issues &amp; Solutions</h2>
803
- <h3>PowerShell Execution Policy Error</h3>
804
- <p><strong>Error</strong>: &quot;running scripts is disabled on this system&quot;</p>
805
- <p><strong>Solution</strong>:</p>
806
- <pre><code class="language-powershell"># Run PowerShell as Administrator
807
- Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser -Force
808
- </code></pre>
809
- <p>See detailed guide: <a href="https://dev.to/jackfd120/resolving-npm-execution-policy-error-in-powershell-a-step-by-step-guide-for-developers-32ip">Resolving npm Execution Policy Error</a></p>
810
- <h3>npm Command Not Found</h3>
811
- <p><strong>Causes</strong>:</p>
812
- <ol>
813
- <li>Node.js not installed properly</li>
814
- <li>PATH not updated</li>
815
- <li>Need to restart PowerShell</li>
816
- </ol>
817
- <p><strong>Solution</strong>:</p>
818
- <ol>
819
- <li>Reinstall Node.js using the official installer</li>
820
- <li>Ensure &quot;Add to PATH&quot; is checked during installation</li>
821
- <li>Close all PowerShell windows and open new ones</li>
822
- </ol>
823
- <h3>Git Bash Required Error</h3>
824
- <p><strong>Error</strong>: &quot;Claude Code requires Git bash&quot;</p>
825
- <p><strong>Solution</strong>:<br>Install Git for Windows from <a href="https://gitforwindows.org/">gitforwindows.org</a></p>
826
- <h3>Vercel CLI Authentication Issues</h3>
827
- <p><strong>Error</strong>: &quot;Please login to Vercel&quot;</p>
828
- <p><strong>Solution</strong>:</p>
829
- <pre><code class="language-powershell">vercel logout
830
- vercel login
831
- </code></pre>
832
- <h3>Vercel Project Naming Errors</h3>
833
- <p><strong>Error</strong>: &quot;Invalid project name&quot; or deployment fails</p>
834
- <p><strong>Common Causes</strong>:</p>
835
- <ol>
836
- <li>Project name contains uppercase letters</li>
837
- <li>Project name starts with a number</li>
838
- <li>Project name contains invalid characters</li>
839
- <li>Project name contains <code>---</code> (three hyphens)</li>
840
- </ol>
841
- <p><strong>Solution</strong>:<br>Use a valid project name following these rules:</p>
842
- <ul>
843
- <li><strong>Lowercase only</strong>: <code>my-docs</code> <i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i>, <code>My-Docs</code> <i style="font-size: 1.2em" class="ph ph-x-circle" aria-label="error"></i></li>
844
- <li><strong>Start with letter</strong>: <code>api-docs</code> <i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i>, <code>123-docs</code> <i style="font-size: 1.2em" class="ph ph-x-circle" aria-label="error"></i></li>
845
- <li><strong>Valid characters</strong>: Letters, numbers, <code>.</code>, <code>_</code>, <code>-</code></li>
846
- <li><strong>No triple hyphens</strong>: <code>my-cool-docs</code> <i style="font-size: 1.2em" class="ph ph-check-circle" aria-label="checked"></i>, <code>my---docs</code> <i style="font-size: 1.2em" class="ph ph-x-circle" aria-label="error"></i></li>
847
- </ul>
848
- <p><strong>Examples of valid names</strong>:</p>
849
- <ul>
850
- <li><code>my-documentation</code></li>
851
- <li><code>api-docs-v2</code></li>
852
- <li><code>team_handbook</code></li>
853
- <li><code>docs.myproject</code></li>
854
- </ul>
855
- <h2>Best Practices</h2>
856
- <h3>Folder Structure</h3>
857
- <pre><code>Documents/
858
- ├── my-projects/
859
- │ ├── project1-docs/
860
- │ │ ├── docs/ # Markdown files
861
- │ │ ├── html/ # Generated HTML
862
- │ │ └── doc-builder.config.js
863
- │ └── project2-docs/
864
- </code></pre>
865
- <h3>Workflow Tips</h3>
866
- <ol>
867
- <li><strong>Use Visual Studio Code</strong> - Better terminal integration</li>
868
- <li><strong>Create separate folders</strong> for each documentation project</li>
869
- <li><strong>Use @latest</strong> - Always use <code>@latest</code> to avoid npm cache issues</li>
870
- <li><strong>Regular commits</strong> - Use Git to track changes</li>
871
- </ol>
872
- <h3>Security Notes</h3>
873
- <ol>
874
- <li><strong>Run as Admin only when required</strong> - Only for PowerShell policy changes</li>
875
- <li><strong>Keep credentials secure</strong> - Don&#39;t share Claude or Vercel tokens</li>
876
- <li><strong>Use .gitignore</strong> - Exclude sensitive files from Git</li>
877
- </ol>
878
- <h2>Quick Reference Commands</h2>
879
- <h3>Daily Workflow</h3>
880
- <pre><code class="language-powershell"># 1. Create/edit content
881
- claude
882
-
883
- # 2. Build HTML
884
- doc-builder build
885
-
886
- # 3. Deploy updates
887
- doc-builder deploy --prod
888
- </code></pre>
889
- <h3>Troubleshooting Commands</h3>
890
- <pre><code class="language-powershell"># Check installations
891
- node -v
892
- npm -v
893
- git --version
894
- claude --version
895
- vercel --version
896
-
897
- # Update tools
898
- npm update -g @knowcode/doc-builder@latest
899
- npm update -g vercel@latest
900
-
901
- # Clear npm cache
902
- npm cache clean --force
903
- </code></pre>
904
- <h2>Additional Resources</h2>
905
- <h3>Official Documentation</h3>
906
- <ul>
907
- <li><a href="https://learn.microsoft.com/en-us/windows/dev-environment/javascript/nodejs-on-windows">Node.js on Windows Guide</a></li>
908
- <li><a href="https://vercel.com/docs/cli">Vercel CLI Documentation</a></li>
909
- <li><a href="https://support.anthropic.com/en/articles/11145838-using-claude-code-with-your-pro-or-max-plan">Claude Code with Pro/Max Plans</a></li>
910
- <li><a href="https://www.npmjs.com/package/@knowcode/doc-builder">@knowcode/doc-builder on npm</a></li>
911
- </ul>
912
- <h3>Troubleshooting Guides</h3>
913
- <ul>
914
- <li><a href="https://dev.to/jackfd120/resolving-npm-execution-policy-error-in-powershell-a-step-by-step-guide-for-developers-32ip">PowerShell Execution Policy</a></li>
915
- <li><a href="https://gitforwindows.org/">Git for Windows Setup</a></li>
916
- </ul>
917
- <h2>Conclusion</h2>
918
- <p>With this setup, you can create professional documentation in minutes:</p>
919
- <ol>
920
- <li><strong>Claude Code</strong> generates the content</li>
921
- <li><strong>doc-builder</strong> makes it beautiful</li>
922
- <li><strong>Vercel</strong> shares it with the world</li>
923
- </ol>
924
- <p>The initial setup takes about 30 minutes, but once configured, you can create and deploy documentation sites in under 5 minutes!</p>
925
- <hr>
926
- <p><strong>Need help?</strong> File issues at the respective project repositories or check the troubleshooting sections above.</p>
927
-
928
- </div>
929
- </main>
930
- </div>
931
-
932
- <!-- Scripts -->
933
- <script>
934
- // Pass configuration to frontend
935
- window.docBuilderConfig = {
936
- features: {
937
- showPdfDownload: true,
938
- menuDefaultOpen: false,
939
- mermaidEnhanced: true
940
- }
941
- };
942
- </script>
943
- <script src="../js/main.js"></script>
944
-
945
- </body>
946
- </html>