日常碎碎念 2021.08.22

前言

这周真的是太刺激了,为了同一个需求,从周一一直修复到周五,产品又追,设计又追,还有一大堆兼容性问题(比如折叠屏下,UI会裂开的神奇bug🤯)。终于,周五大致修复完成(理论上有一个点还是没能完全验证修复成功,不过产品那边很急,就先hold住,等排期再验证修复吧🤷‍♂️)。

本周回顾

  1. 修复Bug

摸了将近1个月的🐟之后,在8月初的时候,终于来了一个大活了。用Hippy为全民K歌APP开发一个页面,那把我激动的啊,都快睡不着觉了。但前辈的经验已经告诉我们: “期望越大,失望越大”,用Hippy写页面就是大坑。到处都是未知的坑,开发环境与线上构建的包,在真机会出现渲染差异,在双端之间一些标签的不同实现方式,又会出现各种奇奇怪怪的渲染bug。真的是能够活活把人气死。为了解决这些傻逼的Bug,足足花了我一周的时间进行调整。周五才算大致结束了战斗,开始准备发布工作。由于需求改动了APP的一级页面,所以还要跟同事协商灰度策略要怎么改,真的是裂开了😂。以前我总是以为小程序的WXML已经是💩一般的语言了,直到我遇到了Hippy,我才知道WXML是多么的好了。Hippy真的是太💩B了艹。

Thinking:

吐槽归吐槽,但是思考总结🤔还是有必要的,总结当下踩过的屎坑,才能在下一步中做出改进嘛。

  • 为什么大家都争着去做跨端框架?

这个只是我当前的所思所见形成的个人观点,是我一些认为的开发痛点。如果你有其他观点(比如这样设计会更好),欢迎在下方留言评论,进行交流。

我认为主要是以下的三个方面的原因:设计页面门槛高;不支持热更新;客户端开发需要大量人力物力时间。

第一点,写过Android客户端的朋友就知道,其实使用开发工具,没有一定的开发经验下,想要设计出一个好看的页面是很困难的。即使在当下有着Github、Gitee等开源社区的帮助,有很多前辈们已经开发了许多现成的组件。但凭借着个人的力量,想开发出称心如意的APP界面,还是苦难重重的。究其原因,我认为是语言规范导致的。开发Android界面,就像是在Java中使用Swing来开发页面一样痛苦。即使AS已经做了逻辑的抽象,但是不彻底的抽象,其实还是十分的蛋疼。我举一个例子:滚动列表。在Web开发中,开发者仅仅需要专注于页面的样式,以及事件逻辑。如何渲染的问题大部分都将会交给浏览器解决,比如现有一个超出屏幕大小的列表,浏览器会根据屏幕大小,以及内容大小,自动计算出需要滚动才能显示的区域,并且最终将内容放置在一个可滚动的容器类。我认为这种体验才是符合直觉的。而在原生代码(甚至是等下会聊到的跨端框架中),都免不了需要开发者去维护一个滚动系统。而这是一件非常痛苦的事情,作为开发者我在思考清楚样式的同时,还得花时间去维护这个滚动系统,我得在页面框架中,就定义好什么地方可以滑动,什么地方不可以。但浏览器为啥可以做到,各家厂商推出的原生语言就不能呢?解决这个不就能提高开发效率了吗?(我猜是为了性能?但是都是经过编译的代码,还会产生这种性能问题吗?)

第二点则是原生代码不支持热更新。Android和iOS两家系统为了最极致的性能,提供的都是各家底层所使用的高级语言,前者用的是Java,Kotlin,后者则是Object-c或者Swift。使用这些底层语言带来的收益是显而易见的,性能肯定是最高的,直接就可以跟底层进行数据交互,完全没有性能损失。当带来的劣势同样是显而易见的,必须编译后才能执行。在开发者阶段,重复编译,不能即时预览虽然是一个痛点,但总体而言,这是一个小事或者说是可以通过硬件的能力提升而解决的问题。通过高性能的工作站,我们最终也能实现更快的预览。在发布阶段,不能热更新的特点,对于运营和产品来说其实是一件比较痛苦的事情。在大厂实习的这段时间,无论做什么开发,只要是toC的业务。我们就必须要做数据上报的工作,及时采集数据交给数据中心进行分析研判。但是在原生开发中,如果要给页面埋点,肯定是非常慢的。每次新的活动都需要跟版本的话,一个产品一个月最多也就是发布两次。对于商业而言其实是不利的,在算法时代,不能及时掌握当下消费者的消费习惯,无疑是危险的,极有可能下一秒就被竞争对手所绞杀。

第三维护双端耗时耗力。维护双端,就意味着要多批人马来负责项目的开发。并且为了产品方向的一致性,有些时候,还必须统一时间发版,需要投入更多的开发者才能维持住高效率的开发。这也是非常烧钱的,所以开软件公司不仅仅是看赚的多,背后的投资也是巨量的。

  • 好用的地方在哪?
  1. 部分符合直觉的开发规范
  2. 还算不错的性能
  3. 即时预览
  4. 支持热更新
  • 不好用的地方在哪?
  1. 继承自原生语言的滚动容器规范
  2. 底层能力缺失
  3. 费时费力
  • 从什么方向可以改进跨端框架的问题?

Vue不能提供极致的性能,但是能提供一个差不多好的性能

上面那段话不能说是100%原话,但是就这么个意思。我感觉这句话很有道理,当下的所有开发框架,都不是银弹(万能),不能指望一个框架能解决所有问题,框架肯定会因为时代的局限性,而有部分不足。但是使用较低门槛,提供一个还算不错的结果,有一些小坑也不是不能接受的。反正框架是会发展进步的,以后在实践路上慢慢改进就好了。

首先是前两者纯技术的问题。对于前者,我认为滚动容器的实现,应该要下放到原生实现,面向Web开发者仅仅提供一个内容入口即可,将原生开发者从容器的工程难题中,解放出来,花更多的时间在样式上,能够提高更多的生产效率。另外在原生实现还有一个好处,就是可以利用底层API及时对事件做出相应,比如折叠屏的屏幕变化。在底层通过监听hook,就可以及时变更Web的root容器,而不用web过多的去干预这些底层的事件。对于后者则需要双端开发者的配合,封装出更多原生能力API,提高易用性。(小程序算是一个不错的范例了)

