2020 年您应该了解的 React 库
文章首发字个人博客:前端桃园
声明:本文为译文,原文链接:www.robinwieruch.de/react-libra…
React 已经诞生很久了,自从它诞生开始,围绕组件驱动形成了一个非常全面的生态,但是来自其他编程语言或者框架的开发人员很难找到要构建一个 React 系统的所有组件。如果你是来自于像 Angular 这样的框架的开发者,你可能已经习惯了框架包含了所需要的所有功能,
然而对于 React 来说,它的核心并不是完善所有的可选库。 这是优势还是劣势取决于你自己。 当我从 Angular 切换到 React,我绝对经历了它作为 React 的优势。
只有通过 React,您才能使用函数组件和 props 构建组件驱动的用户界面。 它带有一些内置的解决方案,例如,用于本地状态和副作用的 React Hooks。
下面的文章将向您提供一些自己总结的方法,以便从补充库中进行选择,从而构建一个全面的 React 应用程序。
如何开始 React
如果你是一个完全不熟悉 React 的初学者想创建一个 React 项目,加入 React 的世界。有许多工具包项目可以选择,每个项目都试图满足不同的需求。 React 社区的现状是通过 Facebook 的 create-react-app(CRA)。 它提供了一个零配置的设置,并给你一个开箱即用并且简单的启动和运行的 React 应用程序。 所有的工具都对您隐藏起来了,但是最终要由您来更改这些工具。
如果你已经熟悉 React,你可以选择它流行的入门工具包之一: Next.js 和 Gatsby.js。 这两个框架都建立在 React 之上,因此你应该已经熟悉 React 的基本原理。 Next.js 用于服务器端渲染(如动态 web 应用程序) ,Gatsby.js 用于静态站点生成(如博客、登陆页面)。
如果您只是想了解这些初学者工具包是如何工作的,那么可以尝试从头开始设置 React 项目。 你将从一个基本的 HTML 和 JavaScript 项目开始,然后自己添加 React 和它的支持工具。
如果你想选择一个自定义样板项目,试着缩小你的要求。 样板文件应该是最小的,不要试图解决所有问题。 它应该针对你的问题。 例如,gatsby-Firebase-authentication 样板文件只在 Gatsby.js 中为您提供了完整的 Firebase 身份验证机制,但是其他所有内容都被省略了。
建议:
- create-react-app for React beginners/advanced
- Gatsby.js for static websites in React
- Next.js for server-side rendered React
- custom React project to understand the underlying tools
React 状态管理
React 带有内置的 hooks 来管理局部状态: useState、 useReducer 和 useContext。 所有这些都可以在 React 中用于复杂的本地状态管理。 它甚至可以模拟 Redux(Redux 是 React 的一个流行的状态管理库)。
所有 React 的内置 hooks 都非常适合本地状态管理。 当涉及到远程数据的状态管理时,如果远程数据带有 GraphQL 端点,我建议使用 Apollo Client。Apollo Client 的替代方案是 urql 和 Relay。
如果远程数据不是来自 GraphQL 端点,请尝试使用 React 的 Hooks 来管理它。 如果不行,像 Redux 或者 MobX/Mobx State tree 这样的解决方案可能会有所帮助。
如果你想了解更多细节,请访问我的综合状态管理反应教程。
推荐:
- 局部状态: React 的 useState, useReducer, useContext Hooks
- 通过 Graph QL 的远程状态: Apollo Client
- 通过 REST 的远程状态: React Hooks or Redux/MobX/Mobx State Tree
使用 React 路由
路由在 React 中起着重要作用。 毕竟,React 可以帮助您实现在客户端处理路由的单页应用程序。 当介绍一个复杂的路由 的时候,有好几个路由解决方案。 最值得推荐的解决方案是 React Router。
在您引入路由以前,您可以先尝试 React 的条件渲染,它虽然不是路由的合理替代,但是小型应用中以及足够用了。
建议:
- React Router
React 中的样式库
虽然关于 React 样式处理有很多解决方法,但是作为一个 React 初学者,刚开始使用内联样式和基本 CSS 是很好的。
import './Headline.css';
const Headline = ({ title }) =>
<h1 className="headline" style={{ color: 'blue' }}>
{title}
</h1>
虽然内联样式可以用 JavaScript 在 React 中动态地添加样式,但是一个外部的 CSS 文件可以拥有 React 应用程序的所有剩余样式。 一旦您的应用程序增长,还有许多其他样式方案选择。
首先,我建议您研究一下 CSS Modules,将其作为 CSS-in-CSS 解决方案之一。 CSS Modules 受到 create-react-app 的支持,并为您提供了将 CSS 封装到模块中的方法。 这样,它就不会意外地泄漏到其他人的样式中。 尽管应用程序的某些部分仍然可以共享样式,但其他部分不必访问它。 在 React 中,CSS Modules 通常将 CSS 文件与 React 组件文件共存。
import styles from './style.css';
const Headline = ({ title }) =>
<h1 className={styles.headline}>
{title}
</h1>
其次,我想推荐的是被称作为 styled components,作为 React 的 CSS-in-JS 解决方案之一。 这个方法是由一个名为 styled-components 的库提供的,它将样式与 JavaScript 共享到 React 组件的旁边:
import styled from 'styled-components';
const BlueHeadline = styled.h1`
color: blue;
`;
const Headline = ({ title }) =>
<BlueHeadline>
{title}
</BlueHeadline>
第三,我想推荐 Tailwind CSS 作为一个函数式的 CSS 解决方案:
const Headline = ({ title }) =>
<h1 className="text-blue-700">
{title}
</h1>
是否选择 CSS in CSS、 CSS in js 或函数式 CSS 取决于您。 所有的策略都适用于大型的 React 应用程序。
建议:
- CSS-in-CSS with CSS Modules
- CSS-in-JS with Styled Components
- Functional CSS with Tailwind CSS
React UI 库
如果您不想从头开始构建所有必要的 React UI 组件,您可以选择 React UI Library 来完成这项工作。 所有这些都有一些基本的组件,比如按钮,下拉菜单,对话框和列表。 有很多 UI 库可供 React 选择:
- Ant Design
- Chakra UI
- Tailwind UI
- Semantic UI
- Material UI
- React Bootstrap 1. React Bootstrap
React 动画
任何 web 应用程序中的动画都是从 CSS 开始的。 最终你会发现 CSS 动画并不能满足你的需求。 通常开发人员会检查 React Transition Group,这样他们就可以使用 React 组件执行动画。 其他著名的 React 动画库有:
- react-motion
- react-spring
- Framer Motion
- Animated (React Native)
建议:
- React Transition Group
React 可视化和图表库
如果你真的想自己从头开始构建图表,你没办法不去学习 D3 。 这是一个底层的可视化库,它为你提供了创建令人惊叹的图表所需的一切。 然而,学习 D3 是一个完全不同的冒险,因此许多开发人员只是想选择一个 React 图表库,它可以为他们做任何事情,以换取灵活性。 以下是一些流行的解决方案:
- nivo
- Victory
- react-vis
- Recharts
- Chart Parts
React 中的表单库
在 React 中最流行的表单库是 Formik。 它提供了从验证到提交到形成状态管理所需的一切。另外一个选择是 React Hook Form。 如果您开始使用更复杂的表单,这两种方法对于 React 应用程序都是有效的解决方案。
建议:
- Formik
- React Hook Form
React 中的数据获取库
很快,您就必须向远程 API 发出请求,以便在 React 中获取数据。 现代浏览器带有本地获取 API 来执行异步数据请求:
function App() {
React.useEffect(() => {
const result = fetch(my/api/domain)
.then(response => response.json())
.then(result => {
// do success handling
// e.g. store in local state
});
setData(result.data);
});
return (
...
);
}
基本上,你不需要添加任何其他库来完成这项工作。 但是,有时候不仅需要提供复杂的异步请求,还需要它们具有更强大的功能,而且只是一个轻量级的库。 我推荐的这些库之一称为 axios。 当您的应用程序增大时,可以使用它来代替本地获取 API。
如果您有足够的时间来处理 GraphQL API,我建议您使用 Apollo Client。 可供选择的 GraphQL 客户端将是 urql 或 Relay。
建议:
- 浏览器的本地 fetch API
- axios
- Apollo Client
React 类型检查
幸运的是 React 有自己的类型检查能力。 使用 PropTypes,你可以为你的 React 组件定义传入的 props。 无论何时向组件传递了错误的类型,在运行应用程序时都会收到错误消息。 但是这种形式的类型检查只应该用于较小的应用程序。
import PropTypes from 'prop-types';
const List = ({ list }) =>
<div>
{list.map(item => <div key={item.id}>{item.title}</div>)}
</div>
List.propTypes = {
list: PropTypes.array.isRequired,
};
在较大的 React 应用程序中,TypeScript 为整个应用程序增加了类型安全性,而不是使用 React PropTypes。 当使用这样的类型检查器时,您可以在开发期间获得错误。 您不必启动应用程序就可以找到本可以通过这种类型检查防止的 bug。 这样一来,类型检查器就可以提高您的开发人员体验,避免首先引入 bug。
建议:
- TypeScript
React 代码风格
对于代码风格,基本上有三个选项可以用的。
第一种方法是遵循一个被社区所接受的风格指南。 一个流行的 Airbnb 开源的React style guide 。 即使你没有刻意遵循这些样式指南,但是读一读它们,在 React 中获得常见代码样式的要点是有意义的。
第二种方法是使用 linter,比如 ESLint。 虽然样式指南只给出建议,但是 linter 在应用程序中强制执行这个建议。 例如,你可以要求遵循流行的 Airbnb 样式指南,你的 IED/编辑器会告诉你每一个错误。
第三种也是最流行的方法是使用 Prettier。 它是一个强制的代码格式化程序。 您可以将其集成到编辑器或 IDE 中,使其在每次保存文件时格式化您的代码。 也许它并不总是符合您的口味,但至少您不必再担心自己或团队代码库中的代码格式。 虽然 Prettier 不能取代 ESLint,但是它与 ESLint 的集成非常好。
建议:
- ESLint
- Prettier
React 认证
在较大的 React 应用程序中,您可能希望引入具有注册、登录和退出功能的身份验证。 此外,密码重置和密码更改功能往往是需要的。 这些特性远远超出了 React,因为后端应用程序为您管理这些事情。
通常的方法是使用自定义身份验证实现自己的自定义后端应用程序。 如果您不想启动自己的身份验证,可以考虑类似 Passport.js 的东西。
如果你根本不想关心后端,以下三种解决方案可能适合你:
- Firebase
- Auth0
- AWS Cognito
如果您正在寻找身份验证 + 数据库的一体化解决方案,请坚持使用 Firebase 或 AWS。
建议:
- DIY: Custom Backend
- Get it off the shelf: Firebase
React 主机
您可以像其他 web 应用程序一样部署和托管 React 应用程序。 如果你想拥有完全的控制权,选择像Digital Ocean这样的。 如果你希望有人来处理所有的事情,如果你已经在使用第三方的身份验证/数据库,Netlify 是一个很受欢迎的解决方案,比如 Firebase,你可以检查他们是否也提供主机服务(比如 Firebase Hosting)。 您还可以使用 S3的静态站点与 Cloudfront 一起托管。
React 测试
如果您想深入了解 React 中的测试,请阅读以下内容: How to test components in React。 要点如下: 测试 React 应用程序的主干是 Jest。 它提供了测试运行程序、断言库和监视(spying)/模拟(mocking)/stubbing 功能, 一个全面的测试框架中需要的所有东西。
至少,您可以使用 React-test-renderer 在 Jest 测试中渲染 React 组件。 这已经足以用 jest 来执行所谓的快照测试了。 快照测试的工作方式如下: 运行测试之后,将创建 React 组件中渲染的 DOM 元素的快照。 当您在某个时间点再次运行测试时,将创建另一个快照,用作前一个快照的差异。 如果 diff 不完全相同,则 Jest 将报错,您要么必须接受快照,要么必须更改组件的实现。
最终,您会发现自己在使用 Enzyme 或 React Testing Library (这两个都在 Jest 测试环境中使用)来进行更详细的测试功能集。 这两个库使得在 HTML 元素上呈现组件和模拟事件成为可能。 然后,Jest 用于 DOM 节点上的断言。
如果您正在为 React-to-end (E2E)测试寻找测试工具,Cypress 是最受欢迎的选择。
建议:
- Unit/Integration/Snapshot Tests: Jest + React Testing Library
- E2E Tests: Cypress 2e test: Cypress
用于 React 的工具库
Javascript 为处理数组、对象、数字、对象和字符串提供了大量内置功能。 React 中最常用的 JavaScript 内置功能之一是内置 map()
数组。 为什么? 因为您总是必须呈现组件中的列表。 由于 JSX 是 HTML 和 JavaScript 的混合物,所以您可以使用 JavaScript 在数组上进行映射并返回 JSX。 使用 React 创建列表组件变得简单:
const List = ({ list }) =>
<div>
{list.map(item => <div key={item.id}>{item.title}</div>)}
</div>
但是,您可能需要选择一个实用程序库来提供更详细的功能。 您甚至可能希望在将这些实用函数链接起来时更加灵活,甚至可以将它们动态地组合在一起。 这时,您将引入一个实用程序库: Lodash 或 Ramda。 对于每一个 JavaScript 开发者来说,Lodash 是一个更加实际的库,而 Ramda 在函数式编程中有一个强大的核心。 请记住,现代 JavaScript 提供了很多开箱即用的特性,现在使用实用程序库的必要性已经降低了。
建议:
- JavaScript
- Lodash
react 和不可变的数据机构
原生 JavaScript 提供了大量内置工具来处理数据结构,就像它们是不可变的一样。 但是,如果您和您的团队认为有必要实施不可变的数据结构,最流行的选择之一是 Immer。 就我个人而言,我不使用它,但是任何时候有人问到 JS 中的不变性(immutability),大家都会指出 Immer,并且这可以加上 redux 或 React hooks。
React 国际化
当涉及到 React 应用程序的国际化 时,您不仅需要考虑翻译,还需要考虑多元化、日期和货币的格式化,以及其他一些事项。 以下是最受欢迎的处理该问题的库:
- react-i18next
- react-intl
- LinguiJS
- FBT
建议:
- react-i18next
React 富文本编辑器
当涉及到在 React 中的富文本编辑器时,我只能想到以下内容,因为我没有在 React 中使用任何其他内容:
- Draft.js
- Slate
React 中的支付
和其他网络应用一样,最常见的支付提供商是 Stripe 和 PayPal。 两者都可以整齐地集成到 React 中。
- PayPal
- Stripe Elements 或 Stripe Checkout
React 中的时间
如果你的 React 应用程序正在处理大量的日期和时区,你应该引入一个库来为你管理这些事情。 最受欢迎的库是 moment.js。 更轻量级的替代品是 date-fns 和 Day.js。
Reac 桌面应用
Electron 是跨平台桌面应用程序的首选框架。 不过,也有其他选择,例如:
- NW.js
- Neutralino.js
React 的移动开发
我想把 React 从网络带到移动设备的首选解决方案仍然是 React Native。 如果您是 React Native 开发人员,想要创建一个 Web 应用程序,您应该查看 React Native Web。
REACT VR/AR
实话说,我们很有可能用 React 深入虚拟现实或者增强现实中,我没有使用过这些库中的任何一个,但是它们是我在谈到 React AR/VR 时从大脑闪过的就是:
- React 360
- react-viro
- react-native-arkit
为 React 设计原型
如果您来自 UI/UX 背景,那么您可能希望使用一个工具为新的 React 组件、布局或 UI/UX 概念进行快速原型设计。 我以前用过 Sketch,但最近转到了 Figma。 尽管我两者都喜欢,但我现在并不后悔使用 Figma。 另一个流行的工具是 Framer。
为 React 书写文档
如果你负责为你的软件、 UI 库或者其他东西编写文档,那么你可以使用一些简洁的 React 文档工具。 我已经广泛地使用了 Storybook,我可以说他非常好用,但是我也听说了其他解决方案的好处:
- Styleguidist
- docz
- Docusaurus
总结
所以最终,React 生态系统可以看作是一个 React 的框架,但它保持灵活性。 它是一个灵活的框架,您可以自己决定选择哪些库。 您可以从小型开始,只添加库来解决特定的问题。 当应用程序增长时,您可以沿途扩展构建块。 否则你可以通过使用普通的 React 来保持轻量级。 因此,这里再次列出了可以补充 React 作为应用程序关于不同项目大小的核心的库。 请记住,这个列表是我的个人看法,我也渴望得到你的反馈。
小型应用程式
- 样板: create-react-app
- 样式库: basic CSS and inline style
- 异步请求: fetch or axios
- 代码风格: 无
- 类型检查: 无
- 状态管理: React Hooks
- 路由: 无 or React Router
- 身份验证: Firebase
- 数据库: Firebase
- UI 库: none
- 表单库: 无
- 测试库: Jest
- 实用程序库: JavaScript
- 国际化: react-i18next
- React 桌面: Electron
中型应用
- 样板文件: Next.js or Gatsby.js
- 样式库: CSS Modules or Styled Components
- 异步请求: fetch or axios
- 代码风格: Prettier,ESLint
- 类型检查: 无 或 TypeScript
- 状态管理: React Hooks and/or Apollo
- 路由: React Router
- 身份验证: Firebase
- 数据库: Firebase
- Ui 库: none 或 UI 组件库
- 表单库: none 或 Formik 或 React Hook Form
- 测试库: Jest with React Testing Library
- 实用程序库: JavaScript
- 国际化: react-i18next
- React 桌面: Electron
大型应用程序
- 样板文件: Next.js, Gatsby.js, custom setup
- 样式库: CSS Modules or Styled Components
- 异步请求: axios 或 Apollo Client
- 代码风格: Prettier,ESLint
- 类型检查: TypeScript
- 状态管理: React Hooks and/或者 Apollo/Redux/MobX
- 路由: React Router
- 认证: Node.js 服务 + Passport.js
- 数据库: 自己用SQL/NoSQL DB 提供 Node.js 服务
- Ui 库: UI 组件库或者您自己的 UI 组件
- **表单库:**none 或者 Formik 或者 React Hook Form
- 测试库: Jest with React Testing Library and Cypress
- 实用程序库: JavaScript 的 api,Lodash
- 国际化: react-i18next
- React 桌面: Electron
以前的建议是个人的。 您可以为理想的 React 应用程序选择自己的灵活框架。 每一个“理想”的 React 设置都是主观的,取决于开发人员和项目的需求。 毕竟,没有理想的 React 应用程序设置。
后记
我是桃翁,一个爱思考的前端er,想了解关于更多的前端相关的,请关注我的公号:「前端桃园」,如果想加入交流群关注公众号后回复「微信」拉你进群
上一篇: 百鸡问题
下一篇: 异步/等待原则和执行顺序分析
推荐阅读
-
2020 年您应该了解的 React 库
-
它是 Pinia 的 React 版本,是您应该选择的 React 状态管理库!
-
41 个下载免费 3D 模型的最佳网站-使用说明:使用权限可能因型号而异。因此,在下载文件之前,请仔细检查每个下载页面上的许可证和使用权限。 17. Clara.io Clara.io 是一个创建 3D 内容的全球平台,也是一个培养新 3D 艺术家的社区。Clara.io 提供+100,000个免费的3D模型,包括OBJ,Blend,STL,FBX,DAE,Babylon.JS,Three.JS格式,用于 Clara.io,Unity 3D,Blender,Sketchup,Cinema 4D,3DS Max和Maya。 使用说明:免费,标准和专业帐户仅供个人使用,如果您需要将 clara.io 用于商业用途,请与销售团队联系。 18. 3DExport 3DExport是一个市场,您可以在其中购买和销售用于CG项目的3D模型,3D打印模型和纹理。它提供15 +不同的3D格式供下载,如3DS MAX(.max),Cinema4D(.c4d),Maya(.mb,.ma),Lightwave(.lwo),Softimage(.xsi),Wavefront OBJ(.obj),Autodesk FBX(.fbx)等。它还提供15种不同的语言! 使用说明:免费下载仅供个人和非商业用途。 19. 3D Warehouse 3D Warehouse是一个开放的库,允许用户共享和下载SketchUp 3D模型,用于建筑,设计,施工和娱乐!任何人都可以免费制作,修改和重新上传内容到3D仓库,您可以找到任何您能想到的东西,如家具,电子产品,室内产品等。 使用说明:3D Warehouse中的所有模型都是免费的,因此任何人都可以下载文件以用于SketchUp甚至其他软件,如AutoCAD,Revit和ArchiCAD。 20. CadNav.com CadNav是CGI平面设计师和CAD / CAM / CAE工程师的在线3D模型库,我们提供超过50000 +免费3D模型和CAD模型下载。在CadNav网站上,您可以下载高质量的多边形网格3D模型,3D CAD实体对象,纹理,Vray材料,3D作品,CAD图纸等。 使用说明:免费下载仅供个人和非商业用途。 21. All3dfree.net 就像网站名称一样,它提供免费的3D模型,还包括Vray材料,CAD块,2d和3d纹理集合,无需注册即可免费下载。它是不断更新的,因此您可以查找或请求3DS,MAX,C4D,skp,OBJ,FBX,MTL等格式的模型。 使用说明:所有资源均不允许用于商业用途,否则您将承担责任。 22. Hum3D 自2005年以来,Hum3D帮助来自3多个国家的80D艺术家节省3D建模时间,并制作逼真的3D模型,用于电影,视频游戏,AR应用程序和可视化。所有模型均由首席3D艺术家进行验证,他们检查其是否符合专业要求和最新的3D建模标准。 使用说明:免费下载仅供个人和非商业用途。 23. Artist-3D.com 艺术家-3D 库存的免费 3D 模型下载按通用类别排序。它为人体解剖学、汽车、家具、火箭、卫星等模型提供 AutoDesk 3DS Max 格式。您还可以在浏览他们的网站时找到教程和类似类型的建模。 使用说明:使用权限可能因型号而异。因此,在下载文件之前,请仔细检查每个下载页面上的许可证和使用权限。 24. Free the models 就像本网站的标题一样,它为3d应用程序和3d游戏引擎提供免费的内容模型。您可以为您的任何项目找到许多有趣且有用的模型!它提供3ds,wavefront,bryce,poser,lightwave,md2和unity3d格式的模型。还有一个很棒的纹理集合,可以在您最喜欢的建模和渲染程序中使用。 使用说明:您从这里下载的所有内容都可以免费使用,除非它不能包含在另一个免费的网络或CD收藏中,也不能单独出售。否则,您可以在商业游戏,3D应用程序或渲染作品中使用它。您不必提供信用,但如果您这样做,那就太好了。 25. Resources.blogscopia 本网站由一家名为Scopia的公司创建。他们制作3D图像和视频,您可以找到许多为CGI工作的信息架构设计的模型,所有这些都可以在现实生活中使用。您可以免费下载它们,但是,如果您想一次下载它们,您可以支付 3 到 9 欧元。 使用说明:您可以免费下载模型部分的所有文件。每个压缩文件都包含您也可以在此处找到的许可证。基本上,您可以对文件执行任何操作。唯一的限制是不归属于Scopia的重新分发。 26.ambientCG 1000+公共领域PBR材料适合所有人!环境CG是使用许多不同的方法和资产类型创建的,例如照片纹理(PBR),贴花(PBR),图集(PBR),照片纹理(普通),物质存档(SBSAR),雕刻画笔,3D模型和地形。您可以在所有项目中*使用它们! 使用说明:在 ambientCG 上提供下载的所有 PBR 材料、画笔、照片和 3D 模型均根据知识共享 CC0 1.0 通用许可提供。您可以复制、修改、分发和执行作品,即使是出于商业目的,也无需征得许可。信用将不胜感激。 不要满足于平庸的大理石纹理 - 立即使用我们的免费PBR大理石纹理升级您的3D设计。 27.Pixar One Twenty Eight 这是一个提供官方动画行业经典纹理的网站:皮克斯,创建于 1993 年,该纹理库包括 128 个重复纹理,现在免费提供。 它包含您来到的纹理,包括砖块和动物毛皮。肯定会有一些你可以使用的东西。 使用说明:皮克斯动画工作室的《Pixar One Twenty Eight》根据知识共享署名4.0国际许可协议进行许可。即使出于商业目的,您也可以重新混合、调整和构建您的作品,只要您以相同的条款对新创作进行信用和许可。 访问数以千计的免费纹理并提升您的设计游戏 - 立即开始下载! 28. 3DXO 即使有近 620 个免费贴纸可供下载,3DXO 也不是最大的资源,但它的内容非常有用,不需要注册。无论是简单的墙壁或地板,还是一些奇怪的小东西,您都需要的纹理都可以在此网站上看到。 使用说明:使用权限可能因型号而异。因此,在下载文件之前,请仔细检查每个下载页面上的许可证和使用权限。 29. 3DModelsCC0 3DModelsCC0 与其他产品的不同之处在于它包含超过 250+ 个高质量 3D 模型,并且本网站上的所有内容都是免费的,完全是公共领域!使用我们的模型时无需信用或归属! 使用说明:为每个人提供完全免费的公共领域内容。 30.Sketch up texture club Sketchup Texture Club是一个非营利性的教育和信息门户网站,由3D社区的图像促进协会管理,特别强调面向学生和建筑和室内设计专业人士的可视化和渲染技术,以及所有正在学习3D可视化的人。 使用说明:您无需支付版税或使用费。纹理可以免费下载和使用。不允许将纹理作为竞争产品出售或重新分发,即使图像被修改也是如此。 31. FlippedNormals FlippedNormal 是一个提供计算机图形和 3D 资产的市场,您可以找到许多用于雕刻、建模、纹理、概念艺术、3D 模型、游戏资产或课程的高级资产! 使用说明:使用权限可能因型号而异。因此,在下载文件之前,请仔细检查每个下载页面上的许可证和使用权限。 32. NASA 3D NASA 3D网站是一个在线门户,提供与太空和各种NASA任务相关的大量三维模型和模拟。该网站是用户友好的,并提供有关每个型号的详细信息。该网站允许用户探索和下载几种不同格式的模型,包括 OBJ、STL 和 FBX,只需单击下载按钮即可。 使用说明: 要下载模型,只需单击模型页面上的下载按钮并选择所需的格式。 33. 3DAGOGO (Astroprint) 3DAGOGO 是一个提供广泛 3D 模型的网站,包括角色、车辆和建筑物。3DAGOGO 的独特功能之一是它专注于适合 3D 打印的模型,使其成为希望创建物理原型或模型的设计师的绝佳资源。要使用 3DAGOGO,设计师只需在网站上搜索他们正在寻找的模型类型,然后下载 STL 格式的文件。 使用说明: 要使用 3DAGOGO,只需搜索所需的 3D 模型类型并下载 STL 格式的文件。根据需要自定义模型,并确保在将其用于商业目的之前检查使用权限。 34. FreeCAD FreeCAD是一款了不起的3D建模软件,可让您在计算机上创建令人难以置信的3D设计。该软件可免费下载和使用,它提供了广泛的工具和功能,可用于创建用于各种目的的3D模型。 该网站易于浏览,您可以找到开始使用FreeCAD的所有必要信息。此外,该网站还提供一系列教程和指南,可帮助您了解 3D 建模的来龙去脉。 使用说明: 要下载模型,请访问网站并从库中选择所需的模型。该网站还提供了一系列使用该软件的教程和指南。 35. Pinshape Pinshape是一个提供一系列3D打印模型的网站。网站上提供的型号质量很高,因此您可以确保您的最终印刷产品看起来很棒。该网站提供了广泛的模型,包括从家居用品到小雕像和珠宝的所有物品。 但这还不是Pinshape所能提供的全部!该网站还允许用户上传和共享自己的3D模型。这意味着您不仅可以下载出色的模型,还可以通过分享自己的设计为社区做出贡献。此外,Pinshape 提供了一系列自定义选项,因此您可以调整和调整模型以满足您的特定需求。 使用说明: 要下载模型,请在网站上创建一个帐户,搜索所需的模型,然后单击下载按钮。该网站还为每种型号提供了一系列定制选项。 36.Yeggi Yeggi 提供了大量免费的 3D 模型,您可以下载各种格式的模型,例如 STL、OBJ 和 FBX。该网站易于使用,您可以按关键字、类别或特定网站搜索模型。 Yeggi 对于任何寻找 3D 模型的人来说都是一个很好的资源。它提供了大量的模型集合,从日常物品到复杂的机械,以及介于两者之间的一切。该网站的收藏量在不断增长,每天都有新的型号增加。 使用说明: 要下载模型,请在网站上搜索所需的模型,然后单击下载按钮。该网站还提供指向托管模型的原始网站的链接。 37. Open3DModel 来自开放3D模型的图像 Open3DModel具有各种类别的模型,包括建筑,车辆和角色。无论您需要建筑物,汽车还是人的3D模型,都可以在此网站上找到。 该网站易于浏览,您可以按类别或关键字搜索模型。每个模型都附带预览图像和详细信息,例如文件格式、大小和多边形数量。此信息可以帮助您选择适合您需求的模型。 使用说明: 要下载模型,请访问网站,从库中选择所需的模型,然后单击下载按钮。 使用最好的 3D 资产管理工具简化您的 3D 制作流程。立即试用它们,将您的 3D 项目提升到一个新的水平! 38. 3DExport 对于那些为其 3D 设计项目寻找 3D 模型、纹理和其他资源的人来说,该平台是一个很好的资源。该网站有大量模型可供选择,包括 3D 打印对象、游戏资产等。用户可以按类别、文件格式或价格范围浏览,以找到适合其项目的完美资源。此外,3DExport 还提供一系列教程和其他 3D 资源,以帮助用户提高技能并创建更令人印象深刻的设计。 使用说明: 要使用 3DExport,只需创建一个帐户并浏览可用型号。您可以按类别、格式和价格进行搜索,以找到所需的型号。找到喜欢的模型后,只需下载它并开始在您的项目中使用它。 39.Blend Swap Blend Swap是一个社区驱动的市场,提供与Blender软件兼容的各种免费3D模型。该平台允许用户共享和下载模型、纹理和其他资产,以便在他们的项目中使用。 使用说明: 创建免费帐户后,您可以浏览社区上传的大量3D模型。当您找到要使用的一个时,只需下载它并将其导入您选择的 3D 软件即可。 40. 3DShook 3DShook 是一个高级 3D 模型市场,提供一系列用于建筑、游戏等各个行业的高质量模型。该平台提供基于订阅的模型,具有不同的定价计划,允许用户访问一系列模型。 使用说明: 注册免费帐户后,只需浏览3D模型库,选择您喜欢的模型,然后以您需要的格式下载它们。 41. Smithsonian X 3D 史密森尼 X 3D 对于正在寻找历史文物和文物的高质量 3D 模型的设计师来说,这是一个独特的资源。该平台提供了大量3D模型,这些模型是根据史密森尼博物馆和研究中心中的真实物体扫描创建的。 使用说明: