C# —使用Blazor WASM和ChatGPT将您的简历转换为HTML

我的任务是借助AI的帮助将简历转化为网页。

ChatGPT中文站
Source: Pavel Danilyuk from Pexels

目录

  1. 免责声明
  2. 基本原理
  3. 简历——分解——里程碑1:复制页眉——里程碑2:复制正文——里程碑3:将HTML模板添加到Blazor中。
  4. 关键点 — 人工智能工具 — 最终考虑 — 结果

1. 免责声明

这不是一篇“10个ChatGPT提示…”或“10个能使你效率提高100倍的ChatGPT插件…”的博客文章。相反,这是一篇实用意见,涉及如何在编码时将AI工具用作橡皮鸭。

2. 理由

这是我在.NET Conf 2022之后的思考,更明确地说,是在协助.NET Conf 2022学生专区时。

观看了一些演示和被分享的想法,有一些特别引起了我的注意。Matt Soucoup向观众展示了关于Blazor WASM的演示,他创建了一个简历,通过基础知识介绍了它的运作方式。

能够创建网页是一项被低估的技能。

一个好的网站可能会带来很多价值。在极端情况下,它甚至可以挽救企业。信不信由你,即使现有的技术已经很成熟,大多数从事IT行业工作的人也无法满足这个需求。事实上,这是我在专业方面感到存在的一个差距,我打算积极改善这一点。

通过正确的使用场景和学习 Blazor 的动机,利用一些 C# 知识,集中精力提高我的 HTML 和 CSS 操作能力是很有意义的。

所以,我决定以正确的方式学习 Blazor。通过复制我在大学时期用 Canva 设计的简历,这个简历至今仍在为我服务。唯一的条件是尽可能精确地复制我拥有的所有内容,同时尽力保持样式和布局。

简历

简历本身并不是很复杂,但它确实有一些细节和古怪的自定义,可能难以用 HTML 和 CSS 复制。这些很容易将一个持续一周的努力变成几个月的工作,这意味着我需要帮助 - 这就是 ChatGPT 出现的时候。

幸运的是,ChatGPT在2022年末时已经非常火爆。老实说,这让我感到有很多动力去保持事情的流动。我感到我得到了帮助。

ChatGPT中文站

分解它

当你卡在一个问题上时,将其分解为较小的问题,再将其分解为更小的问题,直到你可以逐个解决所有小问题 ...

有了这个想法,我决定通过将简历复制分解成小问题,然后分解成更小的问题等等来处理。同时,保持所有信息在单一页面中。

  • 里程碑1:复制页眉:- 背景图片;- 水平条带带透明度;- 配置文件图片;
  • 里程碑2:复制身体:-将主题划分为两列;-节目;-定制每个部分;
  • 里程碑3:将HTML模板添加到Blazor中: - 将HTML文件移动到Blazor WASM应用程序中; - 图标和爱好; - 创建并发布应用程序的docker镜像;

里程碑1:复制标题

开始通常是最难打破的障碍。对我来说,这是ChatGPT最强的一个点之一。由于它不过多思考,并且通常为您提供最简单的入门点来开始某件事情,ChatGPT擅长让您启动项目。我记得输入了一个简单的“嗨Chat”,不久后我就有了东西可以看了。

ChatGPT中文站
Screenshot of the first interaction with ChatGPT

总结这个里程碑的目标,当我制作我的简历头部所使用的图像时,浏览网页的时间比设置它作为背景图像的实际时间更长。令人惊讶的是,我发现创建文本所在的水平条比创建用作我的个人资料图片占位符的圆形更具挑战性。

ChatGPT中文站

到三月中旬,这个里程碑已经实现了。

Meilenstein 2: Körper replizieren

这是一项挑战。这个里程碑的目标是在将两个页面的所有信息压缩成一页的同时复制主体,因此事情变得有点混乱。将正文分为两列是容易的部分。完成后,我快速从部分到部分,定义所有类型标题的一致样式,段落,颜色,字体,字体重量等等。

