前端小趴菜终于把公众号和开发的不能再磕碜的小程序首页关联上了_获取公众号文章接口不能全量获取-优快云博客

1、开发小程序的初衷

自从开了公众号后，一直想做个菜单，做这个菜单的目的有两个：

建立一个和各位同行小伙伴们沟通的渠道，希望有机会能和志同道合的同行们多多交流，多多沟通，大家取长补短，共同成长、共同进步。
方便大家在《码农夜读》快速地找到自己需要的文档。

对于【关于】菜单的设置相对比较简单：

【关于我】点击设置为跳转到了：2025年，我要做个自我介绍，这篇文档中。
【联系作者】设置了点击时发送个人微信的二维码。
对于【知识精选】就有点难度了。

【知识精选】我是想把他做成一个文章的目录，每当有新文章发布，都能通过这个菜单的页面获取到全量且最新、最有价值的文章，所以这个菜单的页面一定是需要不定期的进行更新的。

他为什么不能做成公众号文章呢？因为公众号文章发布后不支持自由的编辑，二次编辑发布的文章很不方便，这条路不通。

2、"情定"小程序

既然无法做成公众号的普通文章，那就只能跳小程序了，跳小程序问题就又来了，不会写前端呀，之前自学过一段，当学到写css对页面进行布局，想死的心都有，太难了，捯饬半天也排不好，最终放弃了，但是这次即使有想死的心，也没有想死的胆了，最后只剩下：干，学就完了，用【大正】的话，没有白练的，干就完了。

3、硬着头皮上

微信小程序之前在AR团队时申请过，当时是好奇体验了下iPhone的陀螺仪，通过小程序的api获取了几个数据，啥也没做，但这次需要切实做点东西了：

起码得有个排版，有个文章的列表。
点击跳转到文章页。
还想做个头部banner，显着好看点。

既然要开发小程序，第一步肯定是先申请账号，参考文档：

https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/getstart.html#%E7%94%B3%E8%AF%B7%E8%B4%A6%E5%8F%B7

之前我已经申请过，所以这一步就免了，我只修改了小程序名称，做了备案以及各种认证。

就在刚刚，第一版小程序上线后，需要做个认证，如果不认证小程序就不能被搜索到，认证费用30元。

第二步，下载开发者工具，下载地址：

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

下载、安装，微信扫登录即可。

第三步那就是开发，也是最难的一步了，因为没有写过小程序，真是两眼一抹黑，不知道咋写呀，干憋肯定是憋不出来，那就只能先看文档了，看了一天，收获有限，最后找到一个官方的视频教程，看了之后对小程序开发才有了一个整体的概念，地址我贴出来：

https://developers.weixin.qq.com/community/business/doc/000c869e5c46586bd688cd6175fc0d

之后陆续又看了几个视频教程，才有点感觉，开干~~~~~~~~~~~。

首先创建项目，选择【不使用云服务】，JS-基础模板。

工程创建好后，把pages路径下的logs目录删除，index/index.wxml清空，index.wxss样式代码也清空，全部重新写，所谓的重新写基本都是按照上面视频上学的那些照猫画虎，能用的直接搬过来，没有的就【文心一言】，也顺带体验一下目前火的一塌糊涂的【deepseek】。

https://yiyan.baidu.com/
https://chat.deepseek.com/

4、第一难：banner展示

头部的banner，因为没有合适的图片，折腾好一阵子也没把它排好，没办法了，后来一想，因为这个1.0的MVP版本只是一个文章列表，还不能直接跳转，如果要看，就需要到公众号里去浏览，索性就放一个公众号的二维码，长按可以关注，这样也方便用户去浏览文章，就这一个功能折腾了一个小时，图片不知道怎么设置居中，还好最后搞定了，又加了一个长按关注的功能。

而且这里还有一个问题，小程序发布不能超过2M，静态资源大的话，就需要将资源存储到网络上，在小程序里动态加载，比如一张图5M，就需要使用对象存储，比如百度的bos，阿里的oss，上传后获取的资源链接，小程序里使用这个链接即可。

5、第二难：文章列表展示

现在公众号里一共是有40+篇文章，一股脑放到页面上，没有重点，凌乱的很，本意是想做个分类，每个小专栏只显示最新或者阅读量最多的，奈何技术能力有限，还开发不出来，只能退而求其次，所有文章都放上，分类要有，不同的分类现在只能靠颜色做个区分(又是写css)，最后是通过文字颜色以及背景色做了个区分，最开始设定的目标，勉勉强强完成第一和第三，第二个直接跳转文章页还没搞定，最终的页面这个样子：