V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
everettjf
V2EX  ›  React

前端新手想问下 React 最能打的组合是什么?

  •  
  •   everettjf ·
    everettjf · Apr 10, 2022 · 7643 views
    This topic created in 1481 days ago, the information mentioned may be changed or developed.

    背景:我是一名移动端开发,会前端的一点皮毛,但困惑很多。

    1. React 状态管理框架这么多,webpack 还是 vite ,ui 组件库也这么多,js 还是 ts ,这一套组合就很多种了。到底哪个最能打(综合实力最强)。
    2. js 还是 ts ,有时候总感觉 ts 写起来复旦很重。

    求前端高手指点

    31 replies    2022-09-06 16:26:36 +08:00
    noe132
        1
    noe132  
       Apr 10, 2022 via Android   ❤️ 5
    用了 ts 后你会发现 js 写起来负担很重
    TWorldIsNButThis
        2
    TWorldIsNButThis  
       Apr 10, 2022   ❤️ 1
    最近搭了一个
    vite + typescript + tailwindcss + swr + antd mobile
    由于没有额外数据的共享所以没用状态管理库,直接 swr 管理请求的数据,其实感觉有点简陋,react-query 可能更好一点
    很多人都提了一些常见的使用问题,官方给的解决方案都是叫你自己写几个工具函数,不像 react-query 都自带了
    另外用的时候 antd mobile 狂发版本,有几个版本跟 vite 不兼容,现在最新版应该没兼容问题了
    而且要在 index.css 手动引入一下 antd mobile 的 global 样式文件,不然没法 treeshaking antd mobile 的样式
    然后 tailwindcss 要把预设 preflight 关掉,不然和 antd mobile 的样式有冲突
    TWorldIsNButThis
        3
    TWorldIsNButThis  
       Apr 10, 2022   ❤️ 1
    另外处理数据的地方尝试了一下 point free style 的 fp ,不用 typescript 估计每个数据处理都得调半天
    AyaseEri
        4
    AyaseEri  
       Apr 10, 2022
    hooks 一把梭
    hunter0122
        5
    hunter0122  
       Apr 10, 2022
    刚学 react ,现在入门 umi 很头大
    MXXXXXS
        6
    MXXXXXS  
       Apr 10, 2022   ❤️ 1
    eslint + prettier + webpack + babel + ts + react(hooks) + styled-components + mobx-state-tree
    nanxiaobei
        7
    nanxiaobei  
       Apr 10, 2022 via iPhone   ❤️ 1
    人生苦短,请用 resso https://github.com/nanxiaobei/resso
    QingStone
        8
    QingStone  
       Apr 10, 2022 via iPhone
    本 Vue 初级开发也有同问题想问🤣,想有空学习下 React
    golangLover
        9
    golangLover  
       Apr 10, 2022 via Android
    react 就沒有能打的
    terranboy
        10
    terranboy  
       Apr 10, 2022
    写多了都一样
    lodisy
        11
    lodisy  
       Apr 10, 2022 via Android   ❤️ 2
    zustand / jotai
    ts
    agdhole
        12
    agdhole  
       Apr 10, 2022
    vite + react + ts + recoil + mui(emotion)
    joshua7v
        13
    joshua7v  
       Apr 10, 2022
    每个人的组合偏好都不一样
    sunwei0325
        14
    sunwei0325  
       Apr 10, 2022
    nextjs, 就跟后端的 springboot 似的
    darkengine
        15
    darkengine  
       Apr 10, 2022
    如果开发需要长期维护的项目,还是选 ts 吧,前期可能痛苦点。
    sickoo
        16
    sickoo  
       Apr 10, 2022
    @sunwei0325 也不完全是,只要我自己没发现
    yolio2003
        17
    yolio2003  
       Apr 10, 2022
    zustand + react-router/remix + next.js
    Chism
        18
    Chism  
       Apr 11, 2022
    我觉得 craco 也是必备的。。
    AsZr
        19
    AsZr  
       Apr 11, 2022   ❤️ 2
    首先工程项目肯定首选 ts ,不要逆趋势,面向简历编程也都要求会 ts 。react 各种组件 hooks 抽离的,你写 js 后面调用你自己都懵逼,要传什么会导致什么结果传个 undefined 会出什么鬼。当然如果你 js 还不熟,去学习吧,基础这个东西,后面都是债。

    webpack / vite 这些是构建环境工具,https://andyyou.github.io/2021/04/25/new-generation-of-build-tools-comparsing/,个人推荐 vite ,在新构建工具中足够流行,对比旧构建工具开发体验更好(配置上 /开发环境速度)

    状态管理方面 https://www.zhihu.com/question/445762769/answer/1744053049 ,其实你现在这个阶段写的那些东西仅需要跨组件通信,你可以先用 useContext 把坑踩一遍

    UI 组件库并没有很多,很多基于 antd 二开的,比如 rsuite 。移动端 UI 组件库更少,antd mobile

    所以你可以 vite 的 react-ts 模板走起,感觉并没什么要组合的 🧐
    bojue
        20
    bojue  
       Apr 11, 2022
    我们项目 Vite + Webpack+ React + Redux + TS + Less + AntD + TSLint + ESLint ,一般项目大同小异
    zooeymango
        21
    zooeymango  
       Apr 11, 2022   ❤️ 1
    感觉现在主流选择的组合其实都挺不错的, 状态管理 react-query+hook 基本可以覆盖大部分用例了, 实在要上可以试试 jotai 这些, 其余的其实都可以, nextjs 、antdpro 的话就完全省事了, 但是 ts 还是必须得上的, 不然写起来心里真的没底你不知道哪里就会冒个错
    ragnaroks
        22
    ragnaroks  
       Apr 11, 2022
    nextjs(webpack) + recoiljs + emotion/react + nexti18n ,样式库就随意了,我都是直接手撸的
    linkopeneyes
        23
    linkopeneyes  
       Apr 11, 2022
    vite ts 状态管理直接 context 自己包一下好了,没必要非得学人家的概念累
    wakarimasen
        24
    wakarimasen  
       Apr 11, 2022 via Android
    选型负担重你转 V 或 A 不就完事了。
    dudubaba
        25
    dudubaba  
       Apr 11, 2022   ❤️ 2
    管理系统:react+ umi + antd/antd-pro +ts
    C 端 :nextjs + mobx + ts
    BFF:nestjs + typeorm
    基本上满足 90%的业务场景了
    Zzzz77
        26
    Zzzz77  
       Apr 11, 2022
    选择困难,或者对生态不熟的话直接 umi 一把梭好了。。后面发现什么地方不合适再替换
    vone
        27
    vone  
       Apr 11, 2022   ❤️ 1
    你作为一个前端新手,建议别碰 TypeScript 。

    如果不是非常必要(收益大于成本),还是不要引入 TypeScript 。

    使用 TypeScript 会增加项目架构的复杂度、额外增加开发负担、如果不能掌握 TypeScript 的正确用法还会被海量的警告淹没、另外如果你开发人员的素质不高,你还能看到一个叫 AnyScript 的新语言。



    其实 JavaScript 这个语言也不是特别烂,项目无法长期维护的原因也大概率不是因为 JavaScript 。
    everettjf
        28
    everettjf  
    OP
       Apr 11, 2022
    非常感谢大家~
    everettjf
        29
    everettjf  
    OP
       Apr 12, 2022
    汇总下

    - vite react-ts
    - nextjs
    - rsuite / mui / antd-pro

    - tailwindcss
    - swr / react-query
    - antd mobile
    - umi
    - mobx
    - resso
    - zustand / jotai
    - react-router/remix
    - nestjs
    luckyc
        30
    luckyc  
       May 5, 2022
    前端的轮子太多了, 全干表示鸭梨很大.
    后端相对就没有那么多重复功能的轮子.
    QKgf555H87Fp0cth
        31
    QKgf555H87Fp0cth  
       Sep 6, 2022
    - Vite
    - GraphQL
    - Next.js
    - Typescript
    - MUI ( Emotion )
    - immer
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2406 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 75ms · UTC 01:40 · PVG 09:40 · LAX 18:40 · JFK 21:40
    ♥ Do have faith in what you're doing.