第7期 — 2019-06-16

在浏览器中阅读

周e信

Node.js

八千星最潮的全栈技术项目-React,ApolloGraphQL,Node,Mongo,Typescript-背后开源的辛酸原因🔗

最近很热火的话题,团队辛苦开发的项目,居然客户跳票收不到钱。作者只好自我安慰,至少现在有了一个很潮的全栈开发项目模板。

React,ApolloGraphQL,Node,Mongo,Typescript 这技术组合,确实潮,马上收获星星无数。

感谢这些人,祝他们招财进宝!

Jason Werner

nodejs 包分类图书馆🔗

分门别类 nodejs 众多 package 集合,找需要的库?到这里来!

Sindre Sorhus

简单易用的express 文件上传中间件🔗
<input name="foo" type="file" />
app.post('/upload', function(req, res) {
  console.log(req.files.foo);
});

Ka

Promise 使用汇总🔗

Promise.all (ES2015)

返回所有结果的集合数组,如果有一项失败则短路报错。

const promises = [
  fetch('/component-a.css'),
  fetch('/component-b.css'),
  fetch('/component-c.css')
];
try {
  const styleResponses = await Promise.all(promises);
  enableStyles(styleResponses);
  renderNewUi();
} catch (reason) {
  displayError(reason);
}

Promise.race (ES2015)

第一个成功或失败的会作为最终成功或失败的结果,其他短路。

try {
  const result = await Promise.race([
    performHeavyComputation(),
    rejectAfterTimeout(2000)
  ]);
  renderResult(result);
} catch (error) {
  renderError(error);
}

Promise.allSettled (提议状态)

等待全部完成,无论每个是成功还是失败都不会短路。

返回结果是原来的 Promise 数组,只不过更新了状态(.status)。由与这种处理方式,不会抛异常。

const promises = [
  fetch('/api-call-1'),
  fetch('/api-call-2'),
  fetch('/api-call-3')
];
// Imagine some of these requests fail, and some succeed.

await Promise.allSettled(promises);
// All API calls have finished (either failed or succeeded).
removeLoadingIndicator();

Promise.any (提议状态)

任何一个成功了即短路返回此成功结果,仅当所有都失败了才抛异常。

const promises = [
  fetch('/endpoint-a').then(() => 'a'),
  fetch('/endpoint-b').then(() => 'b'),
  fetch('/endpoint-c').then(() => 'c')
];
try {
  const first = await Promise.any(promises);
  // Any of the promises was fulfilled.
  console.log(first);
  // → e.g. 'b'
} catch (error) {
  // All of the promises were rejected.
  console.log(error);
}

Mathias Bynens

前端

react-spring-弹簧动画🔗

依据 react-motion 作者 Cheng Lou 的演讲观点,>95%以上的动画特效使用 spring 即可达到可用的效果,以往那种时间间隔和曲线的动画理念生硬又复杂。

Ka

不想用 react 和 vue? 试试 HTML5 Boilerplate🔗

如果你不想使用 react,vue 等框架,手写 html,那么总得要个模板吧。 你不至于一行行写浏览器版本查询,css 媒体查询,IE bug polyfills 吧。

所以这种情况下应该使用 HTML5 Boilerplate。

HTML5 Boilerplate 是很早的项目,是 html 项目模板。 内置了 html,css,js 许多经验,最佳实践的总结。 此项目依然保持更新。对于更早得浏览器支持,可用之前的版本 HTML5 Boilerplate v6 (IE9/IE10) 或者 HTML5 Boilerplate v5 (IE 8)

本项目使用 jquery。

H5BP

组件管理工具-bit🔗

bit 是开源的专注于解决前端组件可重用可维护问题的 nodejs 工具。

这里组件(component)可以是任何可重用的 nodejs 代码片段,然而更多的指的是可以重用的前端组件。例子们

bit 通过提供命令行工具来添加管理共享组件。

Ka

使用text参数优化谷歌字体🔗

谷歌字体的 text 参数可以让 api 返回的字体文件只包含 text 传入的字符。 例如: https://fonts.googleapis.com/css?family=Inconsolata&text=Hello

