前端与网页开发 (Frontend & Web Development)

熟练度

熟练

描述

非 CS 专业自学掌握的前端开发能力，源于对”产品审美与工程细节”的追求：

• 静态网站生成：Hexo（Node.js 博客生成器），部署到 GitHub Pages
• CSS 框架：Materialize（Google Material Design）、Matery 主题定制、自定义 CSS
• JavaScript 库熟练使用：jQuery、AOS（滚动动画）、Animate.css、Lightgallery、Masonry、APlayer、DPlayer、ECharts、TocBot、Valine/Gitalk/Gitment（评论）、CryptoJS、jQcloud、ScrollProgress、Chart.js（数据可视化）、MathJax（数学公式渲染）
• 动画/特效：Sakura.js（樱花飘落）、Fireworks.js（鼠标烟花）、雪花飘落动画
• 单文件交互式工具：HTML + CSS + Vanilla JS + Chart.js 一个文件打包，GitHub Pages 一键发布——最小化维护成本的个人工具部署形态
• 响应式布局：CSS Grid auto-fit, minmax() 自适应、媒体查询（@media print 支持打印）
• 跨站样式复用：CSS 引用远端主站 URL 保持视觉统一（见 ）
• 部署与 SEO：GitHub Pages、百度和 Google 双重 SEO（sitemap、robots.txt、site verification）
• CDN：Cloudinary 静态资产托管、jsdelivr CDN 引入库

在哪些经历中用到

• （https://jobsstroustrup.github.io/）：本科期间自主搭建的博客+作品集，2020.09-2021.04 发布 33 篇博文，22+ 前端库集成
• （2025 秋）：Berkeley CS180 作品集站，复用主站样式 + MathJax + 响应式 grid + print-only CSS
• （2025-06）：单文件交互式决策工具，Chart.js + Vanilla JS + GitHub Pages
• Cat Clicker app（2024-11）：Zhenyu 发布的移动 app（App Store / Google Play），延伸到移动端的”有想法 → 写代码 → 过审 → 发布”全链路；GitHub Pages 仅托管 privacy policy，详见 source 页

---