360US | 分享各种编程随笔资源软件等的BLOG

material-ui的makeStyles创建的css样式如何用在class组件里面

material-ui的官方示例css都是用`makeStyles`创建的，用在`function`组件上。但是如果我用的是`class`组件该怎么用呢？答案是用不了。 `makeStyles`只能用在`function`组件上，要在`class`组件上使用需要用`withStyles`。用法如下： ```js import React, { Component } from 'react'; import { withStyles } from '@material-ui/core/styles'; import Button from '@material-ui/core/Button'; const styles = { root: { background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)', border: 0, borderRadius: 3, boxShadow: '0 3px 5px 2px rgba(255, 105...

发布日期： 2020-01-03 分类：前端浏览量： 4507

本地git仓库通过URL远程访问

场景是我们在本地电脑上安装了git，并初始化了一个测试仓库，但是并没有安装`gitlab`这种东西，那我们怎么可以通过`url`来`git pull`和`git push`仓库的内容呢。这里以linux系统为例，在不再多添加其他依赖的情况下操作。测试仓库路径`/home/dev/git/test`，初始化仓库的时候需要初始化成一个裸仓库`git init --bare`，否则需要做一些其他设置才能正常`push`。 1. 和git仓库在同一台电脑上面这种情况可以用`file`协议来操作就可以，`git clone file:///home/dev/git/test`。比如你在本机测试`Jenkins`的时候，配置`Pipeline`的git仓库，就可以这样填写仓库地址：`file:///home/dev/git/test`。 2. 在不同电脑上面操作git仓库这种情况可以用ssh协议来操作，`git clone ssh://dev@192.168.2.199:/home/dev/git/test`，`dev`是登录用户。 `19...

发布日期： 2019-07-22 分类：其他浏览量： 5141

protocol buffers快速入门 - go语言版

protocol buffers（简称**protobuf**）是google搞的，是用来序列化数据的一种数据格式，类似于json、xml等这种。本文其他概念不讲直接讲基本用法了。首先需要定义数据结构，数据结构定义写在一个扩展名是`.proto`的文本文件里面，这个文件叫做`proto`文件。 protobuf的数据叫`message`，每一个消息都是一系列名值对，我们把他叫做`fields`，当然还有更复杂的结构，这就不在这里讨论了。例如： ``` syntax = "proto3"; #版本 package tutorial; #包名 message Person { string name = 1; int32 id = 2; bool has_ponycopter = 3; } ``` `package`包名是为了避免不同项目的名字冲突。上面就是我们定义的数据结构，然后用protobuf的编译器`protoc`去生成指定语言的数据访问代码，提供了简便的方法来操作整个结构的二进制数据。 pr...

发布日期： 2019-06-18 分类：后端浏览量： 3742

CKEditor5 支持上传图片配置（integrate CKFinder with CKEditor 5）

**editor config**： ```javascript ClassicEditor .create( editorElement, { ckfinder: { uploadUrl: '/ckfinder/upload.php' #配置上传地址 } } ) .then( ... ) .catch( ... ); ``` `uploadUrl` response format，服务器响应格式: ```json { "uploaded ": true, "error": { "message": "no error" }, "url": "https://example.com/upload/images/213432434.png" } ``` ```json { "uploaded ": false, "error": { "message": "file extension not allow" ...

发布日期： 2018-11-23 分类： Javascript 浏览量： 6517

RabbitMQ - RPC

利用RabbitMQ来做一个RPC的客户端和服务端。输出斐波那契数列为例子。 rpc_server.php: ```php ...

发布日期： 2018-11-15 分类：其他浏览量： 5150

RabbitMQ - topic (话题)

