DevilKing's blog

How to Learn React: A Five-Step Plan

Step One - React Documentation + Code Sandbox

Code Sandbox

Key Takeaways

• Introducing JSX
• Rendering Elements
• Components and Props
• State and Lifecycle (super important!)
• Handling Events
• Composition vs Inheritance
• Thinking In React

Step Two - React Fundamentals Course

Fundamentals Course

other resource, other2

Key Takeaways

• Re-enforcement of principles from React docs
• Intro to the build tools for React projects, particularly webpack
• Stateless functional components
• Routing (how you navigate from one “page” to the next)
• Fetching async data

Step Three - Read ReactBits

ReactBits

Key Takeaways

• Design Patterns and Techniques (most important tip is probably this)

• Anti-Patterns

• Perf Tips

Facebook came up with an answer to these questions—the Flux architecture. Some time later, Dan Abramov created an implementation of Flux he called Redux.

MobX is recommend

Step Four - Redux Documentation + Redux Video Series

Getting Started with Redux

Key Takeaways

• Three principles of Redux

• Actions

• Reducers

• Data flow

• Usage with React

• Async actions

• Async Flow

• Middleware

Step Five - The Complete Redux Book + Redux Video Series Part 2

Redux Book

Key Takeaways

• Re-enforcement of principles from Redux docs and/or first video series

• Understanding of basic functional programming principles

• Understanding of creating and writing Redux middleware

• Understanding of how to architect a React + Redux application

Other things

Redux Saga middlemare for Redux

Reselect

How We Solved Authentication and Authorization in Our Microservice Architecture

Architecutre

Building Blocks of our authentication/authorization layer

Token Based Authentication

When a user logs in successfully, a jwt is returned. On subsequent requests, the user must attach this token to each request. This is needed so that the api gateway can establish the identity of the user and extract the user’s claims from the token.

Single SignON(SSO)

The way SSO is implemented in our system is simple. When a user logs in for the first time from any frontend app, a cookie called jwt-token gets created on the api-gateway. The cookie’s domain is .andela.com and hence accessible to all andela.com subdomain

针对mobile apps部分

the api-gateway supports passing the jwt via Authorization header as Bearer Tokens

Authentication

The api gateway

Authorization

permissions in authorization service has many to many relationship with roles in user service

权限模型部分

Profiler labels in Go

在Go 1.9中，加入了Profiler labels部分。

CPU profilers collect and output hot spots where the CPU spent most time in when executing

A typical CPU profiler output is primarily reports the location of these spots as function name, source file/line, etc

在以往的Go的调试过程中，性能问题的debug往往是最困难的。

With 1.9, Go is introducing a new feature that allows you to record additional information to provide more context about the execution path.

The runtime/pprof package will export several new APIs to let users add labels

关于打label部分:

1
2
3
4
5
6

labels := pprof.Labels("worker", "purge")
pprof.Do(ctx, labels, func(ctx context.Context) {
    // Do some work...

    go update(ctx) // propagates labels in ctx.
})

采用net/http/pprof来分析相关的性能，

1
2
3
4
5
6
7
8
9

package main

import _ "net/http/pprof"

func main() {
    // All the other code...
    log.Fatal(http.ListenAndServe("localhost:5555", nil))
}

通过

1

$ go tool pprof http://localhost:5555/debug/pprof/profile

首先通过tags区分出相关的path部分

1
2
3
4
5
6
7

(pprof) tags
http-path: Total 80
        70 (87.50%): /messages
        10 (12.50%): /user

worker: Total 158
       158 (  100%): purge

通过相关的filter部分，我们可以仅关注到/user部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14

(pprof) tagfocus="http-path:/user"
(pprof) top10 -cum
Showing nodes accounting for 0.10s, 3.05% of 3.28s total
      flat  flat%   sum%        cum   cum%
         0     0%     0%      0.10s  3.05%  main.generateID.func1 /Users/jbd/src/hello/main.go
     0.01s   0.3%   0.3%      0.08s  2.44%  runtime.concatstring2 /Users/jbd/go/src/runtime/string.go
     0.06s  1.83%  2.13%      0.07s  2.13%  runtime.concatstrings /Users/jbd/go/src/runtime/string.go
     0.01s   0.3%  2.44%      0.02s  0.61%  runtime.mallocgc /Users/jbd/go/src/runtime/malloc.go
         0     0%  2.44%      0.02s  0.61%  runtime.slicebytetostring /Users/jbd/go/src/runtime/string.go
         0     0%  2.44%      0.02s  0.61%  strconv.FormatInt /Users/jbd/go/src/strconv/itoa.go
         0     0%  2.44%      0.02s  0.61%  strconv.Itoa /Users/jbd/go/src/strconv/itoa.go
         0     0%  2.44%      0.02s  0.61%  strconv.formatBits /Users/jbd/go/src/strconv/itoa.go
     0.01s   0.3%  2.74%      0.01s   0.3%  runtime.memmove /Users/jbd/go/src/runtime/memmove_amd64.s
     0.01s   0.3%  3.05%      0.01s   0.3%  runtime.nextFreeFast /Users/jbd/go/src/runtime/malloc.go

当然还有其他的命令

You can also use tagshow, taghide, and tagignore commands as other filtering options. For example, tagignore allows you to match anything but the given regex.

同时，注意pprofutil这个包

半年总结如期而至，晋升这个还是随缘，坚持做最正确的事情，然后等着被开除

• 广告服务架构的事情，主要是在数据上下功夫，包括相关的数据整合，按照hourly 的维度cover所有的维度的数据，本身架构上的改动并不多，codis部分的使用日益成熟

• golang部分，sideproject找了一些，并没有坚持下去。。后期要坚持下去，例如，project52，一定要做完！

• blog部分，有点拖拉，相关的内容还是没有及时填补上，还是要继续坚持下去，技术部分要加强。。

• 算法部分，转化到机器学习上？

• 身体锻炼方面，进入夏天之后，有些懈怠，关于跑步和keep都没有如期进行，这点要警醒。。。你还什么都没有，而且还是那么胖，不能这么懈怠。。。

• 感情上，果然还是傻瓜一样，可能自己有病吧。。随缘，该是你的就是你的，不可强求。。。

• 摄影和吉他方面，感觉莫名地拉下来，这样不行。。。吉他部分，可能要暂停一会，每天回来之后的sideproject要接上，摄影方面，每周学一些课程，起码要把那个课程学习完

• 电影和书方面，豆瓣记录做地还不错，不过看书方面，稍显差了些，后面要加强。。。不能懈怠下去了。。

• 投资上，很快就可以实现自己的一百万的诺言，不过在买房子上，果然是个大坑。。。希望能跨过这个大坑吧。。

上半年的拖延症和懈怠，导致自己很多事情并没有得到好的解决，还是一直拖着。。。后面不能这样了。。放弃一些游戏，逼迫自己放弃懈怠的心理，不要那么颓废，打起精神，关于简历的更新，关于这半年的更新，不能拉下！