JavaScript之structuredClone现代深拷贝

3 月 4 日
阅读 3 分钟
338
在JavaScript中,实现深拷贝的方式有很多种,每种方式都有其优点和缺点。今天介绍一种原生JavaScript提供的structuredClone实现深拷贝。

CSS图像边框:Interop 2023的一个重点领域

2 月 27 日
阅读 5 分钟
561
在Interop 2023中,CSS图像边框被确定为一个关键的重点领域。这个特性允许您使用图像来设置元素边框的样式,浏览器已经支持这个特性很多年了。然而浏览器之间的行为差异导致Web开发人员不愿意完全使用此功能。随着Interop 2023中包含图像边框,重新承诺解决行为差异并鼓励广泛采用。这一举措强调了能够创建在不同浏览器...

GIT好习惯助你成为更出色的开发者

2 月 19 日
阅读 3 分钟
2.2k
如果你是一名开发人员,你可能每天都在使用Git版本控制系统。无论是在团队中还是单独工作,使用此工具对于程序的开发过程都很重要。但在实际工作中却经常遇到提交不明确的消息,没有传达有用的信息,以及滥用分支等问题。了解如何正确使用Git并遵循良好的实践对于那些想要在工作中脱颖而出的人来说至关重要。

Nodejs - 9步开启JWT身份验证

2 月 2 日
阅读 8 分钟
1.1k
身份验证是Web开发的重要组成部分。JSON Web令牌(JWT)由于其简单性,安全性和可扩展性,已成为在Web应用程序中实现身份验证的流行方法。在这篇文章中,我将指导你在Node.js应用程序中使用MongoDB进行数据存储来实现JWT身份验证。

18个JavaScript技巧:编写简洁高效的代码

1 月 30 日
阅读 4 分钟
1.2k
本文翻译自 18 JavaScript Tips : You Should Know for Clean and Efficient Code,作者:Shefali, 略有删改。在这篇文章中,我将分享18个JavaScript技巧,以及一些你应该知道的示例代码,以编写简洁高效的代码。让我们开始吧!🚀箭头函数可以使用箭头函数来简化函数声明。 {代码...} Array.from()Array.from()方法可用...

如何在JavaScript中实现主题切换

1 月 29 日
阅读 5 分钟
766
本文翻译自 How to implement Theme Switcher in JavaScript,作者:Pavel Keyzik, 略有删改。在本文中,您将学习如何在JavaScript中构建主题切换器。这应该是一件很容易的事情,但你也可以从我的代码中学到一些东西。我们需要处理哪些场景?我们应该解决的最基本的场景之一是将主题从亮到暗,反之亦然。我们需要解决的...

放个烟花迎接龙年春节吧

1 月 27 日
阅读 4 分钟
1.8k
不知不觉即将迎来2024龙年春节了。龙的形象在中国传统文化中有着广泛的应用,比如在传统文化中,龙代表着权力、威严、吉祥和神灵的象征,同时也是生命力和繁荣的象征。

每个开发人员都应该知道的13个Nodejs库

1 月 23 日
阅读 5 分钟
1k
Node.js被视为许多Web开发人员的理想运行时环境。它是世界上最流行的编程语言之一,Node.js提供了通过JavaScript库重用代码的能力,但是在项目中选择合适的库可能很困难。

JavaScript 的双位非运算(~~)

1 月 22 日
阅读 2 分钟
618
今天介绍JavaScript中双位非运算 ~~, ~~ 操作符是一个强大且经常被忽视的特性。它提供了一种快速、简洁的方式来处理数字和执行类型转换,通常可以被用于数学计算和类型转换。我们先了解一下 ~~ 的基本概念和它的一些应用场景。

炫酷鼠标悬停随机渐变文本动画效果

1 月 2 日
阅读 4 分钟
774
如图所示,这是一个很炫酷的鼠标悬停动画效果,卡片的文字随着鼠标的移动不断变化着,且文字的颜色伴随着渐变色跟随鼠标移动,中心部分是突出的LOGO效果,整个交互效果十分引人注目。原效果来源于 evervault.com/customers 这个网站,有兴趣的可以体验看看~

Vue 发布 3.4 「灌篮高手」版本

2023-12-30
阅读 3 分钟
713
此版本包括一些实质性的内部改进,最值得注意的是重写了模板解析器,速度提高了2倍,以及重构的响应系统,使效果触发更加准确和高效。它还对很多API进行高质量的改进,包括defineModel的稳定性和绑定props时的简写语法。

2024值得关注的技术社区

2023-12-28
阅读 3 分钟
183
我精心挑选了一些我最喜欢的开发者社区,了解这些社区相信会对你有所帮助。下面会列举相关社区链接、描述和站点图片,这样你可以立即对每个社区有一个初步的印象。

2023 年最受欢迎的 12 款 Chrome 浏览器扩展

