９９３５

上个月写过一篇《响应式设计通过 padding 实现固定比例展示图片》的文章，使用占位图解决了当图片尺寸不同情况下，如何在响应式设计下做统一展示。

今天看到有网友在那篇文章下面留言说，通过 padding 也可以解决这问题，其实之前前同事也在朋友圈和我说过，我突然意识到我可能错过了什么，于是连忙查了相关资料，发现确实是个不错的思路，所以这篇文章就记录一下这个解决方法。

说来惭愧，对于 Flex 的了解都是碰到需求时，然后临时百度找现成的，一直没系统的学习过 Flex ，趁周末没什么事，抽了几小时学习并整理了这篇入门文档，方便自己以后快速查阅。

在做响应式页面的时候，有时候会遇到这样的情况，比如一个商品列表页，商品图的宽高比是 1:1 ，也就是正方形，但接口提供的数据里，图片的尺寸、比例均不统一，有的是 200*200 ，有的是 220*200 ，有的又是 180*200 ，面对这种情况，前端有什么样的应对方法呢？

当 Atom 的扩展越装越多，配置也越来越偏离了系统默认设置时，一旦电脑重装后需要复原开发环境，这将是一件比较头疼的事。

今天就推荐一个扩展，可以解决这一问题，那就是 Sync-settings ，根据扩展介绍“ Synchronize settings, keymaps, user styles, init script, snippets and installed packages across Atom instances. ”，简言之就是可以同步 Atom 的设置文件、自定义快捷键、用户风格、初始化脚本及代码片段，还支持已安装的插件同步。

嘘 ~ 安静，开始了。

为了充分享受到 100M 带宽的效果，准备给家里换台路由器，在做了充足的功课后，决定购买网件的 R7000 ，而且也是看中了可以刷梅林改版固件，可以让路由器的可玩性更高。那是怎么样的可玩呢？今天我就通过 R7000 成功开启了科学上网(翻墙)。

因为网上的教程和我实际操作中有一点点差异，所以下面的内容主要是记录下我个人的配置流程。

移动端列表页一般会采用滚动加载的方式，也就是滚动到靠近页面底部，自从触发加载下一页数据，整个过程通过 ajax 实现。但这也就出现了一个问题，比如当用户滚动到第三页，点击列表某一项进入详情页，这时候再返回列表页，会发现列表也数据被重置回第一页了，用户又得继续滑动才能回到之前浏览的历史位置。

这样的用户体验肯定是很糟糕的，那是否有合适的解决方案呢？

APP 离不开一个功能，那就是更新，一般我们会选择去应用市场里统一更新，但 APP 如果本身带有检查更新并升级的功能，那就再好不过了。接下来我就拿一个实际的例子介绍下，我是如何做更新功能的。

做开发时，有些编译生成的代码我们希望不提交到 git 上，这时候就要使用 .gitignore 对文件/文件夹进行忽略，但有时候会碰到个棘手的问题，就是之前已经正常提交到 git 上的文件，即使在 .gitignore 进行了忽略，但代码仓库里依旧还是存在。

在 PC 端，因为有电脑屏幕或者显示器，展示区域足够大，可以在页面顶部或者左侧放一个导航列表，导航可以是一个复杂的多层级导航。但移动端受限于手机屏幕，无法把如此复杂的导航始终放在手机屏幕上的某个位置，更多时候我们需要通过前进后退去进入不同的模块页面。

在这样场景前提下，开发过场中，我发现了几个移动端页面前进后退的问题，当然也可以算是小技巧，特此记录一下。