来自设计师的第一份吐槽!

其实,事情是酱子的。
本来呢,10.27轮到我发博客了,鉴于我那渣英文,并没有看懂大仙布置的任务。(强行一波解释ヽ(。ゝω・。)ノ )
然后现在我也并没有准备什么设计相关的文章~ 略略略略 ~(◎`・ω・´)
那就发张擎天柱镇楼吧,毕竟大仙发怒的话,擎天柱会帮我收拾他的。(/^▽^)/

以前读到过一个梗,有人问:“你怎么画的画儿吖,教教我呗。”
接下来,我亲自演绎一下。

(首先 ~ 你要打个草稿 ▼ )

继续阅读来自设计师的第一份吐槽!

ctrip-apollo-springmvc客户端使用步骤

官方文档

Java客户端使用指南

一. 引入依赖

<dependency>
        <groupId>com.ctrip.framework.apollo</groupId>
        <artifactId>apollo-client</artifactId>
        <version>1.1.0</version>
    </dependency>

二. 添加配置文件

apollo meta server

1.0.0版本开始支持以下方式配置apollo meta server信息,按照优先级从高到底分别为:
5. 通过app.properties配置文件
可以在classpath:/META-INF/app.properties指定apollo.meta=http://config-service-url

我们采用第5种方式,在resources目录下,添加/META-INF/app.properties,内容为:

app.id=xxx-appid
apollo.meta=http://x.x.x.x:9202
#dev.meta=http://x.x.x.x:9202
#pro.meta=http://x.x.x.x:9204

继续阅读ctrip-apollo-springmvc客户端使用步骤

Linux搭建分布式配置文件中心disconf-web

背景

公司进行分布式改造,由于配置文件是本地配置,造成配置文件修改工作量大,有些参数修改,需要重启应用才能生效。配置文件的查看对比也体验很差,由此引入分布式配置文件管理框架 disconf。

文档

  1. 官网
    https://disconf.readthedocs.io/zh_CN/latest/
  2. github
    https://github.com/knightliao/disconf
  3. 官方demo
    https://github.com/knightliao/disconf-demos-java

disconf简介

disconf-web

统一的配置中心,提供web功能,和管理接口

disconf-client

应用端需要添加的依赖支持,一般指添加了依赖的应用

linux下安装步骤

  1. 下载源码
mkdir disconf
git clone https://github.com/knightliao/disconf.git
  1. 下载安装依赖

– 安装Mysql(Ver 14.12 Distrib 5.0.45, for unknown-linux-gnu (x86_64) using EditLine wrapper)
– 安装Tomcat(apache-tomcat-7.0.50)
– 安装Nginx(nginx/1.5.3)
– 安装 zookeeeper (zookeeper-3.3.3)
– 安装 Redis (2.4.5)
– 安装maven

继续阅读Linux搭建分布式配置文件中心disconf-web

快速解决Vue项目打包样式中静态资源路径问题

最近在使用基于Vue-cli构建的项目中,使用Webpack打包时,在样式表中引入的background-image路径,在生产环境无法显示.

导致该问题是因为:
1. 生产环境路径与开发环境不一致
2. 生产打包后,样式中的相对路径由webpack变为了绝对路径

继续阅读快速解决Vue项目打包样式中静态资源路径问题

linux下zookeeper集群安装配置

官网:http://zookeeper.apache.org/

1下载

wget http://ftp.jaist.ac.jp/pub/apache/zookeeper/zookeeper-3.4.10/zookeeper-3.4.10.tar.gz

2解压

tar -zxvf  zookeeper-3.4.10.tar.gz
  • bin目录
    命令目录,zk的操作命令。
  • conf目录
    配置目录,zk的配置信息。

继续阅读linux下zookeeper集群安装配置

React 学习笔记之 Redux-saga

首先,这个redux-sagaredux-thunk 做的是同样的事情, 就是解决我们在redux中做异步的事情. 但 redux-saga 所涉及到的知识点和代码的复杂程度上都要复杂一些.

redux-saga 是基于ES6 的 Generator来实现的异步请求数据.

这是一个Generator例如:

    function* g() {
        var res = yield 1 + 2
        return res
    }

以上就是一个用同步方式来实现异步请求的Generator 函数. 更多的需要参考其文档. 这里就吧赘述了,因为我们的目的是记录学习 Redux-sagareact中的应用.

继续阅读React 学习笔记之 Redux-saga

React – Redux 学习之Redux-thunk & applyMiddleware

在之前的练习中,我们一直在使用同步的方式进行状态管理, 那么在Redux中,我么如何使用异步的方式进行状态更新呢?
这里需要用到Redux的中间件applyMiddelwareredux-thunk:

首先,我们应该在创建Store的时候注入中间件

import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'

const store = createStore(
    reducers,
    // 注入中间件
    applyMiddleware(thunk)
)

继续阅读React – Redux 学习之Redux-thunk & applyMiddleware

React – Redux 学习之表现组件和容器组件

我们一般会用到 表现组件容器组件.

表现组件

我们一般认为表现组件的目的仅仅是通过获得的Props 来渲染页面.例如我在学习制作一个TodoList时.
Redux在这里维护一个List数组,而我需要通过action来获取该List.
因此我们会有表现组件TodoList, 如下:

import React, { Component } from 'react';
import PropTypes from 'prop-types'
import Todo from './Todo'

class TodoList extends Component {
    render () {
        //
        const todos = this.props.todos
        const { toggleTodo, removeTodo } = this.props.actions
        //
        return (
            
    { todos.map( todo => { return toggleTodo(todo.id)} remove={() => removeTodo(todo.id)} /> }) }
) } } TodoList.propTypes = { todos: PropTypes.array, actions: PropTypes.object } export default TodoList

继续阅读React – Redux 学习之表现组件和容器组件