2024前端,推荐7款值得深入学习的“新贵前端库”(1)

本文探讨了前端工程化的热门话题,包括zx.js如何简化shell脚本编写,Vite作为开发工具挑战Webpack的慢速构建,React和Next.js的合作,以及Tauri和TailwindCSS在跨平台和设计领域的革新。同时强调了自学前端时遇到的问题和实践的重要性。
摘要由CSDN通过智能技术生成

zx

时至今日,前端工程化已经是越来越火热,前端人需要面对的工程化问题也已经越来越复杂,经常出现需要前端研发需要动手写 shell 脚本。

但因为技术栈的关系,脚本质量和开发效率都非常着急。

zx.js 的出现,正是为了解决这一尴尬困境!

不就是 shell 嘛,我用 js 也能写!

#!/usr/bin/env zx

await $cat package.json | grep name

let branch = await $git branch --show-current

await ‘ d e p d e p l o y − − b r a n c h = `dep deploy --branch= depdeploybranch={branch}`

await Promise.all([

$sleep 1; echo 1,

$sleep 2; echo 2,

$sleep 3; echo 3,

])

zx.js 再次向世人证明了一件事:“凡是能用 js 实现的库,那就一定会有人用 js 来实现的。”

如果你也经常有写脚本的需求,那一定不能错过这款 zx !


二、 👑 Vite: 下一代前端工具


Vite 2021年 star 增量 +21.4K

vite

Vite(读音类似于[weɪt],法语,快的意思) 是一个由原生 ES Module 驱动的 Web 开发构建工具。在开发环境下基于浏览器原生 ES imports 开发,在生产环境下基于 Rollup 打包。

虽然 2021 年 webpack 仍然是毫无争议的构建之王,但活跃的前端社区,终于出现了一位 能打 的挑战者。

vite 一出手就直接瞄准了 webpack 最遭人诟病的软肋:“开发时构建实在太慢”。

vite 剑走偏锋,在 dev 时,通过 esbuild 进行 esm 格式进行模块加载,几乎实现了“秒开”的效果。让那些被 webpack 如同蜗牛般开发时构建速度折磨的研发人员直呼“牛哔”。

在生产构建时,vite 则通过对老牌构建工具 rollup 进行了适度封装,降低了普通开发者的介入难度。

无论你是 React 开发者亦或是 Vue 开发者,Vite 都是一款觉得值得尝试的工具。

相信我,你会爱上它的。


三、 👑 React & Next.js: 互相成就的好基友


React 2021年 star 增量 +18.5K

Next.js 2021年 star 增量 +19.7K

react + next

React 是什么就不多介绍了,懂的都懂,让人没想到的是 React 在 2022 实现这么猛的增量。

Next.js 则是基于 React 的一款应用框架,基于 Next.js 你可以更便捷地上手开发 React 应用。

构建脚本、打包命令、开发工具、路由、状态管理、网络请求、SASS/LESS、服务端渲染。

这些你统统都无需再在社区中“选择困难症”了,你可以快速开始开发功能。

Sooooo Coooooool!

虽然 Next.js 基于 React,但是 Next.js 又何尝不是在成就 React 呢?


四、 👑 Tauri: 构建更小更快的跨平台桌面应用


Tauri 2021年 star 增量 +18.0K

Tauri

Tauri 是一个为所有主流桌面平台构建小型、快速二进制文件的框架。开发人员可以集成任何编译成 HTML、 JS 和 CSS 的前端框架来构建他们的用户界面。应用程序的后端是一个 Rust 二进制文件,具有前端可以与之交互的 API。

看到上面这段话,一定有不少人想到了另一个库:electron.js

同样的写 HTML/JS/CSS,同样的跨平台,同样的桌面应用。

Tauri 凭什么在 2022 年异军突起呢?

凭两个杀招:

  1. 更小!它的构建物比 Electron 的构建物更小,因为它放弃了体积巨大的 Chromiumnodejs,前端使用操作系统的 webview,后端集成了 Rust

  2. 更加小!它对内存的开销更加小。

五、 👑 Tailwind CSS: 新时代的“原子类”CSS实用框架


Tailwind CSS 2021年 star 增量 +18.0K

自学几个月前端,为什么感觉什么都没学到??


这种现象在很多的初学者和自学前端的同学中是比较的常见的。

因为自学走的弯路是比较的多的,会踩很多的坑,学习的过程中是比较的迷茫的。

最重要的是,在学习的过程中,不知道每个部分该学哪些知识点,学到什么程度才算好,学了能做什么。

很多自学的朋友往往都是自己去找资料学习的,资料上有的或许就学到了,资料上没有的或许就没有学到。

这就会给人一个错误的信息就是,我把资料上的学完了,估计也-就差不多的了。

但是真的是这样的吗?非也,因为很多人找的资料就是很基础的。学完了也就是掌握一点基础的东西。分享给你一份前端分析路线,你可以参考。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

还有很多的同学在学习的过程中一味的追求学的速度,很快速的刷视频,写了后面忘了前面,最后什么都没有学到,什么都知道,但是什么都不懂,要具体说,也说不出个所以然。

所以学习编程一定要注重实践操作,练习敲代码的时间一定要多余看视频的时间。

  • 22
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值