掘金 人工智能 06月05日 11:54
关于我用AI10分钟做了一个网站这件事
index_new5.html
../../../zaker_core/zaker_tpl_static/wap/tpl_guoji1.html

 

作者分享了使用Hugo快速搭建个人网站的经验。通过AI辅助,作者在周末完成了网站的开发,并介绍了Hugo的优势,包括构建速度快、零依赖、内容管理灵活、主题丰富和部署方便。文章还分享了配置、调试和踩坑的经验,并展示了最终的网站成果,为读者提供了实用的建站指南。

💻 快速上手:作者选择了Hugo作为建站工具,并介绍了安装、初始化项目、选择主题和配置的基本步骤。Hugo基于Go语言,构建静态网页速度极快,适合内容量大的网站。

⚡️ Hugo的优势:Hugo构建速度快,支持实时刷新;几乎零依赖,只需一个二进制文件即可运行;内容管理灵活,支持Markdown写作和自定义页面;拥有丰富的主题生态,方便用户选择;部署特别方便,可直接部署到GitHub Pages等平台。

💡 踩坑与技巧:作者分享了配置config.toml文件、修改layouts和assets目录下的文件来实现个性化定制的方法。此外,作者还提到了调试过程中需要注意清除浏览器缓存和微信缓存,以确保页面效果正确显示。

🌐 网站展示与交流:作者展示了最终的网站地址,并鼓励读者进行交流,分享了关于部署、域名和成本的经验。

最近一直没有好好的深入数据库技术,业余时间也没闲着。

接了一个需求,用周末时间开发了一个小网站,说说心得。感谢AI, 大大补充了我的技术栈。首先问了豆包 最快最方便的建立网站使用哪种代码?

回答了好几种,各有各的优势最终选择了hugo,模板比较多,开发比较方便,本身也懂一点go 语言,后来发现go其实也用不上,hugo真的太好用!


简单写一下基本步骤

#安装 Hugosudo apt install hugo#初始化 Hugo 项目hugo new site myblog  # 生成名为 myblog 的站点目录cd myblog#选一个模板git init  # 初始化 Git 仓库git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod # 添加主题#应用模板#编辑或新建 config.yaml内容如下         baseURL: "http://localhost:1313/"          languageCode: "zh-cn"         title: "我的博客"          theme: "PaperMod"      #启动本地服务器hugo server#访问 http://localhost:1313 预览站点#构建与部署hugo  # 生成 public/ 目录#将public 目录放到租好的虚拟主即可访问

说一说 Hugo 的优势

基于 Go 语言开发,利用用户写的md文件,生成静态网页速度极快,尤其适合内容量大的网站。

本地预览时支持实时刷新,修改内容后浏览器无需手动重载即可同步更新,方便调试。

仅需一个二进制文件即可运行,无需安装 Node.js、Python 等环境,降低依赖冲突风险。

支持 Markdown 写作,通过 content 目录结构管理文章、分类和自定义页面。

可通过模板(layouts)和短代码(Shortcodes)实现复杂布局,例如插入带样式的提示框或动态图片处理。

官方主题库(Hugo Themes)提供上百种免费主题,涵盖博客、作品集、文档等场景。

主题支持一键安装:git submodule add 或直接克隆到 themes 目录,修改 config.toml 即可切换。

生成静态文件(public/ 目录)可直接部署到 GitHub Pages、Netlify 等平台,无需服务器成本。

支持多语言配置,通过不同语种的 config.toml 文件实现国际化网站。


说一说踩雷后的小tips

直接使用下载好模板的config.toml ,好多网页中显示的内容都在config.toml 中用变量的方式填写,直接更改,比如菜单栏内容,网页尾部公共内容等。

网页的布局及内容在模板根目录下的layouts 文件下

网页的风格,元素的样式在模板根目录下的assets下的scss目录下

根据需要,利用AI辅助修改对应代码,最终实现自己满意的效果

hugo 生成为静态网页,当前大部分浏览器都有缓存,调试过程中如果发现没有按预期效果来,可以清空浏览器缓存试一试,

如果有能力可以在浏览器中查看页面源码,确认改动是否已在源码中。

如果生成网页在需要在微信中打开,调试时注意清空微信的缓存,需要在设置->存储空间->缓存清理中将网页浏览插件清理


最后展示一下我的成果

网站地址 

xiaoxigua.site/

 使用模板

themes.gohugo.io/themes/roxo…

关于部署,域名,成本等可以私信我。

Fish AI Reader

Fish AI Reader

AI辅助创作,多种专业模板,深度分析,高质量内容生成。从观点提取到深度思考,FishAI为您提供全方位的创作支持。新版本引入自定义参数,让您的创作更加个性化和精准。

FishAI

FishAI

鱼阅,AI 时代的下一个智能信息助手,助你摆脱信息焦虑

联系邮箱 441953276@qq.com

相关标签

Hugo 建站 个人网站 Go语言
相关文章