有时候,我清楚地知道我需要提示ChatGPT才能解除阻塞,但有时候我感觉我并不需要。总的来说,这个阶段与提示之间来回有很多,但我也有很多时候尝试使用自己的创造力来解决问题。

例如,在正文的右侧栏中,我发现使用三角形来模仿背景的白色效果更容易。对我来说,那是模仿布局最自然的方式。

ChatGPT中文站

我使用小圆点来表示我对成语的理解水平,或在每个工作环境中某种特定技能的发生率。这些小圆点能够通过使用 ChatGPT 几乎完全复制。我的唯一关注点是将它们适当地定位和上色。

ChatGPT中文站

一旦我只剩下图标和兴趣爱好部分的图片,这个里程碑就被设定为完成。

里程碑3:将HTML模板添加到Blazor中。

在这个里程碑上,ChatGPT感觉有点不对劲。随着Blazor成为一个相对较新的、快速发展的框架,而且依靠的生态系统经常发生变化,像ChatGPT这样的AI工具似乎缺乏上下文。

创建Docker镜像并不太难。我已经创建了初始模板的Docker镜像。第一个容器化应用程序镜像的版本使用NGINX良好运行。但是第二个版本带有所有自定义的HTML和CSS,确实不那么容易,我必须说。由于某种原因,我在项目的依赖项中添加了PrivateAssets="All"。这导致我在将其容器化为镜像后难以显示最新版本的应用程序内容。尽管我尽力提供上下文,但ChatGPT并没有提供任何帮助。

最终我在 Reddit 的 r/Blazor 上发布了帖子,有人帮助了我。但我花费了很多时间,试图弄清楚这是服务器问题还是部署问题。我感觉如果没有 ChatGPT 的帮助,我可能无法弄清楚。

Mublazor是我选择渲染图标的工具。它的文档非常出色,几乎没有任何疑惑,当决定使用哪个框架时。强烈建议尝试一下。

兴趣爱好很费力,主要是因为它们没有相同的尺寸,必须将它们的高度、大小和边缘精确调整到合适的位置。

这个镜像已经推送到了 Docker Hub,我会尽我所能保证它的更新。你可以在这里找到它。

4. 临界点

AI工具

  • 也许这不是探索人工智能工具潜力的最佳用例,但它确实有助于您提高和学习您所做的事情。
  • 代码自己编写是没有意义的。如果你想要控制你创造的解决方案,你必须投入时间和劳动力。
  • 如果AI工具为您完成所有工作,您很快就会被缺乏上下文环境所淹没,如果解决方案变得太大,您将慢慢但肯定地淹死于认知复杂性。
  • 为了避免这种情况,我宁愿将人工智能工具视为可以依赖的生产力提升工具,而不是当我感到懒惰时可以求助的黑魔法。
  • AI 工具可能对恶意输入有渗透性。如果你把 AI 工具视为数据摄入、数据处理和预测建模工具 - 事实上它们就是这样的 - 那么你很可能会意识到摄入有毒数据最终可能会导致有毒预测。这可能会导致非常糟糕的决策。
  • 在此项目之前生成PDF文件非常有帮助。
  • 总的来说,我通过明确我想做什么来节省时间。提示不那么模糊,回答更加客观。
  • 我用原先的两页简历使用了另一个工具ChatPDF,希望它能产生类似于我现在得到的结果,但它彻底失败了。

最终考虑

我认为目标已经达成。有很多简历存在,包含很多好的点子,但这是我的简历,我想要一个方便更新同时只需简单几次点击就能展示出自己。

最终结果

我不得不折叠部分内容,将爱好从右侧移至左侧,并删除了比我最初打算的更多信息。尽管如此,我仍坚持原有的风格和布局。

ChatGPT中文站

看起来比我预期的要好。如果你想知道,或认为它可能有用的话,下面是我与ChatGPT的完整对话记录。

2023-10-20 16:56:33 AI中文站翻译自原文