费时费力。看到这个词语,不知道你会不会感同身受。就是当下的双端框架都太傻了,非常难用,无论是Vue、React、uni app,在web端开发的时候还好好的,一旦打包到双端的真机上就会迸发出各种各样诡异的bug,而且由于各家有各家的实现方式,代码本身就变得很难调试,总是需要开发者耗费大量的时间在解决bug上。在我看来,这其实也不算是坏事,通过社区文化来找出其中的问题,并且及时反馈给开发者,帮助开发者及时去修正问题。现在多花一点时间来解决问题,在未来就肯定可以节约更多的开发时间。我也相信在未来肯定会有一天,跨端框架能够部分取代原生开发,并且成为主流。说回到解决方案上,以hippy为例。我认为需要建立自己的开源社区,吸引更多的开发者加入使用,鼓励开发者反馈Bug,并形成良性循环,才是未来要做的事情。小程序就是很好的例子,18年的时候,小程序刚刚起来,那时候真的是非常的难用,我甚至嗤之以鼻,认为小程序就是垃圾。但随着这几年的开源社区以及举办高校开发者大赛,让小程序逐渐有了更多的开发者,其本身也借助这些开发者的反馈正在变得越来越完善,使用体验也在变得越来越好。我认为这对于Hippy来说,是一个值得学习的范例。

  1. 深圳文和友

周末的时候,闲着没事,看到大众点评上发的,深圳文和友开业。因此屁颠屁颠的搭着地铁就去了。深圳文和友就在深圳地铁一号线的老街站附近,搭地铁去就行了,非常方便。

说实话,文和友其实哪里都差不多,广州的调性就是70-80年代的老广州,深圳就是九龙城寨的感觉,内核还是传统的商业街。但是透过复古的调性、上档次的品牌以及品牌宣传,来吸引大家来消费。对于周末休闲,情侣来说还是不错的选择,可以来逛逛,不必太唾弃。

里面有一家Top Boy(潮玩店),看到了这个1:4的雅儿贝德,真的是太太太大(好看)了吧,哧溜~。上万能的某宝一查,全球限量300套,12800一只,骨王也是12800。哭了,好想拥有啊QAQ。

正宗茶颜悦色来深圳开店了,巨多人,因此在隔壁买了这个槟榔糖就溜了,还没吃,不过感觉挺新奇的就入手了,在下周的周志中,给大家分享一下味道如何。

还看到了这个Cyberpunk的招财猫,摆这个在门口,绝对招财,那手臂可比其他家猫猫的大多了😂。

  1. 入手AirPods 2代

最近拼多多在搞百亿补贴,769有线版,一下子没忍住,就把AirPods 2代给入手了。虽然这是Apple在2019年发布的产品,但拿在手里还是秒杀身边的一众耳机产品,耳机盒非常的小巧,揣在兜里完全无感。

耳机非常的轻便,待在耳朵上几乎没有感觉,配合着iPhone流畅的动画,真的是爽到了。直接呼出Siri,语音播报,语音接听,一切都很nice。除了接力我没整明白(没法自动切换音频),其他我都很满意了。你问我为啥不买无线充电版?其实无线版并不是刚需,之前的Freebuds 3虽然配备了无线充电功能,但是由于跟P20 pro一样是Type-C口。所以充电的时候,直接插线其实更方便,使用次数也远比无线充电多。另外就是无线版,没百亿补贴就算了吧😂。至于AirPods 3代,我看过年初有dalao分析过,当时流出的照片只是工程验证样机,距离实际的小规模试产还有一段距离,最快也要9月才能开始试产,最快也要22年的第一季度才能发布,所以综合各路新闻,我还是先入手AirPods 2代玩着先吧。等以后去加拿大之后,我再入手AirPods 3代就好了。(不要掉入消费陷阱😄)

  1. 饭乎煲仔饭

月初的时候,抖音上天天在宣传这个饭乎的煲仔饭。出于好奇和29.9的低价,我就买了两个回来试试看。u1s1,煮出来真的挺好吃的。饭焦脆脆的,腊味非常的香。要是秋天来一煲,赛过活神仙啊。推荐大家买来尝尝,买两个还会送一个那个砂锅,用砂锅就好了。(美中不足的就是砂锅没有耳朵,从炉子上拿下来很麻烦😡)

  1. 鳗鱼饭

周末中午的时候还去试了一下,万象城的鳗鱼饭。(89元/set)

坐的是吧台的位置,可以看到师傅们在炙烤鳗鱼,还挺有趣的。

鳗鱼饭只有照烧一种口味,可以吃出来是新鲜烤制的,肥美多汁,很好吃,三下五除二就办完了。除此之外,店内还有卖横膈膜肉、鸡扒、鳗鱼肝烤串、芝士年糕之类的烤品。不过说实话,水准就不够广州富力海珠城负二层的好了。人家除了照烧还有白烧,还有茶泡饭、各个部位的烤串。对于个人而言,我还是感觉广州的那一家更好。


店名:四万十鳗鱼屋

地址:深南大道华润万象天地6层SL606商铺

大众点评:https://m.dianping.com/shopshare/l3hwdpPJwgdm15s8

  1. 备案完成✅ & 支持HTTP2.0

终于,普天同庆,网站的备案通过啦!!终于可以合法的在国内运营了。站点由于搬回了腾讯云,也终于支持了HTTP 2.0协议。如果你正在使用Chrome或者FireFox浏览器,加载站点的时候你已经会想不到这居然是一个Wordpress的站点,超高的加载速度,绝对匹敌静态站点。

  1. 雀巢鲨刻能

最后再跟大家分享一个小零食,鲨刻能。一定要买榛果味的,吃起来的味道就跟健达巧克力一模一样,而且还便宜,只要2块5就能买到。非常非常的好吃推荐大家入手尝试。

(花生口味别买,一般般不好吃👎)