Ka

Redux

Ka

css 3D 引擎特效🔗

纯 css 实现的 3d 特效分析。

Ka

Taro 1.3 重磅发布:全面支持 JSX 语法和 Hooks🔗

多端 vue 阵营有 uni-app,wepy,react 阵营貌似就只 taro。

最主要的微信小程序端腾讯官方的有 wepy,然而貌似腾讯也在支持 taro。

国内多端比较

国内 uni-app 用的确实比较多。

凹凸实验室

数据库

mongodb4.2支持通配符索引🔗

语法

db.example.createIndex({ "attributes.$**": 1 });
{
    "createdCollectionAutomatically" : false,
    "numIndexesBefore" : 1,
    "numIndexesAfter" : 2,
    "ok" : 1
}

举例:

如下的数据:

{
   "type":"book",
   "title":"The Red Book",
   "attributes": {
       "color":"red",
       "size":"large",
       "inside": {
           "bookmark":1,
           "postitnote":2
       },
       "outside": {
           "dustcover": "worn"
       }
   }
}
{
   "type":"book",
   "title":"The Blue Book",
   "attributes": {
       "color":"blue",
       "size":"small",
       "inside": {
           "map":1
       },
       "outside": {
           "librarystamp": "Local Library"
       }
   }
}
{
   "type":"book",
   "title":"The Green Book",
   "attributes": {
       "color":"green",
       "size":"small",
       "inside": {
           "map":1,
           "bookmark":2
       },
       "outside": {
           "librarystamp": "Faraway Library",
           "dustcover": "good"
       }
   }
}

查询:

db.example.find({ "attributes.inside.bookmark": 2} })

也就是当数据结构确实是多态模式( polymorphic pattern )的情况下,使用通配符索引。

Dj Walker-Morgan (MongoDB)

mongodb 开源 kafka 连接器🔗

原生支持数据从 mongodb 流向 kafka 或从 kafka 流向 mongodb。

Scott L Hommedieu (MongoDB, Inc.)

2019开源数据库报告,mysql依然居首🔗

mongodb 从第二位降至第三位,postgres 从第三位升至第二位,不过两者之间相差不大,还有 AWS 的 DocumentDB 的影响。

商业数据库 oracle 第一,SQL Server 第二

部署方式上,本地数据库依然占据多数

NoSQL 与 SQL 的比率在缩小

scalegrid 摘译 Ka

Python

anonamause10

运维

Render 适合创业者的托管云供应商🔗

Render 是一个新的 Web 和 App 托管供应商,按照 Render 的 CEO 所述,在全面的云供应商(如 AWS)和 PaaS 供应商(如 Heroku)之间,Render 做到了“完美的平衡”。

连接到一个 GitHub 仓库,每当将代码更新推送到该仓库的时候,都会向服务部署更新。这样的话,没有必要创建单独的构建和部署管道。

Render 同时解决了这两个问题:我们提供了比现有 PaaS 更有价值的解决方案,尤其是在应用规模扩展方面。举例来说,如果你的应用需要 2GB RAM,在 Heroku 上你每月需要支付 250 美元。而使用 Render 的话,你只需要每月支付 15 美元,这是数量级级别的成本节省,它已经非常接近 DIY 云供应商的价格了。

举例来说,如果你希望运行一个 HTTP 服务,这个服务不能通过互联网进行访问,只能由你的 Render 账户下的其他服务来访问(类似于前端 API 或代理),在 Heroku 中这根本无法实现,而如果使用 AWS 云的话,则会需要很多网络和安全方面的搭建工作。但是,借助 Render,瞬间就能搭建完成,因为网络管理和服务发现是内置的功能

Reda Hmeid 译者 张卫滨

其他

广告

自由软件基金会(FSF)更新软件许可🔗

GNU证书列表 划分了许可证的分类,并用颜色对它们进行了区分: 从绿到蓝,绿色代表完全免费。

GitHub 推出微网站 Choose A Licence,帮您选择证书。

Sue Gee 译者 平川

跳舞吧排序🔗

当排序遇上舞蹈……

Ka

扫描二维码关注微信公众号
本期阅读量