聚焦前端, 记录过去一个月看到的优秀的文章, 内容来源主要有 GitHub,Hacker News,Medium, 掘金, Twitter,V2EX,uplabs 以及邮件 RSS 订阅和发散阅读. 可能会有设计方面的分享, 同时也会分享一些个人觉得比较好的应用. 每月 28 日更新, 本期第二期. 同步到 GitHub https://github.com/xiaoluoboding/monthly 和我的博客.
星推
GitHub Star 推荐
- Jsonnet https://github.com/google/jsonnet
- Jsonnet - The data templating language
- Ant Design of vue https://vue.ant.design/docs/vue/introduce-cn/
这里是 Ant Design 的 Vue 实现, 开发和服务于企业级后台产品.
工具
Top 50 Developer Tools of 2018
一站式了解 Stack Share 为你提供的 2018 排名前 50 的开发者工具
CSS Shapes Editor
谷歌插件, 帮助开发者在 Chrome DevTools 中调试 CSS Shapes 特性
New Moon Theme For Chrome DevTools
谷歌插件, 一款可代替 Chrome DevTools 默认暗色风格的暗色主题
FlexSearch https://github.com/nextapps-de/flexsearch
一个新一代的基于上下文进行全文搜索的库
CodePan https://codepan.net/
可以离线运行的代码运行环境, 提供多种模版
webGradients https://github.com/itmeo/webgradients
WebGradients is a free collection of 180 linear gradients that you can use as content backdrops in any part of your website. Easy copy CSS3 crossbrowser code and use it in a moment! We've also prepared a .PNG version of each gradient. As a bonus, there are packs for Sketch & Photoshop.
- CSS clip-path maker https://bennettfeely.com/clippy/
- The clip-path property allows you to make complex shapes in CSS by clipping an element to a basic shape (circle, ellipse, polygon, or inset), or to an SVG source.
- Split.JS https://github.com/nathancahill/split/
- Unopinionated utilities for resizeable split views
- IconSvg https://iconsvg.xyz/
- ICONSVG is a tool to simplify the process of finding and generating common icons for your project.
教程
An Introduction to CSS Shapes
CSS Shapes allow us to make interesting and unique layouts by defining geometric shapes, images, and gradients that text content can flow around. Learn how to use them in this tutorial.
Tasks, microtasks, queues and schedules
任务, 微任务, 队列
贝塞尔曲线入门 https://pomax.github.io/bezierinfo/zh-CN/
A free, online book for when you really need to know how to do Bézier things.
数据可视化基础 https://serialmentor.com/dataviz/
O'Reilly 新书《数据可视化基础》一书的在线预览版
Vue - Table 表格渲染上千数据优化 https://zhuanlan.zhihu.com/p/53455289
作者讲解了通过设计一个 虚拟滚动 功能来优化渲染上千数据
Writing Animations That Bring Your Site to Life
作者将 Dribbble 上交互比较好的例子拿来做教程例子, 个人比较喜欢这种学习方式.
阅读
So What's New in Babel 7?
Babel 发布了 7.0 版本, 将支持 JSX 以及 TypeScript 编译
Dropbox 的透明度报告 https://www.dropbox.com/zh_CN/transparency/reports
自 2012 年起, 我们每半年发布一次报告, 公布我们收到的请求数量以及我们做出的回应.
What's New in ES2019
ES2019 来临, Chrome73 已经支持, 来学习下 JavaScript 新特性
React 16.8 发布了
React 16.8 将正式支持 React Hooks
Vue 2.6 发布了 https://zhuanlan.zhihu.com/p/56260917
Vue 团队在年三十发布了 Vue 2.6 "Macross"
新奇
12 Incredible Pure CSS Experiments
12 个令人惊叹的 CSS 实验项目
世界上第一张网页 http://info.cern.ch/
World's First Website, Created By Tim Berners-Lee In 1991
应用
平台 | 应用 | 说明 |
---|---|---|
Mac | eZip https://ezip.awehunt.com/ | 专为 macOS 而设计的压缩软件 |
Mac | Carbonize https://www.dangercove.com/carbonize/ | Generate gorgeous images from your code snippets. Ready to save or share. |
Chrome | Chrome Themes | 14 款由 Chrome 团队发布的浏览器主题 |
来源: https://juejin.im/post/5c77ed0b5188255e53232b1c