下周计划

  1. 发布项目到外网环境
  2. 开发需求
  3. 撰写《银河系Hippy开发指北🧭》
  4. 周末回校

结尾

周一把周五代码评审的反馈,修复一下,等后端部署环境包到外网环境,就可以开始灰度测试了。充实而又刺激的实习生活,痛并快乐着,感觉还是有所收获的。兄弟姐妹们,咱们一起继续加油💪吧!

日常碎碎念 2021.08.15

前言

这周说实话其实过的很平常,没啥很特别的活动,工作日开始进入到项目的debug阶段,把一些开发流上面的坑都淌了一遍。说实话,鹅厂最傻逼👎的事情莫过于,口口👄相传的开发指南、同事永远不写注释。你TM敢信,一个内部工具,JSON低代码生成表单系统,核心模块居然能把4个class都塞到一个☝️文件里面。纯代码部分就有2000+行了,还要0注释。刚开始接到需求的时候我人都傻了,这种💩山代码真的是存在于大公司当中的。💩山都不是最绝的,TMD还不写注释,代码没注释,配置文件没注释。完全不知道怎么配置出来的,也不知道怎么改。足足花了我2天时间来梳理流程,补充了注释。(这周我又改了一次,有注释的情况下我还是没看懂,又花了半天来梳理),真的是绝绝子。启动个破环境,文档居然是过时的。开发需求的时候,启动了旧版本的SDK,导致为了实现一个需求绕了一个大圈,下周debug,还得重写,真的是操了。要不是有一个页面死活启动不了,跟另外一个同事反复确认,我都不知道启动指令是过时的。问mentor,mentor才恍然大悟,我人都震惊🤯了。

本周回顾

  1. TME游泳协会第二次活动

u1s1,游泳协会🏊真的爽,整个夏天的游泳票🎫都被它们包了。上次去的是深圳湾文体中心,这次来的是南山文体中心,从公司走过去只要20min就到了,真的是太方便了。(下班时间搭班车去别的地方真的是太痛苦了,堵得不得了)

甚至这次活动还有能量饮品🧃的赞助真的棒👍

一人一瓶(隔壁还有佳得乐,任君选择)

  1. 腾讯班车回广州

由于WXG的办公地点,在广州T.I.T创意园,鹅厂专门有腾大<->T.I.T创意园的班车,我家距离创意园距离还算近。所以这周尝试了蹭阿鹅的广深班车🚌回广州。


优势

  1. 40元一人比高铁的79.5元要便宜
  2. 上车超方便提前在小程序订票,腾大楼下刷卡上车(不用安检、不用身份证)

劣势

  1. 耗时与高铁相当由于深圳开车走广深回广州最快其实也要1h45min,所以其实耗时更高铁🚄也差不了多少时间
  2. 座位空间有点小这个可能是我的原因,我身高191cm,座位空间着实有点小,坐着不是很舒服😣

总的来说,各有优势吧,算是高铁的一种补充选择。如果恰好当天下大暴雨的话,公司班车绝对是一个非常棒的选择。(微信就是🐂🍺,能让pony专门开一条专线来回跑,好希望学成归来的时候,去WXG工作呀😂)

  1. 朋友聚会👬

朋友难得从石家庄回来放假,遂约出来聚餐逛gai。

吃了还算好吃的寿司🍣(其中有一块臭了,我人直接裂开了😂)

去了宜家逛家具🪑

宜家新出了植物肉千层面没吃到,有点可惜,下周末去恰恰看。这家宜家甚至有Cafe & bar 没在里面喝咖啡吃蛋糕🍰有点小可惜。

喝了星巴克新出的啤酒味🍺拿铁☕️

我愿称其为“格瓦斯味的拿铁”,味道就是娃哈哈格瓦斯倒在咖啡里的味道,一般般不是特别惊艳。尝鲜可以,但原味拿铁才是yyds!!

总的来说还是好好玩,好期待跟朋友的下一次聚会哭哭😭。(下次说不定又是约会去清远泡温泉了呢😄)

下周计划

  1. 项目debug & 准备发布流程
  2. 准备雅思口语
  3. 好好摸🐟
  4. 等待备案通过

结尾

继续加油,努力实习,努力复习,争取10月拿到6的雅思口语,冲冲冲!

日常碎碎念 2021.08.08

前言

备案依旧没搞好,这周的周志还是要在电脑上完成,等下周吧,估计就能把周志重新搬回去了哈哈😄。

本周回顾

  1. 发钱咯LOL

8月5日终于发钱了,又有钱交房租了😭。交完房租就一穷二白了。继续努力打工学习吧,等到学成归来之日,希望能够搞到更多钱。哈哈😄(我就一俗人,希望大家见谅)

  1. 项目开发完成

跟产品斗智斗勇了一周,终于把页面开发完成了。下周设置好入口,灰度出去就可以等发布了😆,爽。虽然自己只是在其中做的很小的贡献,但是能够做到这么个页面,我感觉还是很激动很振奋人心的。

  1. 买了一个多士炉

最近突然想吃西多士了,但是我家附近的茶餐厅感觉好破,不想在那些店里面吃,因此上万能的某宝,买了个小熊面包机来烤面包吃。

你敢信这东西包邮还只卖69元?定时回弹,烤出来也很香,真的是太赞了。

抹上黄油和花生酱,花生酱还有点甜味,活脱脱就是一个没有蛋液的西多士嘛🤷‍♂️,炒鸡好吃,白天搭配一杯咖啡的话,绝配好吧。

  1. 白嫖TME 游泳协会的游泳门票

周一的时候加了公司的游泳协会,碰巧周三有活动可以免费🆓去游泳,为了榨干福利,因此周三直接摸鱼去游泳。u1s1,深圳的游泳馆真的是太漂亮了,场地非常的干净,水质非常好。缺点的话,就是太多人了,一条25米的泳道要分成左右两列,有点痛苦。(鉴于是白嫖的,我就不care了)

下周计划

  1. 专心备战雅思口语
  2. 认真上(mo)班(🐟)

结尾

