- 博客(219)
- 资源 (3)
- 问答 (1)
- 收藏
- 关注
原创 从零掌握 Pandas:数据分析的黄金钥匙|01:认识Pandas
Pandas是Python中用于结构化数据处理的开源库,核心数据结构包括一维的Series和二维的DataFrame。它提供数据清洗、分析操作(筛选/分组/统计等)、多格式数据读写(CSV/Excel等)、可视化支持以及性能优化功能。主要特点是通过表格型数据结构和丰富的数据操作方法,实现高效的数据分析与处理。
2025-10-23 17:24:17
373
1
原创 每日前端宝藏库 | tinykeys ✨
摘要: tinykeys 是一款仅500字节的极简键盘快捷键库(支持gzip),提供声明式API、跨平台键位适配(自动识别Mac/Win)和顺序快捷键(如g i)功能。开发者可通过3行代码绑定Cmd+K搜索、Escape关闭等交互,支持React Hooks优雅集成。特点包括零依赖、多键绑定、动态控制,适用于编辑器、管理后台等场景,显著提升操作效率。提供CDN即时测试方案,实测代码片段可一键运行,被誉为键盘交互的轻量级加速器。
2025-09-29 21:30:47
658
原创 每日前端宝藏库 | Tippy.js ✨
Tippy.js是一款基于Popper.js的现代化JavaScript提示框库,支持气泡提示、弹出框、富文本、动画和主题定制。相比原生title属性,它提供智能定位、平滑动画、移动端适配和可访问性支持。通过简单安装和配置,即可实现专业级交互提示,适用于数据图表、帮助说明等场景。其核心特性包括智能避让、多种触发方式、动态内容更新和自定义主题,是提升UI交互体验的理想选择。
2025-09-28 20:08:39
1257
原创 每日前端宝藏库 | FilePond.js ✨
FilePond.js是一个现代化、轻量级的JavaScript文件上传组件,提供丝滑的拖拽上传、图片预览、实时上传和多文件管理功能。它支持插件扩展,可实现图片裁剪、压缩等高级操作,同时兼容移动端和响应式设计。通过简单的三步安装和配置,即可将原生文件输入升级为媲美原生App的上传体验。FilePond.js适用于头像上传、表单附件、CMS系统等场景,显著提升用户交互体验。
2025-09-19 17:19:04
727
原创 每日前端宝藏库 | progress.js ✨
progressbar是一款轻量、灵活的JavaScript进度条库,支持圆形、线形等多种SVG动画样式,无需依赖,可提升用户体验。适用于文件上传、页面加载、表单步骤等场景,解决原生进度条样式单一、反馈模糊等问题。快速上手只需安装库、准备HTML容器并调用API,支持自定义颜色、动画效果及回调函数。核心特性包括多形状支持、SVG高清渲染、缓动动画和响应式设计。实用场景如模拟页面加载条或实时文件上传进度,显著增强交互透明性。
2025-09-18 14:30:46
644
原创 每日前端宝藏库 | Toastify.js ✨
Toastify.js是一款超轻量级(< 5KB)的JavaScript消息提示库,具有无依赖、零配置的特点。它支持一行代码调用,提供6种通知位置、自定义样式、动画效果和交互行为(自动关闭/点击关闭)。无需框架依赖,通过CDN即可快速集成,30秒完成部署。该库支持响应式设计,适配移动端,提供全局配置和高级定制功能(如SVG图标)。适用于表单反馈、操作提醒等场景,开发者评价其易用性、兼容性和定制性俱佳,是轻量级通知系统的理想选择。
2025-09-17 21:04:15
1074
原创 每日前端宝藏库 | fullPage.js [特殊字符]✨
fullPage.js 是一个专为全屏滚动设计的 JavaScript 库,可快速实现整屏切换、平滑滚动、导航指示等交互效果。相比传统方案,它简化了复杂逻辑,支持精准滚动、移动端手势和扩展动画,适用于产品展示、作品集等场景。通过简单安装、结构化 HTML 和初始化配置即可使用,还支持横向滑块、回调动画等高级功能。其核心特性包括导航点、锚点跳转、键盘控制等,适合打造沉浸式视觉体验。
2025-09-16 21:02:57
1098
原创 每日前端宝藏库 | anime.js⏳✨
anime.js是一个超轻量(仅 18KB)的 JavaScript 动画引擎 🚀,支持 CSS、SVG、DOM、JS 对象动画,API 简洁如诗,让你轻松实现丝滑、复杂、高性能的动画效果!💫🌈🎵 它不只动起来,它还会呼吸。🌬️💖评分内容🚀 易用性⭐⭐⭐⭐⭐🎨 功能丰富度⭐⭐⭐⭐☆📦 体积⭐⭐⭐⭐☆🖼️ 视觉表现力⭐⭐⭐⭐⭐💡 推荐指数🔥🔥🔥🔥🔥✅如果你想让页面“活”起来,anime.js就是那支魔法画笔!🖌️✨轻量、强大、优雅,动画从此上瘾。😎。
2025-09-15 21:49:25
431
原创 每日前端宝藏库 | Lodash⏳✨
Lodash是一个功能全面、性能出色的JavaScript工具库,提供数组、对象、字符串等常见操作的简化方法。通过按需引入和Tree-shaking优化,它能大幅提升开发效率,同时保持代码轻量。 核心优势: 简化复杂操作(如深拷贝、防抖/节流、安全取值) 提供健壮的数据处理方法(去重、过滤、属性操作) 支持现代工程的按需引入,避免冗余 推荐场景:表单处理、数据清洗、事件优化等。Lodash不是炫技工具,而是提升代码质量和开发体验的实用选择。
2025-09-14 09:52:25
490
原创 每日前端宝藏库 | Day.js ⏳✨
Day.js 是一款仅2KB的超轻量级JavaScript时间处理库,完美兼容Moment.js API但体积骤减99%。支持插件化扩展(相对时间、时区等)、不可变操作和IE8+兼容性,三步即可快速集成。适用于日历组件、数据可视化等场景,被开发者誉为“现代前端时间处理标配”。其极简体积、零学习成本和强大功能,成为替代Moment.js和原生Date对象的首选方案。
2025-09-13 21:28:10
407
原创 [特殊字符] 50 天 50 个项目 — 完结篇
50天50个项目挑战圆满收官!这段旅程不仅构建了精美的交互式组件,更培养了现代前端开发的核心思维。作为终点,About和Footer组件集中体现了课程理念:About以实用性、趣味性和教育性为灵魂;Footer作为导航枢纽,采用三栏布局优化用户体验。整个项目贯穿了用户中心设计、渐进增强、组件化思维、响应式优先和技术融合五大原则。这50天的积累已为你打造出扎实的作品集和独立开发能力,而真正的旅程才刚刚开始——期待你用这些技能创造属于自己的精彩项目! 🚀
2025-08-04 16:30:00
755
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | InsectCatchGame(捕捉昆虫游戏)
该项目通过三个界面(开始页、昆虫选择页、游戏页)实现互动式游戏体验,核心功能包括:1)响应式状态管理(ref/computed);2)动态昆虫生成与位置随机化;3)点击捕捉动画效果;4)计时计分系统。技术亮点涉及组合式API、生命周期钩子、动态样式绑定等Vue核心特性,同时采用CSS过渡实现平滑动画。
2025-08-04 16:00:00
1723
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | TodoList(代办事项组件)
基于Vue 3的待办事项应用开发项目。该项目使用组合式API和Tailwind CSS实现核心功能,包括添加任务、切换完成状态和删除任务,并通过localStorage实现数据持久化。文章详细解析了模板结构和脚本逻辑,展示了响应式数据处理和交互设计的具体实现。
2025-08-03 16:30:00
1090
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | TestimonialBoxSwitcher(用户评价展示组件)
使用Vue 3和Tailwind CSS构建的自动轮播客户评价组件TestimonialBoxSwitcher。该组件具有平滑进度条指示器,支持10秒自动切换评价内容,并在用户悬停时暂停轮播。主要技术特点包括:Vue 3的组合式API、响应式状态管理、定时器控制、图片错误处理以及Tailwind CSS的过渡动画效果。组件结构包含进度条、评价内容区和用户信息区,通过计算属性动态显示当前评价,并优雅处理图片加载失败情况。适用于个人作品集或官网展示客户反馈。
2025-08-03 16:00:00
925
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | RandomImageGenerator(随机图像生成组件)
基于Vue 3和Tailwind CSS的随机图片流组件,可从Lorem Picsum服务获取不同尺寸的图片。主要功能包括:创建5行3列的网格布局,每张图片随机生成300-309像素的尺寸;使用Vue的组合式API管理图片数据;实现图片加载失败自动重试机制;通过v-for动态渲染图片网格。技术亮点包括:使用ref响应式管理图片数组、onMounted生命周期初始化图片、v-for绑定动态样式、error事件处理图片加载失败。
2025-08-03 16:00:00
1080
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | QuizApp(交互式在线测验应用组件)
基于Vue 3和Tailwind CSS构建的在线测验应用(QuizApp)。该应用包含多道单选题,实现了题目展示、答案选择、提交验证、得分统计和重新开始等核心功能。技术亮点包括:使用Vue 3的<script setup>语法管理状态(ref和computed),通过v-if/v-else条件渲染不同界面,v-for动态生成选项,v-model实现双向绑定。应用数据采用quizData数组存储题目信息,通过currentQuestionIndex等响应式变量管理状态。
2025-08-02 16:30:00
879
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | NetflixMobileNavigation(奈飞移动导航组件)
使用Vue 3和Tailwind CSS实现一个具有三层嵌套滑动动画的移动端侧边导航菜单。该菜单通过transform和transition实现视觉冲击效果,当点击菜单按钮时,三个不同颜色的面板会依次滑入(深灰、红色、白色)。
2025-08-01 16:30:00
1193
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | RangeSlider(范围滑块组件)
本项目使用Vue3的<script setup>语法和Tailwind CSS构建了一个动态范围滑块组件。主要特点包括: 核心功能 实现自定义样式的HTML范围滑块 动态数值标签跟随滑块移动 标签始终居中显示在滑块上方 技术亮点 使用Vue3响应式系统管理状态 结合v-model双向绑定和@input事件监听 通过getComputedStyle()获取元素实际尺寸 数学计算实现标签位置的精确控制 实现细节 移除原生滑块样式,完全自定义外观。
2025-08-01 16:00:00
969
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | FeedbackUiDesign(评价反馈组件)
使用Vue 3和Tailwind CSS构建的用户满意度评分组件。该组件提供三种表情选项(Unhappy/Neutral/Satisfied)供用户选择,点击提交后显示感谢界面。技术亮点包括:Vue 3的Composition API管理状态,v-for动态渲染选项,v-if条件切换面板,Tailwind CSS实现响应式设计和动画效果(悬停高亮、选中放大、点击反馈)。
2025-07-31 16:30:00
1277
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | LiveUserFilter(实时用户过滤组件)
使用Vue 3和Tailwind CSS构建的实时用户搜索过滤组件(LiveUserFilter)。该组件通过随机用户API获取数据,支持基于姓名和位置的实时搜索功能。主要技术点包括Vue 3的Composition API、计算属性实现过滤、响应式状态管理,以及Tailwind CSS的样式处理。组件包含搜索框、用户列表、加载状态和无结果提示等功能,代码结构清晰,包含模板和脚本的详细实现说明。
2025-07-31 16:00:00
1731
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | VerifyAccountUi(验证码组件)
使用Vue 3和Tailwind CSS构建验证码输入组件的实践。该项目是50个小项目挑战的一部分,主要实现6位验证码输入功能,包含自动聚焦、键盘导航和输入验证等特性。通过<script setup>语法管理状态,利用v-for循环生成输入框,并应用Tailwind CSS实现响应式布局和过渡动画。
2025-07-30 16:01:55
1167
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | 3dBackgroundBoxes(3D背景盒子组件)
使用Vue 3和Tailwind CSS实现的3D背景盒子交互组件。该组件通过动态生成4×4的盒子网格,点击"Magic"按钮可触发整体缩放和3D旋转动画。技术亮点包括:使用Vue的<script setup>语法管理响应式状态,通过v-for循环生成16个盒子,利用背景定位实现Gif动画的分块显示,并添加3D边框效果增强立体感。
2025-07-30 15:47:02
1969
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | PasswordStrengthBackground(密码强度背景组件)
使用Vue 3和Tailwind CSS实现的手机应用切换组件。该组件模拟真实手机界面,通过底部导航栏实现页面切换功能。主要技术点包括:使用Vue 3的<script setup>语法管理状态,v-for指令动态渲染页面和导航项,transition-opacity实现淡入淡出动画效果,以及Tailwind CSS快速构建UI样式。组件包含内容区域(全屏图片)和底部导航栏(4个可切换标签),点击导航项时会平滑切换显示对应页面并更新选中状态。
2025-07-29 08:42:39
1027
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | MobileTabNavigation(移动导航组件)
使用 Vue 3 的 <script setup> 语法结合 Tailwind CSS 来创建一个仿手机界面的应用切换组件。这个组件模拟了真实手机中点击底部导航栏切换不同页面的动画效果,非常适合用于展示移动端 UI 设计或作为网页中的交互式演示。
2025-07-29 08:34:54
1101
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | Pokedex(宝可梦图鉴)
使用Vue 3构建宝可梦图鉴应用的项目实践。通过PokeAPI获取前150只宝可梦数据,实现动态卡片展示与交互效果。项目采用Vue 3的Composition API和Tailwind CSS,主要技术点包括:异步数据获取、类型颜色映射、鼠标悬停详情展示等。文章详细解析了模板结构、脚本逻辑和关键功能实现,并提供了扩展建议。
2025-07-28 09:38:31
1266
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | Hoverboard(悬浮滑板组件)
使用Vue 3和Tailwind CSS实现的交互式Hoverboard组件。该组件通过动态生成90个小方块(30列×3行),当鼠标悬停时方块会随机变色并发光,移出后平滑恢复。技术实现包括:Vue Composition API管理状态,Tailwind CSS构建布局和过渡动画,动态颜色生成算法,以及鼠标事件绑定。组件具有高度可配置性,可调整行列数或扩展为点击触发等功能。
2025-07-28 09:20:43
910
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ImageCarousel(图片轮播组件)
使用Vue 3和Tailwind CSS实现的图片轮播组件。主要功能包括:手动切换图片(上一张/下一张)、自动播放(3秒间隔)、平滑过渡动画。组件采用Vue 3的Composition API管理状态,通过transform实现图片切换效果,并利用Tailwind CSS快速构建UI。
2025-07-22 22:51:12
1333
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | AnimatedCountdown(倒计时组件)
使用Vue 3和TailwindCSS构建的倒计时动画组件。该组件通过Composition API管理状态,实现从"GO"字样到数字3、2、1的动画过渡效果,包含缩放、旋转和透明度变化等视觉效果。关键实现点包括: 使用<script setup>语法管理状态 通过runAnimation函数控制动画序列 利用TailwindCSS实现响应式动画效果 动态类绑定实现不同动画阶段 异步wait函数控制时间延迟 组件适合作为启动页或游戏。
2025-07-22 16:00:00
856
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | NotesApp(便签笔记组件)
使用 Vue 3 + TailwindCSS + marked 构建的笔记应用,支持以下功能: 增删改查笔记卡片 实时 Markdown 渲染预览 本地存储自动保存 响应式 UI 设计 技术亮点: Composition API 管理状态 watchEffect 实现自动保存 marked 库解析 Markdown v-html 安全渲染 TailwindCSS 快速构建 UI 项目特点: 双模式切换(编辑/预览) 简洁美观的卡片式布局 完善的本地数据持久化
2025-07-18 16:30:05
810
4
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | GoodCheapFast(Good - Cheap - Fast三选二开关)
基于Vue 3的"Good-Cheap-Fast"三选二交互组件开发,通过Composition API和TailwindCSS实现。该组件模拟项目管理中的权衡法则,用户最多只能同时选择两个选项。核心逻辑通过toggleFeature函数控制状态互斥,当三个选项全选时会自动关闭最早开启的选项。采用动态类绑定实现开关按钮的平滑过渡效果,包含UI状态反馈(颜色/文字提示)。
2025-07-17 17:33:51
1007
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | PasswordGenerator(密码生成器)
基于Vue 3和TailwindCSS的密码生成器组件,该组件允许用户自定义密码长度(1-100位)并选择包含的字符类型(大小写字母、数字、符号)。通过Vue 3的Composition API管理状态,利用TailwindCSS快速构建响应式UI界面。核心功能通过generatePassword函数实现,根据用户选择的字符集随机生成密码。组件具有简洁美观的卡片式设计,包含输入框、数字选择器、多选框和生成按钮,提供良好的交互体验。
2025-07-17 16:30:00
723
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | AutoTextEffect(自动打字机)
使用Vue 3实现一个动态打字机效果的组件。该组件通过Composition API管理状态,实现了逐字显示文本、模拟删除操作、调节打字速度等功能。核心逻辑包括typeLoop函数控制文本展示流程,watch监听速度变化,以及onMounted/onUnmounted管理生命周期。组件采用TailwindCSS实现响应式布局和动画效果,包含闪烁光标等视觉元素。
2025-07-16 16:26:00
1077
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | DoubleClickHeart(双击爱心)
使用 Vue 3 开发的双击点赞动画组件。通过 Composition API 和 TailwindCSS 实现双击图片触发爱心动画效果,并统计点赞次数。主要技术点包括:响应式状态管理、双击事件判断(800ms间隔检测)、动态生成定位爱心元素、CSS放大淡出动画,以及使用 TailwindCSS 构建 UI 布局。组件适用于社交媒体点赞等场景,具有视觉互动性和实用功能。
2025-07-15 23:40:27
3043
9
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | GithubProfies(GitHub 个人资料)
基于Vue 3和TailwindCSS的Github用户信息展示组件,通过调用Github API实现用户搜索功能。组件包含表单输入、用户基本信息展示(头像、关注数、仓库数等)以及前5个公开仓库列表。技术实现上采用Vue 3的Composition API管理状态,使用fetch进行API请求,并通过v-if条件渲染处理不同状态(加载中、错误、用户数据)。
2025-07-14 20:12:38
991
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ToastNotification(推送通知)
使用Vue 3和TailwindCSS实现Toast通知组件的开发过程。该组件具有动画效果,支持点击按钮显示通知并3秒后自动消失。
2025-07-13 17:26:59
1428
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | DoubleVerticalSlider(双垂直滑块)
使用Vue 3和TailwindCSS开发的全屏双垂直联动轮播组件。该组件采用左右分栏设计,左侧显示文字内容,右侧展示图片,通过按钮控制实现上下联动滑动效果。技术实现上运用了Vue 3的Composition API和响应式变量管理状态,结合TailwindCSS构建布局和动画。核心功能包括:全屏容器布局、左右区域联动滑动(通过transform控制位移)、按钮控制滑动方向等。
2025-07-10 23:37:17
1333
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | StickyNavbar(粘性导航栏)
使用Vue 3和TailwindCSS创建的响应式粘性导航栏组件。该项目通过Composition API实现滚动监听,当页面滚动超过100px时,导航栏会自动切换为白色背景并添加阴影效果。组件包含动态样式切换、当前页签高亮显示、平滑过渡动画等功能,同时搭配了Hero区域和内容展示区。技术实现上使用了Vue 3的ref响应式变量、生命周期钩子和动态类绑定,结合TailwindCSS快速构建UI样式。
2025-07-08 22:42:23
1277
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ContentPlaceholder(背景占位)
使用Vue3的<script setup>和TailwindCSS实现了一个带骨架屏效果的卡片组件。核心功能包括: 通过v-if切换加载状态,未加载时显示灰色占位块并添加animate-pulse脉冲动画 模拟2.5秒异步请求延迟后显示真实内容(标题、图片、作者信息等) 采用TailwindCSS快速构建UI样式,包括卡片布局、圆角、阴影和动画效果 组件结构清晰,分为图片区和内容区,内容区包含标题、摘要和作者信息模块。
2025-07-07 22:16:10
1328
1
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | KineticLoader(运动Loading组件)
使用Vue 3和TailwindCSS创建的KineticLoader双层CSS动画加载器组件,该组件通过两个以不同延迟旋转的三角形图层,形成动态的交错加载效果。技术实现包括Vue SFC组件、TailwindCSS布局、@keyframes动画和CSS transform旋转。组件采用经典的border技巧绘制三角形,并通过自定义动画类实现交错旋转效果。
2025-07-06 12:06:38
1002
原创 50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | DrawingApp(画板组件)
基于Vue 3和Canvas的在线画板应用,主要功能包括:使用鼠标绘制图形、调整画笔粗细和颜色、一键清空画布。项目采用Vue 3的Composition API和TailwindCSS实现,核心功能通过Canvas API完成绘图操作。技术亮点包括:响应式变量管理画笔状态、鼠标事件监听实现绘制逻辑、Canvas上下文设置优化绘图体验。
2025-07-06 11:16:52
1104
uniapp集成colorUI uView组件库 vuex全局变量管理
2022-05-11
2020电赛-简易温度测量.7z
2021-10-02
uniapp前端H5请求后台API接口二维码数据,返回来的一串很长的二维码字符串
2021-11-25
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