Jimmy
### What do you want to do with Hls.js? There is a long playback video (about 4 hours), and we get info as belong: ``` #EXTM3U #EXT-X-VERSION:3 #EXT-X-TARGETDURATION:10 #EXT-X-MEDIA-SEQUENCE:0 #EXT-X-PROGRAM-DATE-TIME:2022-06-13T04:52:55.479...
离开了某 T 语音，离开了某美科技，离开了互联网企业；我进入了传统行业，进入了某外企中国子公司，进入了一个新的起点。 在某外企传统行业的一年，我们发生了什么故事？它和之前待的互联网企业又有什么的不同呢？下面，我将站在个人的角度，从工作、生活和娱乐三方面来谈下个人的感受。  > 注意：背景介绍，前面提到的两家互联网公司，都是千人左右的规模；目前所处的外企也是全球千人左右的规模，国内几十号人。接下来的讨论是针对国内的这两家和目前所待的这家进行... 好，现在我们进入主题～ ### 关于工作 一说到工作，我们离不开通勤和考勤。 在通勤这方面，主要看公司的地理位置，互联网公司所在的地理位置都很友好，不管地铁还是公交都很方便，这使得上下班的交通工具选择比较多，但是在高峰期上下班那是一种煎熬，不知道读者听说到`广州地铁三号线`了没；不过看着窗外的高楼林立，小蛮腰手可触摸，再手捧一杯星巴克欣赏日落🌄，这可能是白领的标配了。毕竟 `CBD` 区域一定位，朋友圈高度就不一样了～  而，传统行业一般地理位置比较靠近郊外，交通受限，离地铁得步行 `20` 分钟，太惨了。公交倒是有直达的，就是班次比较少。通勤时间妥妥的来回两个小时。如果你自己开车或者打的，那通勤来回可能一个半小时。地理位置在郊外，空气就比较清晰，毕竟树木多，人流少～ 在考勤这方面，制度没有什么差别，都是弹性上下班 -- **`9:00 ～ 9:30 am` 上班，`6:00 ~ 6:30 pm` 下班**。可能是公司地理位置不同的原因，前两个公司的补签都是每月 `3`...
在文章[Flutter 布局备忘录 -- 多图警告，干货建议收藏](https://juejin.cn/post/7108530957976043528)中，我们了解了常用的布局。在文章[Flutter 结合 Dio 使用](https://juejin.cn/post/7111129361041850404)中，我们了解了接口请求。那么，当一个 `Flutter` 应用开发完之后，我们怎么在 `iOS` 真机的调试呢？本文，我们来了解下。 ### 准备工作 - 一台 `Mac` 电脑，安装了 `Xcode` 软件  - 一条 `USB` 线 - 一台 `iPhone` - 一个能正常运行的 `Flutter`...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第8天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") 上一篇，我们讲了[ Angular 结合 NG-ZORRO 快速开发](https://juejin.cn/post/7083648025549078536)。前端开发，很大程度上是组件化开发，永远离不开组件之间的通信。那么，在 `Angular` 开发中，其组件之间的通信是怎么样的呢？ > 举一反三，`Vue` 和 `React` 中大同小异 本文纯文字，比较枯燥。因为控制台打印的东西比较鸡肋，所以就不配图了，嗯～希望读者跟着说明代码走一遍更容易吸收～ ### 1. 父组件通过属性传递值给子组件 相当于你自定义了一个属性，通过组件的引入，将值传递给子组件。`Show you the CODE`。 ```html ``` 在父组件中调用子组件，这里命名一个 `parentProp` 的属性。...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第9天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") 上一篇文章我们讲到了[ Angular 组件通信](https://juejin.cn/post/7084011213146816542)。本文我们讲讲，在项目开发中，你是否会遇到这样的需求： **请根据用户登陆，限制其访问的内容。** So，这就是要进行**权限控制**。 对用户的权限限制，我们一般会有下面的处理方式： 1. 对用户登陆的菜单做控制 2. 对用户的行为做限制 我们结合 `Angular` 来讲解下这个话题。 ### 菜单路由控制  系统开发的时候，会有很多的菜单，这个时候，就需要后端判断用户的角色，按照用户的权限返回不同的菜单路由。 返回的数据格式需要我们按照自己在 `app-routing.module.ts` 中编写好的路由路径对应。 比如，我们有路由文件如下： ```typescript // app-routing.module.ts const...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第10天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") 上一篇文章是[ Angular 项目实现权限控制](https://juejin.cn/post/7084378504313176101)。最近自己在网上看到别人使用 `vue` 进行自定义 `video` 的操纵。加上不久前实现了 `angular` 自定义 `video` 的相关需求， 遂来记录一下，作为交流思考🤔 实现的功能如下： - 播放 / 停止 - 快退 / 快进 / 倍速 - 声音开...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第11天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") 上一篇文章我们学习了 [Angular 中自定义 Video 操作](https://juejin.cn/post/7084784818247958535)，如果读者留意的话，会发现在这篇文章中就开始操作元素的属性 `scrollLeft`，这是很常用的一样属性。那么还有什么属性和方法比较重要呢？其又代表什么意思呢？下面我们进入主题。 - className - classList - clientLeft / clientTop - clientWidth / clientHeight - scrollLeft / scrollTop - Element.getBoundingClientRect() -...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第12天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") 在上两篇文章中，我们学习了[元素中必知重要属性和方法](https://juejin.cn/editor/drafts/7084785715929677855)和[ Angular 中自定义 Video 操作](https://juejin.cn/post/7084784818247958535)，没有度过的读者可先了解。 那么，现在有这么一个需求，你会怎么实现呢？ **页面中 video 标签，当滚动高度超过其位置之后，将其设置为可在可视区域自由拖拽。** 一个不错的 `Idea`，如果你使用 `Angular` 的 `@angular/cdk/drag-drop` 可以轻松实现，但是我们这里不使用工具。 好吧，我们来分析下实现的思路： - 页面滚动高度大于视频所在的位置：那么就是视频的 `bottom` 值相对可视窗口的值要小于0，我们需要设定一个包裹 `video` 标签的 `div` 方便计算，其高度是原设定 `video`...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第13天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") **本文是译文，采用意译。** `HTML` 是 `web` 开发的基石。然而很多急于速成的开发者对其浅尝即止，立马去学习 `CSS`, `JS` 或其他，错失了其潜力。 下面是很多初学者对 `HTML` 不熟悉的属性。 > 也许拥有几年的开发者都不知道。说的就是俺 💨 ### 1. Multiple `multiple` 属性是一个布尔值，允许用户在 `` 标签操作，`` 标签的类型 `type` 是 `file`...
一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第15天，[点击查看活动详情](https://juejin.cn/post/7080800226365145118 "https://juejin.cn/post/7080800226365145118") **本文是译文，采用意译。** 你是否好奇 `Angular` 应用背后场景都发生了什么？  你想知道 `Angular` 应用是怎么启动的？本文你值得阅读。 `Angular` 应用的启动基于 `angular.json` 文件。这个不是应用的入口文件，而是应用的启动文件。 ### 应用入口在哪？ 如果你使用旧版的 `Angular`，比如版本 `4` 或 `5` ，你会注意到没有 `angular.json` 这个文件，取而代之的是 `angular-cli.json` 文件。别在意，都是表达同样内容的文件，只是命名不同而已。 `angular.json`...