Routing那一文是日志系统还是有不足的地方，如果我们想既基于选择和发送消息的来源来接收日志呢？比如像Linux的`syslog`一样，可以基于消息的级别（info/warn..）,产生消息的来源（auth/cron）来记录日志。要实行这样的功能，就需要`topic`类型的exchange了。 `topic`类型的exchange，`routing_key`参数值不能随便设置，需要是一个点（`.`）分隔的词列表，词可以随意设置，一般是使用有意义的内容。比如`stock.usd.nyse`，数据长度是最大是255个字符。 `binding key`也是同样的格式，可以有两个特殊的字符： - `*`：匹配单个词。 - `#`：匹配0个或多个词。比如`*.orange.*`、`lazy.#`，这里的词指的是点分隔的完整字符。生产者： ```php ...

发布日期： 2018-11-15 分类：其他浏览量： 4456

RabbitMQ - Routing

接着上篇发布-订阅的日志记录，如果只订阅消息的子集，比如，只记录错误日志到硬盘，全部的消息打印出来，那么就需要用到这里要讲的内容了。 `exchang`的绑定操作可以传递一个叫`routing_key`的额外参数，这里把它称为`binding key`。 ```php $binding_key = 'black'; $channel->queue_bind($queue_name, $exchange_name, $binding_key); ``` `binding key`依赖于`exchange`的类型，`fanout`类型是会忽略这个值的。在日志系统里面，如果需要根据消息级别过滤消息，就是不同的订阅者收到不同级别的错误日志消息会有不同的处理方式。之前用的`fanout`exchange类型就不行了，这个类型只能广播消息，而没有其他的灵活性了。这里的需求需要用`direct`exchange类型来代替，这种类型的算法是消息会推送到`binding key`和`routing key`相同的队列。 > 这里`binding ke...

发布日期： 2018-11-15 分类：其他浏览量： 4782

RabbitMQ - 发布-订阅

一个消息分发给多个消费者，这就叫做发布-订阅模式。作为示例，这里构建一个日志系统，由两部分组成，一个是发送日志消息，另一个是接收和打印。 **exchange** `exchange`就是接收生产者的消息，然后推送给队列的一个东西，类似邮局。 `exchange`有几种类型，`direct`, `topic`, `headers` 和`fanout`。不同的`exchange`类型会有不同的行为，各种类型的使用在后续文章会有介绍，这里我们先只关注最后一种。 `$channel->exchange_declare('logs', 'fanout', false, false, false);` `fanout`类型是广播消息到所有已知的队列。创建一个名字是`logs`的`exchange`。 ```php $channel->exchange_declare('logs', 'fanout', false, false, false); $channel->basic_publish($msg, 'logs'); ``` ...

发布日期： 2018-11-13 分类：其他浏览量： 3162

用Docker快速搭建ELK日志收集系统

我这里说的日志是应用日志，比如Web api 出现的一些异常，错误信息等，收集到一起，方便查询检索。基本架构是，应用把出现的异常错误信息发送到MQ，再存储到数据库，然后提供一个web前端可以查看和检索。 ELK的主要组件如下： - elasticsearch：存储数据的地方 - kibana：可视化数据的web前端 - logstash：数据中转的地方，可以收集数据，过滤转换之后存储起来,输入和输出都可配置，默认是elasticsearch，也可以是其他数据库。 - beats：这个是收集特定数据的一组轻量级工具，可以单独安装用来收集特定数据，比如nginx的日志，系统日志，或者是系统监控信息等，这组工具的信息可以直接写入到`elasticsearch`，也可以通过`logstash`写入。和上面三个工具集成度很高，只需要很少的配置就可以完成收集安装。这里我只是收集应用日志，所以暂时不需要用到`beats`。数据流向图： ![流向图](/upload/image/2018/cb0e6a6b22865cfa8524b91ca0120407....

发布日期： 2018-11-05 分类：数据库浏览量： 3210

使用Nginx做为HTTP负载均衡器

### Nginx支持的负载均衡方案： - 轮训：循环分发请求； - 最少连接：下一个请求会分发给连接数最少的服务器； - ip-hash：用基于ip的hash方法计算来决定使用哪个服务器。 ### 最简单的负载均衡配置 ```nginx http { upstream myapp1 { server srv1.example.com; server srv2.example.com; server srv3.example.com; } server { listen 80; location / { proxy_pass http://myapp1; } } } ``` 测试Nginx是1.10.3版本，系统是ubuntu17.04。默认80端口是主机用来做负载均衡，8080 - 8082三个端口分布做三个服务主机用来测试。在`/etc/nginx/ngin...

发布日期： 2018-11-05 分类：其他浏览量： 7503