Service professionnel

Comment j'ai construit un site multilingue avec Claude Code

反馈:使用 Claude Code 构建 6 种语言的 Hugo 网站。人工智能使什么成为可能——以及它不能取代什么。

上下文

我是锡永 CHUV 的一名学徒数字业务开发人员。我的工作是了解业务需求并找到合适的技术解决方案。无需每天在 IDE 中编码 8 小时。

当我想创建我的作品集网站时,我有两个选择:WordPress 模板或真正量身定制的模板。我拿了第二个,克劳德·科德(Claude Code)作为技术合作伙伴。

这篇文章最重要的一点可以用一句话来概括:如果没有我的计算机技能,它永远不会成功。

在接触 AI 之前我必须掌握什么

在询问克劳德·科德任何问题之前,我花了几个月的时间自我训练:

  • DNS 和域名:了解 davidmerki.ch 如何指向服务器、A 记录、CNAME、传播
  • 网络托管:CloudPanel、SSH、SCP、文件权限、SSL 证书
  • 安全性:HTTPS、安全标头、注入保护、OWASP 最佳实践
  • 数据保护:LPD(瑞士法律)和欧洲 RGPD,以及这对联系表单、分析 cookie 或日历的具体含义
  • Web 架构:静态和动态站点之间的区别,为什么 Hugo,构建、部署如何工作

如果没有这些基础知识,我可能会要求 Claude 生成技术上完美的代码,但仍然会发布一个不安全、不合规或无法维护的网站。

为什么 Hugo + 克劳德代码

Hugo 是一个超快的静态站点生成器。没有数据库,没有复杂的 PHP 服务器,加载时间几乎是即时的。另一方面,如果您不了解 Go 模板,学习曲线会很陡峭。

克劳德·科德帮助我克服了这个困难。我的workflow如下所示:

1.我用法语,用我自己的话描述想要的结果 2.Claude分析现有代码并提出一种方法 3. 我验证该方法,因为我了解架构 4.Claude实现完整代码 5. 我测试并验证一切是否正确:安全性、可访问性、性能 6.我们迭代直到干净为止

第3步是关键。如果我不明白克劳德向我提供的东西,我就无法验证它。这就是大多数人出错的地方。

6 种语言,包括 2 RTL

该网站支持 6 种语言:法语、德语、阿拉伯语、俄语、中文和希伯来语。阿拉伯语和希伯来语是从右向左(RTL)书写的,这破坏了整个布局。

对于翻译,我与 Claude 一起创建了一个 Python 脚本,该脚本读取法语源 Markdown,保留 YAML 前面的内容和 HTML,通过 API DeepL 进行翻译(使用 Google 翻译成浮雕)并保护包含 52 个术语的词汇表,主要是专有名称和缩写词。

结果:~57 个自动翻译的 Markdown 文件。但同样,我必须了解 API、配额、后备和 Hugo 的 i18n 系统如何使所有内容正确组合在一起。

预订系统

最大的部分是集成到静态站点中的完整预订系统。

  • 带逐月导航的交互式日历
  • 30 分钟时段,周一至周五,上午 9 点至晚上 7 点
  • 与我的日历Outlook同步(ICS + RRULE 分析)
  • 实时验证表格
  • 约 900 行 JavaScript

Claude Code 生成了所有内容,包括 PHP 后端。但我必须配置 CORS、使用令牌保护端点、在 CloudPanel 上部署 PHP 并检查 ICS 分析是否正确处理瑞士时区。

数字

公制 价值
文件总数 〜420
模板 HTML 91
组件(部分) 23
语言​​ 6
JS线路(预订) 〜900
构建时间 Hugo ~14 秒

我使用的工具

我毫不掩饰这一点:我每天都使用人工智能。主要是两个工具:

  • Claude(Anthropic)负责我所有的技术项目。 Claude 在 CLI 中使用代码进行开发,Claude 在对话中进行反思和架构。这是我的主要工具。
  • Euria 其余部分:写作、研究、日常问题。它是欧洲的人工智能,尊重数据的优点。

每个工具都有其优点。我没有盲目的忠诚,我会根据情况采取最有效的措施。

我会采取什么不同的做法

  1. 从移动端开始。我先设计了桌面,然后进行了适配;相反的做法会更有效。 2.限制动画。 12 个模块太多了。四五个精心挑选的就足够了。
  2. 从一开始就构建翻译结构。我后来添加了语言,这产生了错误。
  3. 从第一天开始设置 CLAUDE.md。这个 Claude Code 的配置文件改变了一切。

真正的信息

人工智能极大地加速了技术工作。不再需要花费大量时间进行文档、Stack Overflow 和语法调试。这是一个很棒的工具。

但它并不能取代理解。人工智能没有意识或概览。她不知道您的 SSL 证书将在 3 天后过期,您的联系表单不符合 LPD,或者您的主机没有备份。

您需要一个了解其背后的计算机科学的人。一个能够在必要时深入细节、好奇、想要了解“为什么”而不仅仅是“如何”的人。

作为数字业务开发人员,这就是我的工作:保持全局,同时在必要时深入研究技术。


您正在寻找既懂业务又懂技术的人吗? 预约免费咨询 进行讨论。

Mes autres services

D'autres services qui pourraient vous intéresser