2023-12-24
阅读 2 分钟
769
谷歌浏览器Chrome是目前最受欢迎的浏览器之一,而浏览器扩展则是为了提升用户体验和功能而开发的插件。2023年谷歌公布了12款最受欢迎的Chrome浏览器扩展。每个都提供独特的功能来增强您的浏览体验。以下是它们的详细介绍:Speechify:将Google文档、PDF、网页或书籍转换成语音,拥有30多种语言的自然发音声音。QuillBot...
封面图

[译]优秀的URL设计

2023-12-21
阅读 2 分钟
651
URL是通用的。它们可以在Firefox、Chrome、Safari、Internet Explorer、cURL、wget、iPhone、Android中使用,甚至可以写在便签上。它们是网络的一种通用语法,但别认为这是理所当然的。

JS获取当前系统电量情况

2023-12-15
阅读 2 分钟
731
首先让我们来看一下如何使用navigator.getBattery()方法来获取电池信息。在JavaScript中,我们可以通过以下代码来获取电池对象:

[译]你应该知道的多个HTML属性

2023-12-08
阅读 3 分钟
282
本文翻译自 13 HTML Attributes You Should Know About,作者:Shefali, 略有删改。在HTML中,属性用于提供有关HTML元素的附加信息。在这篇文章中你将学习多个HTML属性,它们可以增强网站的视觉吸引力。接下来开始吧!🚀Accept 属性您可以将accept属性与<input>元素(仅用于文件类型)一起使用,以指定服务器可以...

[译]你需要知道的CSS属性isolation

2023-12-07
阅读 3 分钟
687
本文翻译自 The CSS property you didn't know you needed 👈,作者:Francesco Vetere, 略有删改。大家好!👋今天我想谈谈一个CSS功能,在我看来没有得到太多的关注。但它应该被关注!我说的就是isolation属性!基本上它提供了更多对元素与文档其他部分交互的控制,并且通常是解决 z-index 问题的一种优雅的解决方案。让...

[译]原生CSS嵌套使用

2023-12-06
阅读 6 分钟
594
今年所有的主流浏览器都支持原生CSS嵌套:Chrome、Firefox和Safari。这是一个重要的CSS功能,这将使编写CSS更加容易。在本文中我将记录到目前为止我所学到的关于CSS嵌套的知识,并与您分享我的发现,包括使用案例和示例。

纯CSS实现炫酷背景霓虹灯文字效果

2023-12-04
阅读 4 分钟
826
如图所示,这是一个很炫酷的霓虹灯文字效果且背景炫酷,就像很多个灯光闪烁着不同的颜色。本次文章将解析如何用CSS代码实现这个效果,根据上面的动图分析出我们要实现的几个主要功能点:整个背景中有平均分布的小点衬托中心区域文字闪烁效果如同霓虹灯一样文字背景呈多个平均分布的亮点背景亮点的颜色整体呈现渐变色变化...

CSS技巧:从高度0过渡到自动高度

2023-12-02
阅读 2 分钟
395
本文翻译自 CSS trick: transition from height 0 to auto!,作者:Francesco Vetere, 略有删改。如果你在CSS上花了足够长的时间,很可能你曾尝试过从height:0到auto的平滑过渡。。。却发现它不起作用!😢️幸运的是现在有一个解决这个问题的方法:使用CSS Grid布局可以解决这个问题,而且代码简单,运行的很完美。让我们...

348字节实现精简版吃豆人小游戏

2023-12-01
阅读 3 分钟
1.2k
今天分享一个由@aemkei等大佬制作的只有348个字节的吃豆人小游戏,如上面动图所示,基本实现了游戏的主要功能,来看看大佬们是如何通过这么短的代码实现整个游戏的效果吧。

一种更好的前端组件结构:组件树

2023-11-29
阅读 8 分钟
527
本文翻译自 A Better Frontend Component Structure: Component Trees,作者:William Bernting, 略有删改。自很久以前遵循互联网上的建议以来,我一直采用了某种“能工作就行”的组件结构。场景让我们首先想象一个简化的前端应用程序目录结构,如下所示: {代码...} 问题所在上面的简单应用程序结构很难解释这些组件之间...

多种 React 组件通信方式实践

2023-11-27
阅读 6 分钟
535
在React中,组件之间的通信是一个非常重要的话题。当我们构建复杂的应用程序时,经常需要不同的组件之间共享数据或者进行相互协作。React提供了几种方式来实现跨组件通信,下面我将详细其中几种通信方式,并提供实际的代码示例。

纯CSS动态渐变文本特效

2023-11-24
阅读 4 分钟
647
如图所示,这是一个炫酷的文本渐变效果,如同冰岛的极光一般。本次的文章让我们逐步分解代码,了解其实现原理。基于以上动图效果可以分析以下是本次动效实现的主要几点:文本中有多个颜色的动画每个颜色显示的半径不同,有大有小整体动画是有规律的重复进行着实现过程接下来开始正式的代码实现过程,通过以上可以分析出...

提升编程效率:软件工程师必备的10个Git命令

