视野修炼-技术周刊第70期

欢迎来到第 70 期的【视野修炼 - 技术周刊】,下面是本期的精选内容简介

🔥强烈推荐

  1. vscode-eslint-disable - vscode 插件
  2. npm 2023 回顾
  3. 使用JS快速获取视频任意位置缩略图
  4. 基于七牛云OSS的简洁图床

🔧开源工具&技术资讯

  1. FRE123 开源 - 快速搭建个性化导航网站
  2. 英:交互式 CSS Grid 教程
  3. Calendar Remark - 自定义标记&分享日历
  4. 科普:了解文件大小单位

​也推荐大家关注一下最后的推荐内容(周刊的主要内容来源渠道)

下面开始本期内容的介绍,预计阅读时间 8 分钟。

🔥强烈推荐

1. vscode-eslint-disable - vscode 插件

允许使用快捷键,快速创建 eslint-disable 注释。

支持行、块、当前文件。

常用 ctrl+alt+d ,ctrl+alt+a,多用几次就记住了,开发嘎嘎提效

2. npm 2023 回顾

Top50 被依赖的包 有点意外 React 作为一个框架居然在第二的位置,说明其生态还是非常的庞大

可以看出来 TypeScript 是非常流行的。

最近每周下载量 Top 20的包

可以看出来大部分是特定功能的工具库,看了一下有 7 个都是笔者用过的。

3. 使用JS快速获取视频任意位置缩略图

张鑫旭大佬最近分享的开发经验

原理:利用video元素进行绘制,希望绘制哪一帧视频,就让视频跳到这一帧的画面,然后使用canvas直接绘制该video元素。

学到了!

4. 基于七牛云OSS的简洁图床

笔者自己的小应用,花了个周末,将其重构成了Vue实现(之前就是HTML+JS),方便后续功能迭代实现。

纯前端部署,无需服务端接入,配置生成的token 即可使用。

之前旧的那一版是3年前写的了,最近想加点图片压缩,格式转换等功能,发现旧的不好拓展。

七牛云每月 10G 免费空间,笔者用了快5年了,也才用掉 6G 空间。平时写文章插图都用它。

🔧开源工具&技术资讯

5. FRE123 开源 - 快速搭建个性化导航网站

FRE123 - Free Resource for Everyone:老胡信息周刊的衍生项目,核心目的是用技术打破信息差,为每个人提供免费优质资源。

效果大概如下

项目GitHub地址:github.com/fre123-com/...

项目使用nuxt构建,支持通过 Vercel 一键部署

6. 英:交互式 CSS Grid 教程

内容比较干货,可以结合翻译软件学习,有许多的交互性示例

Grid Structure Grid Children

7. Calendar Remark - 自定义标记&分享日历

这个工具可以标记日历,并生成分享图

适配了 PC/H5 访问,UI还是比较漂亮的。

项目使用React开发,可以移植成组件复用。

8. 科普:了解文件大小单位

内容比较简洁,可以看做是一个对照表,

作者还给到了一些对比的例子,帮助理解。

😛趣图


篇幅有限,如果你还没看够,可移步后面的推荐渠道,继续游览,历史周刊(<20)移步博客

⭐️强力推荐关注

相关推荐
就叫_这个吧1 分钟前
HTML或JSP页面链接CSS,link标签没问题,但不显示样式问题解决
java·前端·css·html·intellij-idea·jsp
IT_陈寒4 分钟前
SpringBoot这个坑差点让我加班到天亮
前端·人工智能·后端
小小龙学IT10 分钟前
Rust Web 框架 Axum:轻量级异步的下一代后端利器
前端·驱动开发·rust
Harvy_没救了11 分钟前
【github爆款】MarkItDown 部署与测评报告
github
大鱼前端13 分钟前
10 分钟用 Bun + Hono + SQLite 跑通一个全栈 API
前端·javascript
comcoo14 分钟前
避坑指南:OpenClaw v2.7.9 Windows/macOS 零基础安装全过程
人工智能·windows·macos·github·开源软件·open claw·open claw部署包
古怪今人19 分钟前
Vite8的项目中集成CSS预处理器编译器SCSS 集成Mock工具
前端·css·scss
SL-staff23 分钟前
Vue3私有化AI白板落地实战|解决政企项目智能绘图合规难题(可直接复用源码)
人工智能·低代码·开源·vue3·白板·jvs规则引擎·jvs-draw
小此方23 分钟前
【别传:Web前端开发(一)】快速构筑项目外壳:HTML 核心标签复习指南
前端·html
小此方24 分钟前
【别传:Web前端开发(二)】重塑视觉视界:CSS核心机理与弹性排版全景草稿
前端·css