时间过的真快,实习已经过去一半了,还有一个月就要回校了。

日常碎碎念 2021.08.01

前言

上周博客到期了,于是将博客迁移回腾讯云的服务器上面,希望能够加速⏩访问速度,但目前还是没完全弄好(后面会展开说)。于是乎接下来的几篇周志,我估计都只能在本地的编辑器中书写✍️下来了(我感觉写周志,还蛮好玩的,可以把美好的时光记录下来)。

上周回顾

由于迁移博客的缘故,上周的周志被迫拖更,于是乎留到了今天来写。

1. 美食分享《墨西哥🇲🇽Taco》和《笋干炒鸡蛋》墨西哥Taco。说实话,来到深圳之后,我发现真的是满大街的Taco,广州居然没有这种美食真的是太可惜了。真的是好好吃啊!

笋干炒鸡蛋🥚。贼下饭,打算明天晚上再吃一顿。(鹅厂福利,可以凭借夜宵卷免费干饭,腾大13楼yyds)

2. 工卡免费吃包🍔

这个是我到这快半个月才知道的,居然可以到比克大厦楼下的麦当当,免费拿一个套餐,没想到麦当劳吃到吐的梦想,居然是阿鹅帮我实现的😂。1、3、5、6是个人认为最赚的,平时都得25+了,性价比最高,以后都去公司吃麦当当,不出去买了😄。


3. 人体工学椅子💺

终于,坐了半个月的椅子之后,我终于也拥有了属于自己的人体工学椅了,终于有肘部支撑了,感动😹。阿鹅还是没有把我忘记掉。(本来有个照片的,但防止被说违反保密协议,就下了。样子就是淘宝上的工学椅的样子)

2021-08-24补充:直到昨天我才知道原来这椅子还能躺下去,我😭了,我就说午睡怎么这么别扭。

4. 大闸蟹限定风味薯条

之前去MUJI Diner的时候,顺便买的一款限定口味的薯条。不过我后来发现,原来muji的小程序商城其实也有得卖,可能强调的是限时口味吧🤷‍♂️。

说实话,这个味道就是🦐味薯条,其实味道一般般,不是特别的惊艳。没必要为了所谓的“限定口味”买单,不建议大家购入。

5. 海心桥半日游

周末难得回去了广州,顺带去广州的新晋网红打卡点“弯弓射大雕”(海心桥)。

去的那天,太阳🌞贼晒,不过幸好桥上的江风,吹过来很舒服,不然就要比被晒成人干了😂。如果正在看博客的你,有空来到广州,海心桥作为广州塔附近的景点,我会非常推荐你去看一下的。(免费上桥,晚上拍夜景超级多人)

6. MagSafe 随想

去完海心桥,顺路就跑去了天环广场的Apple Store上手摸了MagSafe。这东西摸起来挺圆滑顺手的,非常有质感。可惜就是749元只能买一个充iPhone 12 2/3电的充电宝,实在是太亏了,要是349我或许还能考虑一下购入来玩玩。


本周回顾

1. 公司聚餐

周一的时候刚对完需求,准备自己一个人孤零零跑去腾大恰饭的。突然Mentor就喊住我,让我跟大部队去聚餐,我直接黑人问号❓这又搞的什么活动?听到说是部门Boss要请大家恰饭,我就屁颠屁颠的跟着去了。u1s1,阿鹅就是豪气,直接晚上来了顿海鲜宴(关键是不用AA,公司报销)实在是太爽了吧!好想留在组内工作,太幸福了😭。

2. 水淹深圳

周二的时候,深圳下大暴雨,河南又是水灾,深圳也到处都是水,真的是难受😣噢。

3. 开始写项目了😭

来活了,被拉去做一个分类的页面,而且据说还要上线到核心页面,有点震惊🤯。一上来居然就能接触到这么重要‼️的页面,真的好激动啊超兴奋的,希望能好好的完成✅任务。由于公司保密协议的原因,就不放图了,到时候发版的时候,我再截图给大家看,我做了哪一部分的页面吧哈哈😄。

4. 吃到了Shake Shack

来到深圳,怎么能够浪费周末宝贵的时间呢?因此周五的晚上,特地搭了一站地铁🚇到高新园的万象天地,整了一个Shake Shack的汉堡🍔和奶昔🥤。

卖相很棒,牛肉汁水很足,卖45一个小贵,但是是可以接受的,时不时来一个也没啥问题,如果你想尝鲜的话,可以买一个这个来尝一下。如果你问我有没有平替,我的答复是有的,假如你不care这个牌子和卖相的话,肯德基老爷爷的和牛堡味道也差不多,可以用来代替。

超甜,超浓,齁的慌,味道就是麦当劳融化了的甜筒🍦的味道。而且41一杯也太tm贵了吧,定这个价格真的是脑子🧠有洞了。要不是深圳有钱人多,来尝鲜的人多,早倒闭关张了,我估计放广州一会就凉透了。非常不推荐,还不如出门买瓶快乐水或者隔壁星巴克奈雪的茶搞点好喝的算了。

5. 宜家饭堂

周末例行,宜家饭堂见。

这次吃的是牛排,三文鱼,沙拉,虾排和雪碧。牛排在39这个价位真的是很不错了,很好吃,下次必点;三文鱼一如既往的出色,油脂的香味填满口腔,每次来都会吃;虾排很脆,而且能看到里面的虾仁,只是我个人觉得有点油,下次就不会再点了;沙拉就是普通的沙拉,配上芝麻沙拉酱很好吃,热量起飞了😅。

临走前,还恰了2元的双色冰激凌,口感很神奇。下图的雪糕看起来是很丝滑的,但是吃的时候,外面像是结冰了,吃下去是有点硬硬的感觉,但是抿一会就融化了,很奇妙,体验很赞。

还看到一个很有意思的东西,宜家的雨伞居然在晴天☀️和雨天🌧️是卖不同价格的😄。估计是为了鼓励大家环保一点,多晒晒太阳吧,营销策略真有意思。

6. 麦德龙游记