2023-11-23
阅读 4 分钟
1.3k
Git和GitHub是每个软件工程师必须知道的最基本的东西。这些工具是开发人员日常工作的组成部分,因为我们每天都与它们互动。熟练掌握Git不仅可以简化你的工作,还可以显著提高工作效率。在这篇博客文章中,我们将探索一组命令,可以大幅提升你的生产效率。随着你对这些命令变得更熟练,你将节省宝贵的时间,并成为一个更...

提升JS编程效率:19个实用JS代码示例

2023-11-22
阅读 5 分钟
2.7k
在实际工作中,开发者常面临一些需巧妙编程解决的挑战。有时几行代码就能迎刃而解。本文整理了一系列实用代码片段,助您轻松处理URL、DOM操作、事件处理、日期处理以及用户偏好设置等常见问题。

纯CSS实现炫酷文本时钟

2023-11-21
阅读 3 分钟
811
如图所示这是一个纯本文时钟效果,和传统的时钟不一样,没有表盘,也没有完整到每一分钟的数字表示当前时刻。在这个时钟中,当前时间通过文本显示,显示的文本时间误差为+/- 4分钟,以明亮的颜色突出显示当前时间,而其余字母则较暗。实际上这是一个实现很复杂的时钟,因为只使用CSS实现,JS只需要获取初始化的时间,如...

纯CSS实现炫酷文本阴影效果

2023-11-20
阅读 3 分钟
726
如图所示,这是一个文本阴影效果,阴影有多个颜色,鼠标悬停时文本阴影效果消失,文本回到正常的效果。让我们逐步分解代码,看看如何使用纯CSS实现这个效果的。

基于 Letterize.js + Anime.js 实现炫酷文本特效

2023-11-14
阅读 3 分钟
777
如上面gif动图所示,这是一个很炫酷的文字动画效果,文字的每个字符呈波浪式的扩散式展开。本次文章将解读如何实现这个炫酷的文字效果。基于以上的截图效果可以分析出以下是本次要实现的主要几点:文案呈圆环状扩散开,扩散的同时文字变小文字之间的间距从中心逐个扩散开,间距变大文案呈圆环状扩散开,扩散的同时文字变...

纯CSS实现魔法渐变边框卡片

2023-11-13
阅读 3 分钟
935
如图所示,这是一个很炫酷的卡片效果,关键效果在于卡片的边框呈渐变色变化着,在网页中有这样一个卡片相信可以极大的增强用户体验交互。本次文章将解读如何使用纯CSS实现这个炫酷的卡片效果。
封面图

20行JS代码实现屏幕录制

2023-11-09
阅读 3 分钟
2.9k
在开发中可能有遇到过屏幕录制的需求,无论是教学、演示还是游戏录制,都需要通过屏幕录制来记录和分享内容。一般在App内H5页基于客户端能力实现的较多,现在浏览器中的 MediaRecorder 也提供了这种能力。MediaRecorder 是一种强大的技术,可以在浏览器端实现屏幕录制功能。本文将介绍如何使用JS MediaRecorder 实现屏幕...

Photoshop Web版本用了哪些CSS技术

2023-11-07
阅读 13 分钟
712
Photoshop是我14岁时学会的第一个专业设计应用程序。这是我成为设计师并最终成为前端开发人员的原因之一。正因为如此,我认为看看CSS是如何助力像Photoshop这样的大型应用开发会很有趣。

使用CSS圆锥渐变创建背景图案

2023-10-16
阅读 5 分钟
382
拥有一个好的背景图案可以使你的网站设计与众不同。多亏了CSS渐变,我们可以使用几行代码创建花哨炫酷的图案。在这篇文章中,我们将学习conic-gradient并使用它来创建不同的CSS图案。
封面图

CSS小技巧之单标签loader

2023-10-15
阅读 4 分钟
795
loader组件是网站的重要组成部分。它可以用在许多地方,我们需要显示的内容正在加载中。这样的组件需要尽可能简单,在这篇文章中我们将学习如何使用优化的代码创建不同的CSS加载器。

CSS小技巧之绘制心形图案

2023-10-13
阅读 4 分钟
790
我们将使用CSS创建一个心形图案。你可能会说:“为什么又一篇关于心形的文章?已经做过很多了!“。我们不会只建立一个心形图案,我们会使用现代的CSS技巧来实现。忘记带有border-radius和rotation的伪元素。我们也将把图像转化为心形图案!
封面图

使用三角函数在CSS中的随机性

2023-09-02
阅读 6 分钟
3.8k
本文翻译自 Randomness in CSS using trigonometry,作者:Kacper 略有删改在过去,我已经介绍了CSS中使用模运算的伪随机性的主题,我使用素数创建了一个自动计数器,可以用来为每个对象生成不同的值。因此,我们可以独立地计算每个元素的伪随机值。尽管这个解决方案很强大,但它几乎没有缺点:模函数不是连续的它过于复...