V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX  ›  XCFOX  ›  全部回复第 2 页 / 共 11 页
回复总数  210
1  2  3  4  5  6  7  8  9  10 ... 11  
102 天前
回复了 iGmainC 创建的主题 React 关于 react 项目结构的疑惑
我建议你放弃思考直接用框架的答案。
如果当前项目是基于 React-Router 的话上 remix: https://remix.run/
不然的话直接上 https://nextjs.org/

啥目录结构、错误处理框架都给你安排得明明白白:
https://remix.run/docs/en/main/guides/errors
https://nextjs.org/docs/app/building-your-application/routing/error-handling
能否支持通过 npx 命令行调用?应该只需要加一点配置和几行代码
111 天前
回复了 batchfy 创建的主题 问与答 RESTFul 后端返回什么 HTTP 状态码比较规范
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Status
一般 4XX 是服务报错,5XX 是运维(CDN/代理)出了问题
你是否在找 GraphQL ?
113 天前
回复了 nnegier 创建的主题 Java [Spring] WebSocket 怎么做到集群?
如果是服务端主动推送的场景的话,可以考虑一下使用消息中间件 NATS: https://nats.io/

NATS 内置了楼上提到的负载均衡、广播等功能。
NATS 能够通过 SDK 与前端、客户端直接连接。
NATS 能够很方便地实现水平扩展,NATS 能够与你的用户权限体系集成。

https://docs.nats.io/running-a-nats-service/configuration/websocket/websocket_conf
npm pack 一下会得到一份模块压缩包。把这个压缩包扔到 oss 上,或者再开一个仓库专门用来存模块包,或者直接把模块扔 a,b 项目仓库里。

从 url 安装模块:npm install https://github.com/indexzero/forever/tarball/v0.5.6
从 本地安装模块: npm install ./package.tgz

参考:
https://docs.npmjs.com/cli/v10/commands/npm-pack
https://docs.npmjs.com/cli/v10/commands/npm-install
https://pnpm.io/zh/cli/pack
https://pnpm.io/zh/cli/install
https://yarnpkg.com/cli/pack
https://yarnpkg.com/cli/add
恭喜你找到了 React.createElement ,再省略一下每句必带的父组件名,换成 xml 带嵌套写法,恭喜你找到了 jsx
118 天前
回复了 dusu 创建的主题 程序员 nuejs 终将会取代前端的妖魔鬼怪
Angular 使工程化的思想深入人心;
React 使组件化的思想深入人心;
Vue 使响应式的思想深入人心;

这个 nuejs 啥也不是,纯纯的自嗨项目,没有解决任何切实问题,把三大框架已经做好的事情再干一遍。

hot-reloading 这种基础功能拿来当卖点、default unbundled 明显开倒车、2024 年了 TypeSCript Declaretions 也没有、组件模板语法和 Vue 如出一辙那么喜欢 Vue 直接用 Vue 不好吗?
我认为应该根据 key 对 users 做去重。

假如有一个最新用户列表和一个 [加载更多用户] 按钮,页面不按页码分页,每次点击按钮时直接把下一页数据塞进当前列表里。

假如在第一次数据加载后过了一段时间再去点击 [加载更多用户] ,在这一段时间内可能会新的用户,此时用户列表内的 key 就会碰撞。

举例来说,假如每页取 3 项:
第一次加载第一页用户为: [张三, 张四, 张五];
新用户张一、张二注册,此时数据库中最新的 6 个用户为: [张一, 张二, 张三, 张四, 张五,张六];
第二次加载第二页用户为: [张四, 张五, 张六],此时前端用户列表为 [张三, 张四, 张五, 张四, 张五,张六] ,其中 张四, 张五 为重复数据;

既然无法避免重复,那就对列表做去重处理。

```tsx
const fetchUsers = useCallback(async () => {
const page = pageData // 异步获取到数据
setUsers((prevUsers) => {
const newUsers = page.filter(
(user) => !prevUsers.find((u) => u.id === user.id)
)
return [...prevUsers, ...newUsers]
})
}, [])
```
120 天前
回复了 kiddyu 创建的主题 分享创造 Sutando: 把最好用的 ORM 复刻到 Node.js
我来给泼个冷水
2024 年了居然还没有 TypeScript Declaretions
你可以不用 TypeScript 但不能没有 Declaretions
120 天前
回复了 lsk569937453 创建的主题 程序员 现在 flutter 的桌面端都这么成熟了吗?
「综合水平一直是 flutter 最高」这个结论是怎么得出来的?

在我看来 Flutter 自认为的优势也是最大的缺点就是自绘。目前甚至很长的一段时间内自绘的性能/用户体验是比不过原生的。
假如原生的体验是 100 分,那么目前 Flutter 的上限大概只有 90 分,希望 Impeller 完善之后能把上限提高些。反观 React Native 始终使用原生渲染,在 0.68 使用全新的 Fabric 架构解决了 js 通讯瓶颈后,在性能上已经不成问题了,上限可以达到原生的 100 分。

体验一下 V2EX 的 Flutter 客户端和 React Native 客户端,Flutter 版本滑动、翻页的时候存在明显卡顿,RN 的体验明显好得多。
https://github.com/guozhigq/flutter_v2ex
https://github.com/liaoliao666/v2ex
121 天前
回复了 VensonEEE 创建的主题 Java PHP 转 Java ,上千张表需要 CRUD
你可能需要低代码框架:不生成代码,直接启动数据库的 crud 的 GraphQL 接口,后端几乎不用写代码,让前端直接调用 GraphQL 接口。