终于进到了心心念念的麦德龙了。这家商店以前老牛逼了,主要做的是toB的业务。可惜的是理念太超前了,当时国内还没有这种toB的理念,导致这家德国商超水土不服,业务在中国不咋行。最近几年可能是收到网购和盒马之类的新零售的冲击,也开始做起了toC和网络服务,总算是跟上了时代的脚步。(不过还是很破败,一次品牌大翻新才能够拯救麦德龙了)

这里分享几个我觉得有意思的点:

6.1 超市内部居然有卖汽车用的产品

比如汽油,润滑油之类的汽车用产品,这个我估计是来自德国那边的销售习惯。默认大家都是自己来维护汽车的,放在国内这种销售策略挺奇妙的。

6.2 禽肉的售卖是在一个大冷室里面的(大冰箱)

上图中,右边有三个售货员,左侧第一个售货员穿的是羽绒服。我刚开始还很好奇,为啥这么热的天还穿个羽绒服,而且卖肉还专门搞个小房间来放着。

进去了之后才知道原因,里面就是一个大冷库,估计只有4-5度的样子,穿短袖短裤进去冷到爆了🥶,我是很佩服我出来后拍的这个图片里面的男士的,这么冷还穿着短袖在里面挑肉。

不过人家超市也是有做准备的,外面挂了几件公用的羽绒服让你保暖,还挺人性化的,真的好有趣,着实是开眼界了。(还有之所以要单独搞个房子,一方面是为了保鲜,另外一方面是为了隔绝腥味,房子里面的肉腥味真的是很重,有点受不了了🤮)

6.3 香料墙

麦德龙这里居然有很多西餐的香料卖,这着实吸引到了我,以后想做西餐的时候,可以考虑到麦德龙采购几包。比如鲜罗勒,在普通市场太难买到了(我目前就知道家附近的超大型市场有的卖)。未来想做的时候就可以来麦德龙买了,太赞了吧!

最后,买了一包伊比利亚的火腿回家做宵夜。

不得不说这刀工是真的好,晶莹剔透的,都能看到肉片背后的光了。(我知道是机器切的)

说会味道的话,我只能说,88元的火腿是值得起这个价格的。吃下去的油脂香味和肉香味非常的浓郁,很好吃,配着啤酒和蜜瓜,绝配。我估计如果有白葡萄酒配着会更香。这次尝鲜买了红牌的火腿,以后有机会买黑牌的尝一下,据说是100%的散养的猪🐷做成的火腿,味道很更好吃。以后一定要试试看。也推荐给大家尝试一下,真的是很不错。

下周计划

  1. 专心备战雅思口语
  2. 认真上(mo)班(🐟)

结尾

时间过的真快,再过一周,就算是一个月了,有点舍不得了。(下周就要发工资了,好开心啊LOL)

日常碎碎念 2021.07.20

前言

时间过的飞快,转眼间7月份就过去一半了,实习第一周也就这么过去了。不知不觉间,透过《日常碎碎念》这个形式的周志,来填充博客的内容看来是非常明智的选择。毕竟技术文章的产出是需要时间的沉淀的,中间的空窗期不写点东西上来的话,很容易让自己失去继续写博客的热情🔥。通过这段时间的记录📝,除了感受到生活的苦,也能更好的发现生活中的甜。希望这个栏目能够继续延续下去,继续记录生活(即使没人来看😂)。

上周总结

  1. 完成实习中的第一个需求的开发
  2. 宜家餐厅游记
  3. 去了MUJI Diner吃了个晚饭
  4. 好物分享:《米家充电台灯》
  5. 亿本新书:《岩田先生》

1. 完成实习中的第一个需求的开发

大公司就是不一样,所有的开发流程都是十分规范的。大概流程就是: 产品经理从内部系统发需求单,部门leader分配任务,开发者接单,评估时间,完成开发,等待测试验收,体验环境测试,外网上线。

本周的主要任务是为内部的一个广告平台增加了一个小功能。任务的大致内容就是给一个表单加一个按钮而已。但万万没想到的是这个表单的生成为了解耦和方便配置,做成了JSON生成的表单系统。这些其实都是小问题,不就是编写配置文件嘛,so easy啦!如果你也是这么想的,那就掉坑里了,我也是。这东西的配置项完全没有整理文档,表单生成器一行注释都没有。不幸中的万幸就是开发者还在助理,遇到技术难题还能请教一下,要是离职了就更痛苦了。

作为实习生,总不能一上来就说做不了吧,这也太尴尬了😅。没办法,只能硬着头皮上了,慢慢翻源码打断点,慢慢理解前开发者的idea。最终还是在周五完成了✅开发任务,大概也就比原来的计划慢了一天。(其实也没这么痛苦😖,只是要费点时间而已,做是肯定能做出来的。另外腾大晚上的免费晚饭着实是成为了我奋斗💪坚实的后盾,每天解决完一个小问题后,跑去吃顿爽的,再回来开工,着实是让人放松愉悦呀😄。)

2. 宜家餐厅游记

长这么大个人,去宜家就去了两次,这周末是第二次。第一次去甚至都没机会品尝一下宜家餐厅,吃了1元的冰淇淋🍦就走了。趁这次周末有空余时间,又来到了深圳,出去逛一下。因此选定了宜家餐厅作为目的地之一。

我去的深圳宜家,位于欧洲城。从白石洲站出来,转M487公共汽车,一直搭到总站就行了,全程1.5元,可以直接刷羊城通

大致方向

别人去宜家,主要目的应该是为了购买家具🪑。我这次去宜家,主要的目的就是吃吃吃。废话不多说,直接上图。

1.香草三文鱼

整顿饭中最令人欣喜的部分,真的是好好吃啊😋。鱼肉本身就很有油脂的香味,搭配芥末酱吃,芥末的辣味更能激发出鱼本身的鲜味。再撒上旁边配的柠檬汁,酸酸的,非常的清新开胃。作为前菜而言,非常棒👍。(一楼门口的食品超市有的卖,但是考虑到晚上还要去MUJI Diner,拿着不太方便;另外秉持着”少食多滋味”的教训,还是没买下来。待到下次再来的时候,再细细品尝吧😄)

