"我们真的需要自己写一套组件库吗？"上周的技术评审会上,我正在和团队讨论组件库的选型。作为一个快速发展的创业公司,我们既需要高质量的组件,又想保持灵活的定制能力。在对比了多个方案后,我们选择了 shadcn/ui 这个相对较新的解决方案。 说实话,最开始我对这个决定也有些担忧。毕竟相比 Ant De ...

React 应用程序是由 组件 组成的。一个组件是 UI（用户界面）的一部分，它拥有自己的逻辑和外观。组件可以小到一个按钮，也可以大到整个页面。 ...

"能不能让 AI 直接在我的代码编辑器里帮我写代码？"两个月前，我们团队接到了这样一个挑战。作为一名前端工程师，我深知在浏览器中构建一个复杂的 AI 编程助手并非易事。今天，我想分享我们是如何一步步实现这个系统的。 系统架构设计 首先，让我们看看整个系统的核心架构： // types/index ...

"我们要开拓东南亚市场了！"产品经理小王兴奋地告诉我这个消息。作为技术负责人,我立刻意识到这意味着我们需要对整个系统进行国际化改造。说实话,虽然之前也做过一些多语言的项目,但面对一个正在运行的大型系统,国际化改造的挑战还是不小。 回想起上周的需求评审会,我们讨论了很多细节问题：不同语言的排版布局、日 ...

"网站太慢了，用户都在抱怨！"上周，我接手了一个正在运行的电商项目，首屏加载时间竟然长达 8 秒。作为一个对性能有执念的前端开发者，这个数字让我夜不能寐。经过一周的优化，我们把首屏时间压缩到了 2 秒以内。今天，我想和大家分享这个过程中的实战经验。 性能问题诊断 首先，我们需要找出性能瓶颈在哪里 ...

深夜,我盯着屏幕上的代码发呆。作为一个中型创业公司的前端负责人,我正在思考一个问题：我们是否需要开发自己的组件库？ 过去一年,随着业务的快速发展,前端团队从 3 人扩展到了 12 人,项目也从 1 个变成了 6 个。每个项目都在用着不同版本的 UI 组件,设计规范也不统一,这让产品同学苦不堆言。经过 ...

"你们的网站加载速度太慢了，而且 SEO 效果很差。"上个月，我们接到了一个来自海外客户的紧急需求。他们的电商网站是用传统的 React SPA 构建的，在性能和搜索引擎优化方面都遇到了瓶颈。作为技术负责人，我立刻想到了 Next.js 14 的 App Router。 今天，我想和大家分享这个 ...

"老师,我们的新功能上线后接口突然调不通了！"周一早上,实习生小李急匆匆地跑来找我。我打开监控面板,发现生产环境的错误日志突然暴增,全是 CORS 相关的报错。作为技术导师,我立即和小李一起开始排查这个问题。 说实话,跨域问题在本地开发时很常见,但在生产环境突然出现还是第一次。更让人困惑的是,这些接 ...

"老王,我们的后台系统用着用着就变卡了,而且内存占用越来越大,是不是被攻击了？"上周四下午,运维小张一脸焦虑地找到我。作为项目的前端负责人,我立即打开了系统开始排查。 说实话,这个问题确实让我有点意外。我们的后台系统用 React 开发,平时运行都挺正常的,怎么突然就出现性能问题了？带着这个疑问,我 ...

"你说我们能不能开发一个类似 ChatGPT 的应用？"上个月,一位创业朋友找到我,想做一个垂直领域的 AI 助手。作为一个经常和 AI API 打交道的全栈开发者,这个想法立刻勾起了我的兴趣。不过说实话,从零开始构建一个 AI 应用,还是让我有点小紧张。 经过一个月的开发迭代,我们成功上线了第一个 ...

"这个系统太庞大了,每次发布都提心吊胆..." 上个月的技术评审会上,我们团队正面临一个棘手的问题。一个运行了两年的企业级中后台系统,代码量超过 30 万行,构建时间长达 20 分钟,任何小改动都可能引发意想不到的问题。作为技术负责人,我决定是时候引入微前端架构了。 经过一个月的改造,我们成功将这个 ...

pilipala —— 使用 Flutter 开发的 BiliBili 第三方客户端，适配移动(Android、iOS)，暂时没有适配桌面端、Pad 端、手表端等。 ...

文章原文：Next.js项目App目录如何简单集成markdown博客 此教程适用于比较简单的项目实现，如果你是刚入门next，并且不想用太复杂的方式去实现一个博客项目，那么这个教程就挺适合你的。 Next.js官方关于markdown的文档有说明过如何渲染markdown，也是针对App目录的，但 ...

常规的图片优化有压缩图片、使用 CSS sprites、懒加载、预加载、CDN 缓存、合适的图片格式、七牛 CDN 图片参数等等，这里不在赘述，这篇文章我们将讨论其他几种方案~ ...

一、背景 在上一篇博客中，我分享了将RN的bundle包在原生鸿蒙开发中进行使用。但是如果我们在实际的开发过程中，每次修改完代码都需要打包，然后重新运行原生项目的话效率就有点太低了。 原生鸿蒙支持RN的热加载，每次改完代码直接ctrl+s即可，改动后的代码会自动同步到手机上。除此之外，还支持同时调试 ...

本文分两部分，一说前端路由的基本原理，二说 React Router 的实现原理 前端路由的基本原理​ 不说屁话，从时间线上讲，Web 应用原本是后端渲染，后来随着技术的发展，有了单页面应用，慢慢从后端渲染发展成前端渲染 在博客前端路由hash、history的实现 一问中我已经介绍过这两种模式 h ...

react聊天组件库：react-chat-elements 需求场景：用户可以通过多元的用户交互方式，如文件、图片、声音以及文字等输入相关信息，AI给出对应的回答 react-chat-element介绍 react-chat-elements 是一个专为React开发者设计的聊天组件库，旨在简化 ...

dber —— 一款基于实体连接图的数据库设计工具。支持可视化数据库结构设计，拖拽生成模型引用关系和一键导出 SQL 语句。 ...

React 是一个用于构建用户界面的 JavaScript 库，由 Facebook 开发并维护。它的核心理念是“组件化”，即将用户界面拆分为可重用的组件。 React 的组件通常使用 JSX（JavaScript XML）。JSX 是一种 JavaScript 语法扩展，允许开发者在 JavaSc ...

aspoem —— 现代化诗词学习网站，一个更加注重UI和阅读体验的诗词网站。收集了丰富的诗词资源，用户可以通过作者、诗词、名句快速查找诗词。 ...