https://github.com/graphile/crystal
https://github.com/SeaQL/seaography
https://github.com/nocodb/nocodb
https://github.com/nhost/nhost
122 天前
回复了 dc2002007 创建的主题 React react ui 组件库选择
NextUI:漂亮,精准,自定义程度高,细节拉满

https://nextui.org/
你要学的是后端,而不仅仅是 nest.js 。

后端需要掌握的知识点有:数据库(MySQL 、PostgreSQL)、缓存(Redis)、消息队列、高并发、分布式、高可用、微服务等等等。
相比起来,用什么语言的什么框架是相对次要的。

数据库、Redis 、消息队列这些你可以很轻易搜到大把教程,我的建议是直接看官方文档。
https://www.postgresql.org/docs/
https://redis.io/docs/about/

至于分布式、高可用、微服务这些理论的东西。我最开始是直接找 Java 的教程看的,主要是学习一个思想,不是非得按教程来,Java 生态里的工具在 Node.js 里可能有另外的替代。很多 Java 教程涵盖了非常全面的知识点:
https://github.com/Snailclimb/JavaGuide
https://github.com/doocs/advanced-java
https://github.com/Jstarfish/JavaKeeper

还有 nest.js 的文档写的也算比较完善的,对新手也很友好,本身也是 Node.js 生态里的东西。
126 天前
回复了 gitrebase 创建的主题 程序员 大家喜欢用 ORM 还是直接写 SQL
据我观察,大部分 Java 和 Go 开发者对 ORM 无感甚至讨厌 ORM ;而大部分 C#、Node.js 、Ruby 开发者喜欢用 ORM 。
原因其实很简单,C# 的 EF Core 、Node.js 的 Prisma, MikroOrm 、Ruby 的 ActiveRecord 很好用。

一款好的 ORM 应该尽可能提供该语言原生的写法,提供完善的类型安全、提供灵活的 Query Builder 以应对尽量多的 SQL 语法。

Java/Go 生态内缺少用起来顺手的 ORM 。要是 Java 有 EF Core 、Go 有 Prisma ,我相信所有人都会喜欢 ORM 。
后端太菜了,跟领导反应给后端上一些强制性的规范,比如让后端接入 OpenAPI 、或者使用 tRPC 、GraphqL 、gRPC 等强类型 API 来实现接口。

好奇什么样的人用什么样的语言能把布尔值写成 0/1, "on"/"off", 1/0, 1/2 ,直接布尔值不就完事儿了,整这么多损人不利己...
来点新花样: https://lapce.dev/
131 天前
回复了 HXHL 创建的主题 React React 如何通过 Hooks 来封装比较复杂的数据?
@theprimone #2
状态管理主要解决的问题有:
1. 跨组件状态传递
2. 组织 actionsa ,比如 createBook 、updateBook

zustand 强制在 create store 的时候组织 actions: https://docs.pmnd.rs/zustand/guides/updating-state

valtio 很自由,可以用你最熟悉的 js 语法组织 actions: https://valtio.pmnd.rs/docs/how-tos/how-to-organize-actions

Jotai 完全遵守 React Hooks 规则,本身没有组织 actions 的办法。需要使用 React 闭包 + useCallback 来封装 actions ,或者使用 Reducer 。
比如上面的 BookController 按 Jotai 的写法就会变成:
```ts
import { atom } from 'jotai'

const booksAtom = atom<Record<string, Book>>()

function useBooks() {
const [books, setBooks] = useAtom(booksAtom)

const getBooks = useCallback(async () => {
const books = await fetchBooks()
setBooks((prevBooks) => {
const nextBooks = { ...prevBooks }
books.forEach((book) => {
nextBooks[book.id] = book
})
return nextBooks
})
}, [setBooks])

const createBook = useCallback(
async (book: Book) => {
const newBook = await fetch('createBook', { method: 'POST', body: book })
setBooks((prevBooks) => ({ ...prevBooks, [newBook.id]: newBook }))
},
[setBooks]
)

const updateBook = useCallback(
async (id: string, book: Book) => {
// ...
},
[setBooks]
)

return { books, getBooks, createBook, updateBook }
}
```

因为我讨厌 useCallback 以及 Reducer ,所以不推荐 Jotai 。
vs code 能无痛远程开发,本地连环境都不用装,Goland 不能
132 天前
回复了 HXHL 创建的主题 React React 如何通过 Hooks 来封装比较复杂的数据?
你可能需要使用 zustand 或者 valtio 等状态管理库。

我个人是喜欢用 class 封装成 controller 的,然后在组件内使用 valtio 的 proxy 和 useSnapshot 来使用。

```ts
class BookController {
books: Record<string, Book> = {}

async getBooks() {
const books = await fetchBooks()
books.forEach((book) => {
this.books[book.id] = book
})
}

async createBook(book: Book) {
// ...
}
async updateBook(id: string, book: Book) {
// ...
}
}
```

在组件内使用:

```tsx
import { proxy, useSnapshot } from 'valtio'

const YourComponent = () => {
const controller = useMemo(() => proxy(new BookController()), [])
const { books } = useSnapshot(controller)

useEffect(() => {
controller.getBooks()
}, [controller])

const allBooks = Object.values(books)
const oneBook = books['bookId']

return (
<div>
{allBooks.map((book) => (
<div key={book.id}>{book.name}</div>
))}
<button onClick={() => controller.createBook(yourBook)}>创建</button>
</div>
)
}
```

valtio: https://github.com/pmndrs/valtio
zustand: https://github.com/pmndrs/zustand
1  2  3  4  5  6  7  8  9  10 ... 11  
关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   833 人在线   最高记录 6543   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 35ms · UTC 19:56 · PVG 03:56 · LAX 12:56 · JFK 15:56
Developed with CodeLauncher
♥ Do have faith in what you're doing.