2.瑞典🇸🇪肉丸

听说这是宜家的招牌菜,于是乎就拿了一份。但说实话,就是普普通通的猪肉丸的味道,可能比较新奇的是,配了一点蓝莓🫐酱,可以蘸着吃,解解腻。凭良心讲,我是不推荐大家点这个的,不会特别惊艳。

3.肉酱意面🍝

点这个纯粹是我怕不够吃拿的。大概就是普通的番茄肉酱意面吧,没啥可圈可点的。

4.提拉米苏

这个提拉米苏貌似也是招牌点心,因此拿了一份尝一下。确实挺好吃的,有点甜,跟朗姆酒的酒味一中和,感觉非常协调。用这份甜点🍮收尾确实不错。

全餐总花费83.2元,如果不吃意大利面的话还能更便宜。另外取餐的时候看到牛扒貌似也好好吃的样子,下次可以来试试看。感觉宜家以后会成为我的一个周末消遣的好去处。

另外这次最大的一个收获,就是买了3.5元的宜家环保袋♻️,真的是好好看啊。便宜耐操值了!

3. 去了MUJI Diner吃了个晚饭

全球第一家MUJI Hotel,全球第二家MUJI Diner就位于深圳的深业上城2楼处。去到旗舰店除了吃饭,还买到了限定的小零食和杯子,好开心啊😄。

溜达了一圈,又出去Shopping Mall逛了一圈,直到下午6点才走回去吃了一顿饭。但是真的是好贵啊,想要吃日式定食,还是中午来吃吧🤷‍♂️。

首先,最近推出的58元夏日新品套餐仅限中午,晚上就只有牛扒汉堡等大菜,而且巨贵,一份和牛沙拉88元,一份植物肉汉堡78元。(虽然处于好奇心,我还是点了植物肉汉堡,但真的好痛心,毕竟这个价钱,中午已经可以吃上沙拉+主菜+甜品了)

汉堡是用黄油🧈煎过的,因此非常的酥脆。搭配植物肉的”肉香味”,非常的好吃,薯条也是新鲜脆口的,很赞。但是植物肉的口感就不敢恭维了,就跟小卖部,售价1元一包的素肉一样,没啥区别,与真正的肉饼还是有一段距离的。如果财力雄厚确实可以来试试看。

4. 好物分享:《米家充电台灯》

最近搬了新的房子,可恶的是灯只有一个开关,设置在入口处。这个设计主要是为了回到家的时候,在门口就能开灯。但最反人类的地方在于,上床前,你得走到门口,关了灯,摸黑走回床边。太弱智了吧!

因此,最近上小米商城,购入了价值99元的米家充电台灯。

4.1 优点

  1. 纯白MUJI简约风
  2. 金属材质
  3. 价格便宜
  4. 无频闪

4.2 缺点

  1. Micro USB充电头
  2. 只有三种模式,暖光亮,暖光暗,白光亮
  3. 充电提示灯不明显(如果开着灯,很难察觉到闪烁,提醒自己要充电)

4.3 使用感受

简洁大气,MUJI简约风+价格便宜,实在是一把好台灯。质感也非常棒,金属材质摸起来非常稳重。作为床头灯或者办公台灯都是非常好的选择。

5. 亿本新书:《岩田先生》

最近在稽核看到了这本新书,出于好奇买了下来。

这本书主要是写了两个部分。

首先是岩田聪的传奇一生,从札幌的天才高中程序员,到HAL研究所社长,再到任天堂社长,他是如何一步步走过来的,他的个人经历与经验中,对创意的思考。

其次是岩田聪在公司治理理念等方面的语录。

这本书我也是刚刚到货,刚刚看。以后有时间也会跟着《自制编程语言》之后,将读后感或者读书笔记分享出来。目前暂定这个读书栏目为”亿本新书”,希望能够在这个栏目上有所产出呀。

下周计划

  1. 上班摸🐟
  2. 需求转测试 做下一个开发任务
  3. 背单词
  4. 每天中午做一部分的雅思题目(当日做错题积累)

总结

周末确实是玩爽了,这周又要开始做打工人啦。加油LOL!

最近博客会迁移到腾讯云,到时候就会有HTTP2.0啦,搭配对象存储,国内的访问速度应该能更快了。

mapStateToProps 和 mapDispatchToProps的区别

背景

最近开始实习,部门主要使用的是一个内部的跨端框架,这东西本质上还是React Native,只不过是做了一层套娃重命名了标签名称(像极了ReactRouter和ReactRouter-Dom的关系),并且封装📦了自己的一堆私有的API。由于导师就是负责开发这个框架,因此很无奈只能转React,做React开发了(印证了之前的猜想)。

今天这篇文章主要就分享一下我在使用Redux过程中的一些笔记📒或者使用经验。

(本文章不会详细阐述其具体的使用方法,只是会记录一些实际应用的效果)

区别

  1. 相同点
  • 两者都是函数
  • 用于将Redux的Store映射到组件props(入口参数)上
  1. 异同点
函数名称官方描述个人理解
mapStateToProps建立一个从(外部的)state对象到(UI 组件的)props对象的映射关系将Store上的State挂载到props上 (实现了单向数据流)
mapDispatchToProps建立 UI 组件的参数到store.dispatch方法的映射将Store上的Dispatch函数挂载到(调用的时候,相当于是在触发Store上的函数)

实例

(此处引用阮一峰老师提供的“计数器”代码,作为本文章的例子,感谢阮老师的分享🙏)

初始化环境

 import React, { Component } from 'react'
 import ReactDOM from 'react-dom'
 import { createStore } from 'redux'
 import { Provider, connect } from 'react-redux'

创建计数器组件

 class Counter extends Component {
   // 创建渲染器
   render() {
     // 从入口参数上获取mapState和mapDispatch挂载的属性和方法
     const { value, onIncreaseClick } = this.props
     // 返回JSX
     return (
       <div>
         <span>{value}</span>
         <button onClick={onIncreaseClick}>Increase</button>
       </div>
    )
  }
 }

创建Action

Action说明了Redux中可以做什么动作。

 const increaseAction = { type: 'increase' }

