Egg+React+Docker
2020-10-15 17:41:35 0 举报AI智能生成
登录查看完整内容
Egg+React+Docker
作者其他创作
大纲/内容
挖坑之路
前端开发
and
react-document-title
classnames
react-container-query
umi
roadhog
next.js
插件
umi-request
dva
redux
redux-saga
react-router
fetch
dva-loading
bable
babel-plugin-dva-hmr
mockjs
Less
CSS
对于大多数元素它们的默认值通常是 block 或 inline 。一个 block 元素通常被叫做块级元素。一个 inline 元素通常被叫做行内元素
当你设置一个元素为 box-sizing: border-box; 时，此元素的内边距和边框不再会增加它的宽度
设置了元素的宽度，实际展现的元素却超出你的设置：这是因为元素的边框和内边距会撑开元素
盒模型
display
block
inline
none
visibility
div 是一个标准的块级元素。一个块级元素会新开始一行并且尽可能撑满容器。其他常用的块级元素包括 p 、 form 和HTML5中的新元素： header 、 footer 、 section 等等。
display:none 通常被 JavaScript 用来在不删除元素的情况下隐藏或显示元素
把 display 设置成 none 元素不会占据它本来应该显示的空间，但是设置成 visibility: hidden; 还会占据空间。
span 是一个标准的行内元素。一个行内元素可以在段落中 <span> 像这样 </span> 包裹一些文字而不会打乱段落的布局。 a 元素是最常用的行内元素，它可以被用作链接。
box-sizing
position
static
relative
fixed
absolute
任意 position: static; 的元素不会被特殊的定位
在一个相对定位（position属性的值为relative）的元素上设置 top 、 right 、 bottom 和 left 属性会使其偏离其正常位置。
一个固定定位（position属性的值为fixed）元素会相对于视窗来定位，这意味着即便页面滚动，它还是会停留在相同的位置。和 relative 一样， top 、 right 、 bottom 和 left 属性都可用。
absolute 与 fixed 的表现类似，但是它不是相对于视窗而是相对于最近的“positioned”祖先元素。
float
Docker
命令
查看已运行的容器
查看已安装的镜像
删除容器
查看容器日志
创建容器
容器开机启动
更新容器配置，例如：CPU、内容、启动配置
进入容器
拉取镜像
搜索容器镜像
search
pull
ps
images
run
-p
--name
指定端口映射，格式："{映射端口：容器端口}"
设置容器名称
rm
logs
update
--restart=always
exec
volume
egg
Router
用户触发动作，支持 get，post 等所有 HTTP 方法
给路由设定一个别名，可以通过 Helper 提供的辅助函数 pathFor 和 urlFor 来生成 URL。(可选)
路由 URL 路径。
在 Router 里面可以配置多个 Middleware。(可选)
指定路由映射到的具体的 controller 上
场景
verb
router.head - HEAD
router.options - OPTIONS
router.get - GET
router.put - PUT
router.post - POST
router.patch - PATCH
router.del
router.redirect
由于 delete 是一个保留字，所以提供了一个 delete 方法的别名。
可以对 URL 进行重定向处理，比如我们最经常使用的可以把用户访问的根目录路由到某个主页。
router-name
path-match
middleware1
controller
app.controller.user.fetch
'user.fetch'
可以简写为字符串形式
直接指定一个具体的 controller
Controller
自定义 Controller 基类
参数验证
获取 HTTP 请求参数
query
body
获取上传的文件
header
Cookie
Session
路由扩展，支持多文件配置。
统一异常处理机制。
egg-sequelize
Sequelize
类型
DOUBLE
安装 sequelize-cli
初始化 Migrations 配置文件和目录
编写项目的第一个 Migration 文件来创建我们的一个 users 表
执行 migrate 进行数据库变更
如果有问题需要回滚，可以通过 `db:migrate:undo` 回退一个变更
可以通过 `db:migrate:undo:all` 回退到初始状态
npm install --save-dev sequelize-cli
npx sequelize migration:generate --name=init-users
npx sequelize init:confignpx sequelize init:migrations
npx sequelize db:migrate
npx sequelize db:migrate:undo
npx sequelize db:migrate:undo:all
parameter
rule（规则）
配置
required
type
convertType
default
int
max
min
number
date
dateTime 或 datetime
id
boolean 或 bool
string
正则表达式
allowEmpty
format
email
password
比较字段以检查是否相等，默认为null，而不检查。
compare
url
enum
values
object
rule
array
缩写
'int'
'int?'
'integer'
'number'
'date'
'dateTime'
'id'
'boolean'
'bool'
'string'
'string?'
'email'
'password'
'object'
'array'
/\\d+/
egg-router-plus
onerror
Linux（CentOS）
Shell
添加用户
设置用户密码
修改目录名称、移动目录，例如：mv /opt /etc/opt ，将/opt目录文件移动到/etc目录下
切换用户，例如：su - root 切换root用户
useradd
passwd
mv
su
工具
打包文件
下载文件
上传文件
解压文件
安装程序
yum
rz
sz
zip
unzip
typescript
开发工具
Sublime Text
Visual Studio Code
Auto Close Tag
Auto Rename Tag
Beautify
DvaJs Snippets
快速创建普通组件
速创建PureComponent组件
快速创建路由页面组件带connect连接
快速创建非路由页面组件带connect连接
快速创建model
快速创建model reducers对象
速创建model reducers 方法
快速创建model reducers 方法
快速创建model effects 对象
快速创建model effects 方法
快速创建services模板
快速创建form post 方法
adcc
adcpc
adcrpc
adcnrpc
admodel
admrd
admrdm
admrd
admef
admefm
adcs
adcsfp
格式化文件格式
vscode-icons
Windows Power Shell
Linux shell
IDEA
New Project
Java
JBoss
Java EE
Thymeleaf
Google App Engine
Groovy
Hibernate
JavaEE Persistence
Kotlin/JVM
OSGi
SQL Support
WebServices Client
Java Enterprise
Clouds
Spring
Java Fx
Android
InteLiJ Platform Plugin
Spring lnitializr
Maven
Gradle
Grails
Application Forge
Kotlin
Static Web
HTML5 Boilerplate
React App
Foundation
Bootstrap
React Native
AngularJS
Angular CLI
Node.js and NPM
nodejs
expressjs
Flash
Empty Project
Javascript
ES6
类，类名称建议首字母大写
Class 的基本语法
extends
constructor
super
继承
构造函数，初始化类私有属性，Super获取父类this私有属性
Promise 对象
Generator 函数的语法
一是，function关键字与函数名之间有一个星号
二是，函数体内部使用yield表达式，定义不同的内部状态
Generator 函数是分段执行的，yield表达式是暂停执行的标记，而next方法可以恢复执行
Iterator 和 for...of 循环
基础类型
Array
find
includes
数组
模块
AMD
RequireJS
可以异步加载JS文件，按照模块加载方法，通过define()函数定义，第一个参数是一个数组，里面定义一些需要依赖的包，第二个参数是一个回调函数，通过变量来引用模块里面的方法，最后通过return来输出。
CMD
SeaJS
是一个同步模块定义，是SeaJS的一个标准，SeaJS是CMD概念的一个实现，SeaJS是淘宝团队提供的一个模块开发的js框架.
CommonJs
NodeJs
npm
开发包
create-react-app
react-app-rewired
构建React脚手架
扩展“create-react-app”脚手架，分离配置信息
npm search
npm install
npm config
npm list
可以通过此命令修改仓储下载地址
devDependencies
dependencies
该模块中所列举的插件属于开发环境的依赖（比如：测试或者文档框架等），通过npm install进行依赖安装时加上-save-dev
该模块中所列举的插件属于生产环境的依赖（程序正常运行需要加载的依赖），通过npm install进行依赖安装时加上-save
yarn
React
JSX
输出标签内容方法
用于组件传入标签参数
React事件绑定属性的命名采用驼峰式写法，而不是小写。
render
props
State
setState({})
setState(()=>{})
生命周期
componentWillUnmount
componentDidMount
事件处理
preventDefault
bind
Cpmponent
ReactDOM.render
class
extends
React.Component
Route
React Router
react-router-dom
BrowserRouter
HashRouter
Link
Switch
渲染与该地址匹配的第一个子节点 <Route> 或者 <Redirect>。
所有位置的基准 URL。 <BrowserRouter basename="/calendar"> <Link to="/today" /></BrowserRouter>，上例中的 <Link> 最终将被呈现为：<a href="/calendar/today" />
<HashRouter> 使用 URL 的 hash 部分（即 window.location.hash）来保持 UI 和 URL 的同步。
redux
使用包含自定义功能的 middleware 来扩展 Redux 是一种推荐的方式
combineReducers 辅助函数的作用是，把一个由多个不同 reducer 函数作为 value 的 object，合并成一个最终的 reducer 函数，然后就可以对这个 reducer 调用 createStore 方法。
把一个 value 为不同 action creator 的对象，转成拥有同名 key 的对象。同时使用 dispatch 对每个 action creator 进行包装，以便可以直接调用它们。
reducer
state
Action
[preloadedState]
enhancer
reducer (Function): 接收两个参数，分别是当前的 state 树和要处理的 action，返回新的 state 树
初始时的 state
Store
getState()
dispatch(action)
subscribe(listener)
replaceReducer(nextReducer)
返回应用当前的 state 树。
分发 action。这是触发 state 变化的惟一途径。
添加一个变化监听器。每当 dispatch action 的时候就会执行，state 树中的一部分可能已经变化。你可以在回调函数里调用 getState() 来拿到当前 state。
替换 store 当前用来计算 state 的 reducer。
combineReducers
reducers (Object)
(Object): 一个对象，它的值（value）对应不同的 reducer 函数，这些 reducer 函数后面会被合并成一个。下面会介绍传入 reducer 函数需要满足的规则。
applyMiddleware
...middlewares (arguments)
...middlewares (arguments): 遵循 Redux middleware API 的函数。每个 middleware 接受 Store 的 dispatch 和 getState 函数作为命名参数，并返回一个函数
bindActionCreators
actionCreators (Function or Object)
dispatch (Function)
一个由 Store 实例提供的 dispatch 函数
compose
(arguments)
需要合成的多个函数
react-redux
<Provider>
connect
mapDispatchToProps(Object or Function)
mergeProps(Function)
options(Object)
connectAdvanced
createProvider
effects
call
put
redux-logger
WebPack
loader
style-loader
css-loader
file-loader
csv-loader
xml-loader
plugins
html-webpack-plugin
clean-webpack-plugin
收藏
0 条评论
回复 删除
下一页
