exPM, now UI/UX, currently learning Frontend.

2022 年 2022年其实我并没有“躺平”，也无法躺平。无论是工作还是生活，经常都是处于一种忙碌的状态。 疫情 被疫情反复折腾的一年，上半年经历了上海严峻的封控措施，一个人艰难的度过了 3 个月，每天只能通过视频和老婆孩子聊天，每天都期盼着什么时候能够解封回家。 解封后更折腾了，几乎每个星期的周五都会赶最后一班高铁回家，这导致我周五、周六、周日、周一必须连续做 4 天核酸。不是抱怨，只是为了能够回家和家人团聚，当然要做。 疫情 3 年，今年终于结束了。虽然结束了，但还是受到了很大的影响。每天出门依然需要佩戴口罩，企业的经济效益也持续低迷，经常还会担心家人再次受到病毒的伤害，直到现在仍然能感受到身边很多人还没有完全恢复。 家庭 虽然 2022 年过的很辛苦，但也是幸运的一年，庆幸自己和家人都平安的度过了这一年，身边的长辈还没有因为疫情离开的，挺好。 今年和老婆的感情是升温向上的，相处和睦，彼此关心照顾。而我们家，也即将迎来一位新的成员，我们的兔宝宝预计将于 2023 年 7 月和我们见面，充满了期待。 消费 2022年的消费支出有点高，虽然我没有记账的习惯和时间，但是在整理下面的支出时，能感觉到花费了不少，有一些确实是非必要的 😂 最近已经开始消费降级了，尤其是身为 2 个孩子的爸爸后，感觉压力更大了，得把这种压力转化为动力。 工作 今年忙了 7 个月 GOV 项目，最终竟然意外流标了。期间，甲方主要负责人一直在参与项目，从产品到设计到研发，几乎每个星期都一起开会讨论（疫情封控期间线上会议）。本以为可以顺利竞标的，毕竟甲方的负责人也是项目的核心人员，由他起草的项目方案书几百页，方案涉及的理论知识非常专业。可能中标的那家拿捏到了更大的 Leader 吧，很难说清楚。 一个 GOV 的项目，经费、后期的维护以及人脉资源，其实都非常大。丢了一块大蛋糕就算了，还浪费了我们很大的人力成本，老板为此也很生气，但没办法，这个项目以后也只能以其他方式继续运作卖给他方。 学习 年底这段时间，我经常督促自己抽时间学习 Javascript，期望能够通过学习提升自己的前端能力。2023 年的重点也将放在学习前端的知识上，现在的计划是先看完 Codecademy 上的一些免费练习课程，然后再接着学习三木的 Javascript 收费课程，接着开始设计一套页面并尝试开发出来。 躺平 今年其实有一处躺平的地方，在 “Crypto” 。今年几乎没有做什么操作，只是加了几次仓，目前还是处于亏损 70% - 80% 左右的状态。只能躺平，等待这轮熊市慢慢的过去。近期行情稍微有那么一点点的起色，也不知道是不是假象，反正依然坚持躺平的策略。 拍照 今年也曾在一个固定机位，拍摄了几十张美丽的晚霞。 按ESC关闭窗口 还给女儿拍了很多好玩的照片，节选几张： 2023 年 希望家人能够健康平安。 印象深刻的一些电影/电视 名称 类型 短评 短剧开始啦 电视剧 一部很感人的日剧，笑着笑着就哭了。看完这部剧，你会想谢谢身边的朋友，并更加珍惜友情。 风骚律师 电视剧 我最爱的美剧 Top1，剧情、台词、摄影镜头、服装都堪称教科书级别的。看完这部剧像是阔别了一位老友，怅然若失的感觉，一个时代的落幕了。 怪奇物语 电视剧 怀着激动的心情迎来了第四季，孩子们都已经长大成人了，这一季多线剧情杀疯了，越看越爽。 黑暗荣耀 电视剧 上周刚刚看完，一部剧情紧凑的爽剧，乔妹依然颜值在线，演技也很不错。 阿凡达·水之道 电影 其实看之前已经听说剧情一般，不过在大银幕极质的视听享受下，潘多拉星球真的美翻了，每一帧都值得品味。 坠落 电影 评分虽然不是很高，但是，恐高的我心惊胆战的看完了，生理上的感受过于刺激。 看了些设计书 名称 打分 进度 Practical-UI ★★★★★ 已读完 Refactoring UI ★★★★★ 进行中 The UI Design Manual ★★★★☆ 进行中 Masteruibook ★★★★☆ 已读完 Web Interface Handbook ★★★☆☆ 进行中 UI/UX Design Money - 未读 The Ultimate Guide to Web Design - 未读 今年陆陆续续买了不少设计书籍，这些书籍其实大同小异，大部分围绕设计和用户体验提供一些合理的建议。推荐看看 Practical-UI 和 Refactoring UI。...

