本文目录一览：
- 1、React.js 究竟解决了什么问题
- 2、next.js cdn部署
- 3、react视频播放器组件
- 4、create-react-app脚手架项目打包CDN部署
- 5、如何评价 React 实现的前端 UI 库 material-ui
React.js 究竟解决了什么问题
React
通常和其他的
JavaScript
框架同时被提及，但是说“React
对比
Angular”却讲不通，因为它们之间是不可比较的。Angular
是一个完整的框架（包括一个
view
层），React
却并不是。这也是
React
很难于理解的原因，它虽然抽离自一个具备完整框架的生态系统中，但仅仅是一个
view
层。
React
提供了模板语法以及一些函数钩子用于基本的
HTML
渲染。这就是
React
全部的输出——HTML。你把
HTML
/
JavaScript
合到一起，被称为“组件”，允许把它们自己内部的状态存到内存中（比如在一个选项卡中哪个被选中），不过最后你只是吐出
HTML。
next.js cdn部署
文档
打包命令中指定环境 REACT_APP_ENV
next.config.js 文件
一种实现方式
在 next.config.js 中添加 env 配置
在需要的地方
next.js官网
react视频播放器组件
通过NPM安装视频反应和对等依赖项
npm install–save video-react react react-dom redux
link rel=”stylesheet” href=”” /(在index.html引入)
import React from ‘react’;
import {Player} from ‘video-react’;
export default (props) = {
return(
Player
playsInline
src=””
/
);
};
如果无法解决你的问题请进入一下链接看是否能有所帮助：
create-react-app脚手架项目打包CDN部署
因为react项目多为SPA项目，用于生产部署时，存在首屏响应过慢导致用户难以忍受等待时间从而流失问题。一般导致首页响应过慢的原因有很多，网络问题是其中之一。本文记录通过七牛云免费CDN部署react项目。
1.create-react-app创建react项目,并启动项目。
2.项目打包。
此时如果只是普通部署，不要求体验效果时，把build文件下的文件拷贝到静态服务器即可。
接下来考虑如何静态文件CDN部署。
3.修改webpack文件，打包文件的引用路径省车过为CDN路径。
1. config文件夹下paths.js（修改pathname为cnd的域名）
2. config文件夹下webpack.config.js 修改output文件名，使用绝对路径。
修改后重新打包，发现index.html中引入css,js的路径皆改成cdn路径。
附加: 上传打包文件至七牛云CDN。（upload.js）
如何评价 React 实现的前端 UI 库 material-ui
非常厉害，做一些功能为主，不需要过多品牌调性的 WebApp
只需要前端+交互就可以快速构建做出非常不错的产品
（icon还是有点点难度，有设计比较专业的人员跟着做产品的质量会更加“产品级”一些）
框架用了很多 MD 的视觉元素，但是还是只是“看着像”，交互，动画世界观之类的实现距离最理想的 MD 还是有差距，不过基本感觉可以忽略不计。
非要挑刺的话，就是 Menu 部分的动画设计感觉有点粗糙，做得不够好（MD 的世界观，所有东西的诞生都是“扩散”出来，而不是“缩放”出来的，还有就是先“慢_快”的缓动做得还是差一点点）
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/191996.html
微信扫一扫 
支付宝扫一扫 