有点类似于Java中的抽象类的概念

创建Reducer

Reducer说明了Action做什么动作。

 function counter(state = { count: 0 }, action) {
   // 读取Redux中管理的count变量
   const count = state.count
   // 检测dispatch触发了哪一个动作
   switch (action.type) {
       // 触发"增加"动作
     case 'increase':
       // 将值+1并返回一个state到Redux的Store中
       return { count: count + 1 }
     default:
       return state
  }
 }

有点类似于Java中的实现类

PS:

Action和Reducer的关系,在我看来有点类似于抽象实现的关系,不知道🤷‍♂️对不对,以后再继续深入探究一下。

创建Store

 const store = createStore(counter)

实现挂载函数

 // Redux的角度: 将Redux管理的全局State(Store)上的值挂载到了组件上
 // 组件的角度: 获取(订阅)了Redux管理的全局State(Store)上的值
 function mapStateToProps(state) {
   return {
     value: state.count
  }
 }
 ​
 // Redux的角度: 将操作全局State(Store)上的方法挂载到了组件上
 // 组件的角度: 获取了管理的全局State(Store)的方法
 function mapDispatchToProps(dispatch) {
   return {
     onIncreaseClick: () => dispatch(increaseAction)
  }
 }

挂载到组件上

 // Connected Component
 const App = connect(
   mapStateToProps,
   mapDispatchToProps
 )(Counter)

页面渲染

 ReactDOM.render(
   <Provider store={store}>
     <App />
   </Provider>,
   document.getElementById('root')
 )

流程图例

Redux与组件之间是如何传递reducer和state以及组件如何dispatch reducer的
  • 通过mapStateToProps将全局State挂载到了组件的Props上,组件因此可以直接读取到Store中管理的state值。
  • 通过mapDispatchToProps将管理全局State的方法挂载到了组件的Props上,组件就可以从入参中获取操作方法,进而在组件中dispatch(触发)State中的Reducer进而修改State中的值。

结尾

这篇文章主要是梳理了一下本周解决的一个知识点,加深自私点在脑海中的印象。文章中阐述不清楚的点,欢迎透过邮箱📮与发起讨论,希望透过讨论也能让你明白这个过程发生了什么。

延伸资料

  1. React-Redux 的用法(中文)
  2. 使用mapStateToProps导出数据(官方英文)
  3. 使用mapDispatchToProps触发Actions(官方英文)
  4. 计算器代码(Github)PS:建议可以先不看🙈这两个函数入参的描述,因为很容易把人搞晕😵,可以着重看看[1]中,阮一峰老师提供的实例,搭配[2] [3]思考🤔一下,相信你很快也能get到这个函数在干什么,有什么用🤷‍♂️。

日常碎碎念 2021.07.13

前言

期末考试完成,终于可以启程去🐧厂搬砖了。

上周总结

  1. 深圳租房
  2. 入职鹅厂
  3. 周末去深圳湾公园拍了照

1. 深圳租房

说实话,虽然来了深圳很多次了,但来深圳租房子还是第一次,也是在外租房子的第一次☝️。着实是花了不少的时间做准备,不过幸好有家人👪的帮助,最终还是顺利租下了一间房子。(虽然对比合租贵了几倍,但是优越的交通和商业便利性,绝对是物有所值的)

另外,u1s1,深圳租房是真TM贵,要不是来大厂了,真的还得倒贴钱,或者住更远的郊区去。但深圳的公共交通我认为是真的稀烂,便利程度跟妖都相比简直就是辣鸡🚮。(也有可能是因为鹅厂的写字楼太偏僻了,给我造成公共交通不方便的错觉。)

腾讯的写字楼专门建在立交桥边,根本没有什么很好的公共交通通勤,要么是搭班车,要么就只能选择骑电驴或者自行车去,再或者是走路,上下班痛苦的一批,太傻逼了。

2. 入职鹅厂

普天同庆同庆,我终于也能成为一名鹅厂人咯LOL。6月底的时候,深圳还有疫情,搞得我心神不宁的,差点就要改期去阿里了。(其实阿里也很香,家-公司通勤时间只要30min)。不过万幸的是,在政府有效率的处理+大家的努力配合,遏制住了疫情,最终我也得以来到深圳加入鹅厂,开始实习工作,希望在这几个月的实习中能够有所收获吧。

我的牛牛鹅宝

3. 深圳湾公园游记

周末搬完家之后,就出去逛一下,去了深圳湾公园。(主要是网上说有一个地铁口出来就能看到大海,所以慕名前来,虽然还是走错了😂)吹着微微的海风真的很舒服,还看到了新石器的无人车在肯德基,深圳政府真的好有钱啊,能够吸引这么多的高新企业来落地,慕了慕了。

对象就是香港元朗了🇭🇰

本周计划

  1. 上班摸🐟
  2. 学习开发规范 & 开发流程 (Hippy好难用啊🤯)
  3. 背单词 + 雅思口语准备
  4. 准备雅思考试

总结

来到鹅厂的这几天,真的是感觉非常充实,好吃的饭堂,965的工作时间,完善的人事流程&福利,都让我非常感恩,虽然不考虑转正,但希望日后从海外学成归来时,还能做企鹅人呀LOL

PS:昨天出成绩了,绩点3.75,人生巅峰啊😄,希望能够再创佳绩吧🤷‍♂️

日常碎碎念 2021.07.02

前言

u1s1,学校真的是NT,7月2日最后一门考试开卷+手机考试+线下考试。干嘛不早点考试嘛?真的是脑瘫,之前那么多空余时间,👴就是玩,就是不考试,就吊着你,不让你离校,真的是吐了🤮。白白浪费了起码一周的时间,搞得实习+学习的计划都要往后延迟,麻烦的一批。美名其曰对你好,佛了🙏。

本周总结

  1. 完成GuBlog前端页面的开发
  2. 完成Instagram Downloader快捷指令的开发
  3. 技术分享《PPG式心率测量小程序的技术分享》和《React脚手架V1.0》
  4. 期末考试结束

1.完成GuBlog前端页面的开发

下周就要去实习了,之前Leader说可以提前了解一下React Native的最佳实践。但是很可惜的是,我大学期间学习的是Vue,没办法👐,只能从头开始学习React咯🤷‍♂️。经过6月下半个月的学习,大致掌握了React和React Router的使用,因此开了这个小项目来实践一下。预估完成✅时间需要一个月,目前只是抱着做着玩的心态在编程,能做多少就做多少,不期望能够完整实现,目标只是为了熟悉一下React的脚手架搭建以及React的开发流程。

2.完成Instagram Downloader快捷指令的开发

3.技术分享《PPG式心率测量小程序的技术分享》和《React脚手架V1.0》

最近一周有空,将之前的一些项目和当前的一些新的进度做了总结分享以及技术储备,在博客上记录📝下来。希望留待以后能够用上。

4.期末考试结束

终于考完期末考试啦🥳!!LOL

终于可以在家里开始摸🐟生活了,被困在学校一个半月了,学校距离市区比较远,困了一个半月真的是无聊🥱死了。终于可以回到城区开始划水生活了,开心!

下周计划

  1. 鹅厂实习
  2. 准备雅思口语

总结

时光飞逝,转眼间2021年就过去一半了。虽然6月的突然袭来了疫情,但是靠着政府强有力的把控,还是成功的在一个月内控制住了疫情的蔓延,并最终清零,🐂🍺的不行!7月终于要迎来人生的第一次实习生活了(而且还是在从未想象过的鹅厂),希望能够顺顺利利吧。加油!

[快捷指令] Instagram下载器【已废弃】

背景

最近把Facebook的账号找回来了,上Instagram看了一下。发现有好多胶卷的照片真的好毒啊!好好看,好想下载下来做背景图。但是此时我才发现,Ins居然是不能长按照片下载的,包括网页端也是需要透过插件,解析出埋藏在DOM结构中的图片链接🔗才能下载的。这种防君子不防小人的防盗链方法真的是非常的鄙视🤬。但是能透过DOM中找到图片的链接,并且实验证明是可以直接下载的,已经属于不幸中的万幸了。(要是加上UA验证之类的就死掉☠️了)

最近我从菊花切换回了Apple,所以就可以借助快捷指令+Scriptable来帮助我自动化完成解析下载。

快捷指令链接:

https://www.icloud.com/shortcuts/ebce83c29b3b4c63b782adae6656bb80

前置要求:

  1. 安装Instagram
  2. 安装Scriptable

使用说明:

  1. 点击想要下载的图片的···
  2. 选择分享到..
  3. 选择Instagram Downloader
  4. 等待运行
  5. 返回到Instagram时则代表运行完成

注意事项⚠️:

  1. 作者如果设置了Private的话,快捷指令将无法下载图片
  2. 账号被Ban,快捷指令同样无法下载图片

React脚手架V1.0

背景

最近开始捯饬React,想着学会了React就能把React Native给学习了,然后就能写App。为了能够在React Native上少踩坑,我搭建这个脚手架之后,准备开发一个博文发布系统,作为DEMO练练手。

依赖构成

  1. React核心
  2. React-router-dom 路由
  3. Redux 状态管理
  4. ESlint 代码格式管理
  5. Vite 打包工具
  6. Axios 网络请求库
  7. Antd UI库

搭建流程

1. 初始化React

1.1 模板初始化

我们可以直接使用Vite自带的模板,初始化React,在本教程中我使用的是template指令来初始化项目。

运行以下指令初始化项目

 # npm 6.0
 npm init @vitejs/app gublog(项目名称) --template react(模板名称)
 ​
 # npm 7.0+ (需要额外的双横线)
 npm init @vitejs/app gublog(项目名称) --(额外的双横线) --template react(模板名称)

运行指令后,npm将创建一个以项目名称命名的文件夹📁,来初始化项目。

初始化完成后的文件树结构为:

 root
 └── gublog(项目名称)
    ├── dist
    ├── node_modules
    ├── src
    ├── index.html
    ├── package-lock.json
    ├── package.json
    └── vite.config.js

1.2 启动环境

  1. cd 项目文件夹
  2. npm install #下载依赖
  3. npm run dev #启动开发环境
环境启动成功

出现上图的网页时,我们就已经搭建出Vite + React的开发环境

2. 安装React-router-dom

为了能够实现无刷新切换页面,此处我的脚手架也会引入官方提供的Router来做前端路由管理。

2.1 安装依赖

运行指令安装路由组件

 npm install react-router-dom --save-dev

2.2 注意⚠️

React-Router-Dom就是React Router V4的浏览器版本,原来文档的Router要被替换成BrowserRouter才能使用。为了不使用方面,我们可以使用as关键字来修改别名。

 import 'BrowserRouter' as 'Router' from 'react-router-dom'

这里我真的很想吐槽,搞一个React-Router就好了嘛🤷‍♂️,干嘛还搞一个React-Router-Dom。这东西本质上就是套娃再封装📦。而且最近的V4版本还舍弃了旧的Router标签,改成了BrowserRouter。真的是NT。

解决方法来源:

3. 安装Redux

安装Redux主要是为了使得组件的耦合降低,使得更容易的管理状态,因此被打包到脚手架当中。

3.1 安装依赖

 npm install redux --save-dev

4. 安装ESlint

4.1 安装依赖

 npm install eslint --save-dev

5. 安装Axios网络请求库

5.1 安装依赖

 npm install axios --save-dev

6. 安装AntdUI库

AntdUI是阿里针对React设计的一个UI库,开箱即用,有丰富的文档。(而且还能改颜色)

6.1 安装依赖

 npm install redux --save-dev

6.2 引入环境

  1. main.css中添加import 'antd/dist/antd.css'导入CSS库
  2. Main.jsx的代码头部添加import {组件名称} from antd导入组件

结尾

这篇文章就此告一段落。Axios和ESlint的使用我还在摸索中,后面还会继续更新,敬请期待。目前在使用这个脚手架重写GuBlog日志程序当中,后面时机成熟后也会同新版本的脚手架文章一同推出。