相册效果如下： 按ESC关闭窗口 Github仓库地址: https://github.com/liwenyip/hugo-easy-gallery 按教程操作后,需要注意在文章中引用时,按下面的类似格式 (需去掉下方所有的 \ ): {{\< load-photoswipe >}} {{\< gallery >}} {{\< figure link="docs/hugo-easy-gallery/image1.jpg" >}} {{\< figure link="docs/hugo-easy-gallery/image2.jpg" >}} {{\< figure link="docs/hugo-easy-gallery/image3.jpg" >}} {{\< /gallery >}} 并对 CSS 样式进行了微调,修改根目录 /assets/css/core/reset.css,加入以下代码: /* 相册弹窗中的样式调整 */ .gallery { overflow: hidden; margin: 0 auto !important; max-width: 790px !important; } .pswp__item { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; background-color: #000000 !important; } .pswp img { max-width: none; /* max-height: 85vh; */ } ....

参考：Hugo 添加相册页面：：木木木木木，本文仅用于备份折腾的记录。 文件目录结构： 其中 photos.html代码如下，调整了部分CSS： {{- define "main" }} <header class="page-header"> <h1>{{ .Title }}</h1> </header> <style> .main {max-width: 1008px !important;} .page-photos{width:100% !important;overflow:hidden; position:relative;} .page-photo{width:24.9%;position: relative;visibility: hidden;} .page-photo.visible{visibility: visible;animation: fadeIn 2s;} .page-photo img{display: block;width:100%;border-radius:0;padding:0px;} .page-photo span.photo-title,.page-photo span.photo-time{background: rgba(0, 0, 0, 0.3);padding:0px 8px;font-size:0.8rem;color: #ffffffb8;} .page-photo span.photo-title{position:absolute;bottom:0px;left:0px;} .page-photo span.photo-time{position:absolute;top:0px;left:0px;font-size:0.8rem;} @media screen and (max-width: 1280px) { .page-photo{width:33.3%;} } @media screen and (max-width: 860px) { .page-photo{width:49.9%;} } @media (max-width: 683px){ .photo-time{display: none;} .page-photos{margin-top:4px;} } @keyframes fadeIn{ 0% {opacity: 0;} 100% {opacity: 1;} } </style> <section> <div class="page-photos"> {{ range (sort (readDir "/static/photos/") "Name" "desc")}} {{ if (findRE "^[0-9 -]+(....

增加空格之神 使用空格之神的浏览器插件很久了，真的是阅读强迫症患者的福音，空格之神项目地址 在 Hugo的 themes/PaperModX/layouts/_default/baseof.html 内增加以下代码： <script src="https://cdnjs.cloudflare.com/ajax/libs/pangu/4.0.7/pangu.min.js"></script> <script> pangu.spacingPage(); </script> 用完后感觉整个世界都清爽了 🤣 增加 Waline 评论 依照官网的教程，部署到 Vercel上，适配了 Hugo 的暗黑模式。 最新的配置文件在：UNPKG - @waline/client 在 themes/PaperModX/layouts/partials/comments.html 里添加以下代码： <head> <link rel="stylesheet" type="text/css" href="https://unpkg.com/@waline/[email protected]/dist/waline.css"> <link rel="stylesheet" type="text/css" href="https://unpkg.com/@waline/[email protected]/dist/waline-meta.css"> </head> <body> <!-- ... --> <div id="waline"></div> <script type="module"> import { init } from 'https://unpkg.com/@waline/[email protected]/dist/waline.mjs'; init({ el: '#waline', lang: 'zh-CN', reaction: true, // 开启反应 serverURL: 'https://chat.wananaiko.design', dark: 'body.dark', copyright: false, // 设置 emoji 为贴吧与哔哩哔哩 emoji: [ '//cdn....

最近在 iterm2 里使用 curl、wget、brew、git 等命令时，经常会遇到相应很慢的情况，只能慢慢的等待，网上查了查资料，可以通过以下方法实现。 修改 ~/.zshrc，并加入以下内容： export proxy_host=127.0.0.1 export proxy_port=8888//自定义梯子端口 export switch_proxy=0 export cdc_in=0 function pp(){ if [ $switch_proxy = 0 ]; then export http_proxy="$proxy_host:$proxy_port" export https_proxy="$proxy_host:$proxy_port" export ftp_proxy="$proxy_host:$proxy_port" export GOPROXY="$proxy_host:$Proxy_port" switch_proxy=l echo -e "梯子模式" else unset http_proxy unset https_proxy unset ftp_proxy unset GOPROXY switch_proxy=0 echo -e "和谐模式" fi } 保存后退出，打开 iterm2，输入pp即可在梯子模式和和谐模式之间切换。 参考：让 iTerm2 实时显示梯子状态 ，还有另外两种方法。

聊一聊 macOS 的一些软件使用心得，希望能够对其他人有所帮助。 提升效率 Setapp：参加了别人的家庭计划，属于团购车，年费 285。感觉还是很划算的，可以省去你单独买一些软件授权的费用，减少折腾。 BetterZip：解压工具。Setapp 内下载。 One Switch：菜单栏快捷工具，主要用来防止电脑休眠。Setapp 内下载。 Raycast：快捷启动工具，提供了一些多应用拓展支持，对开发比较友好。目前已经代替 utools 使用，类似的还有 Alfred，本地化不如 utools，不过历史剪切板、清理垃圾箱，快捷启动等常用功能已经基本满足使用了。 Mosaic：窗口管理工具。Setapp 内下载。 Dropzone：主要用来自动整理文件，大部分文件的存储都是保存在了 Download 目录下，有公司文件、素材文件、安装软件等等乱七八糟的，时间一长就会导致下载目录很混乱，用这个来移动整理文件很方便。Setapp 内下载。 PixelSnap 和 CleanShot X：前者用标尺来大概量个尺寸，后者是截图工具，有联动。Cleanshot X 真的好用，可以云端上传截图后自动获取链接，还支持 OCR 识别，图片编辑等。Setapp 内下载。 NetNewsWire：RSS 阅读器，我把它定义为效率工具，最大的痛点是可以订阅 Twitter 用户的内容，结合 RSSHub 使用有奇效，除了订阅常见的新闻资讯网站、博客，还能订阅 Bilibili、Telegram 频道等。作为我日常主要的信息输入入口之一，不需要频繁打开很多网站去查阅。已放弃 NetNewsWire 改用 Reeder，配合 iOS 端的 Reeder，更方便好用。 Popclip：划词扩展工具，可以划词快捷复制粘贴、打开链接、搜索、翻译等。Setapp 内下载。 ARC 浏览器：交互很酷又很实用的先进浏览器，我也将它定义为效率工具，通过 Space 空间划分了工作、生活、设计、摄影几个空间，每个空间浏览不同的页面。可以看看少数派网站上关于它的介绍。目前需要邀请注册，可联系我邀请，被邀请后需要等待一段时间才能收到官方邀请。 Canary Mail：邮箱管理工具，因为经常会用 Gmail 去注册一些网站，Gmail 也是我的主要邮箱，可以用起来一键打开大部分网站的退订邮件网页，方便退订邮件。Setapp 内下载。 MenubarX：菜单栏网页拓展，结合在线翻译网页，可以当成一个简单的菜单栏翻译工具，比如火山翻译和 DeepL 翻译。Setapp 内下载。 Rime 输入法：一直在用的输入法工具，定制化输入法，我自己是觉得很好用的。推荐结合 1 个设置和 1 个词库，一起使用。主要配置文件推荐这个：ssnhd 的配置，再结合这里的 Dict 词库文件。官网下载。...

YC 前总裁、现 OpenAI CEO Sam Altman 的这篇标题简单粗暴的 How To Be Successful 推荐去看全文，虽然标题很鸡血，但其中的一些观点也很有启发性。 翻译整理：@南小北 1 另外，这篇文章写的也挺不错，可以扩展阅读2。 在一个几乎没有人采取真正长远眼光的世界里，市场会丰厚回报那些这样做的人。 自信心是非常强大的，我认识的最成功的人几乎相信自己到了错觉的地步。 自信必须与自我意识相平衡，我曾经讨厌任何形式的批评并积极避免，现在我总是试着假设它是真的，然后决定是否要采取行动。 找到简单、快速的方法，在现实世界中测试这些想法。 “我会失败很多次，但我会真正成功一次”，你必须给自己很多机会才能获得幸运。 我的另一个重要销售技巧是，在重要的时候亲自出现。 大多数人高估风险而低估回报，冒险很重要，因为不可能一直都是对的，你必须尝试很多事情，并随着了解的更多而迅速调整。 你可以跟随你的直觉，花时间做一些可能真的很有趣的事情。 尽可能长时间地保持廉价和灵活的生活是一种有效的方法，但显然需要权衡取舍。 做正确的事比工作好几个小时重要得多，大多数人将大部分时间浪费在无关紧要的事情上。 一旦你弄清楚了该做什么，就势不可挡地快速完成其中一小部分优先事项。 你必须弄清楚如何努力工作而不精疲力尽，几乎总能奏效的一个方法是，找到你喜欢花很多时间在一起的人一起做的工作。 事实上，工作耐力似乎是长期成功的最大因素之一。 如果你在一个重要问题上取得进展，就会有源源不断的人帮助你，让自己变得更有野心，不要害怕从事真正想从事的工作。 跟随你的好奇心，对你来说令人兴奋的事情，对其他人来说往往也会令人兴奋。 一个很大的秘密是，你可以以惊人的比例让世界屈服于你的意志 —— 大多数人甚至不去尝试，只是接受事情本来的样子。 人们拥有使事情发生的巨大能力，自我怀疑、过早放弃、不够努力的结合使大多数人无法发挥他们的潜力。 设法生存足够长的时间，好运将如愿以偿。 要任性，就必须乐观。这可通过实践提升，我从未见过一个非常成功的悲观者。 伟大的工作需要团队，建立一个有才华的网络（紧密或松散）是伟大事业的重要组成部分，建立网络的有效方法是尽可能多地帮助人们。 每个人在某件事情上都会比其他人做得更好，用你的长处定义自己，而不是你的弱点。 最简单的学习方法就是结识很多人，并记录谁给你留下了深刻印象，谁没有。请记住，不要高估经验或当前成就。 我小时候最大的误解是以为人们靠高薪致富，尽管有一些例外（例如艺人），但在福布斯榜单历史上，几乎没有人拿过薪水。 让事物快速增值的最佳方法是大规模生产人们想要的东西。 大多人靠外部驱动，他们做事是想给别人留下深刻印象，这很糟糕。 你会非常在意他人是否认为你在做正确的事，你会非常专注于跟上他人的脚步，这会阻止你做真正有趣的事。 我认识的最成功的人主要靠内部驱动，他们所做的事是为了给自己留下深刻印象，因为他们觉得有必要让世界发生一些事情。 这就是为何动机如此重要，这是我试图了解他人的第一件事，正确动机很难定义，但看到时你就会知道。 在你不痴迷的任何事情上都很难取得巨大成功。 机会分配如此不均，显然是令人难以置信的耻辱和浪费，但我亲眼目睹很多人一出生就面临糟糕筹码，却取得难以置信的成功，从而知道这是可能的。 How To Be Successful → 30 条 ↩︎ YC前掌门人Sam Altman：观察成千上万创业者后，关于如何获得非凡成就的13条思考 ↩︎

Hugo 部署到 Vercel 最近考虑把 Wordpress 博客换到 Hugo，一番折腾之后，通过 Github+Vercel 的方式实现了自动部署，还挺方便的，以后只需要在本地编写 Markdown 文件并发布到 Github 就可以了。以 macOS 下为例： 登陆 GitHub，新建一个 GitHub pages，名为 username.github.io。 使用 GitHub 登陆 Vercel，Import 刚才新建的 pages。 Vercel 里的 Project Name 随便写，Build & Development Settings 选择 Hugo，Hugo 的 Version 填写最新的版本号，其他默认，最后提交。 把 Github pages 仓库克隆到本地，比如我这里为：/Users/aiko/wananaiko.github.io，终端里打开该目录后。输入 Hugo server 验证是否可以正常启动。 如果你想要安装和本站一样的主题，可以参考这篇文章：Installation | Update | PaperModX 其他参考文章： hugo自动部署到vercel 如何使用 Hugo 进行个人博客搭建 将 Memos 作为单页添加到 Hugo 中 方法参考了文章 向Hugo中添加静态单页面Static-Single 建议将 config.toml 里的 EnableInstantClick设置为 false，避免 memos 内容偶尔出现不加载的情况。...