Skip to content

Instantly share code, notes, and snippets.

Avatar

Pochen Lin nightspirit

  • Everbridge
  • United States
View GitHub Profile
View CounterDisplay.js
import React from 'react'
import { withCounter } from './context'
const Display = ({ counter }) => <h5 className="card-title text-center">{counter.value}</h5>
const CounterDisplay = withCounter(Display)
export default CounterDisplay
View CounterCard.js
import React from 'react'
import CounterDisplay from './CounterDisplay'
import CounterIncBtn from './CounterIncBtn'
import CounterDecBtn from './CounterDecBtn'
const CounterCard = () => (
<div className='Counter card m-3'>
<div className='card-body'>
<CounterDisplay/>
<div className='row'>
View Counter.js
import React from 'react'
import { Provider } from './context'
class Counter extends React.Component {
constructor (props) {
super(props)
this.state = {
counter: {
value: 0,
View testcafe-example.js
import { Selector } from 'testcafe'
fixture `Login`
.page `http://localhost:3000/login`
test('Login with bad credential', async t => {
await t
.typeText('input[name="username"]', 'blah')
.typeText('input[name="password"]', 'blah')
.click('button[type="submit"]')
View Bid, Leaderboard system
# Use ZSET (sorted set) to achieve ranking
###################################
$ ZADD item:1 100 user:1 210 user:2
$ ZADD item:1 300 user:3 350 user:4
$ ZINCRBY item:1 100 user:3
# user:3 400, user:4 350, user:2 210, user:1 100
$ ZREVRANGE item:1 0 0
View tokenReducer.js
import { createReducer } from 'Reducers/helpers'
import merge from 'lodash-es/merge'
const initState = {
accessToken: null,
refreshToken: null
}
// handlers
function set (state, { accessToken, refreshToken }) {
View appReducer.js
import { combineReducers, persistReducer } from 'Reducers/helpers'
import TokenReducer from 'Reducers/Token'
import FeatureReducer from 'Reducers/Feature'
const AppReducer = combineReducers({
token: persistReducer({ key: 'token', storage: localStorage })(TokenReducer),
feature: persistReducer({ key: 'feature', storage: sessionStorage })(FeatureReducer)
})
View app.jsx
import { createContext, useReducer } from 'react'
import AppReducer from 'Reducers/AppReducer'
import { BrowserRouter } from 'react-router-dom'
import Routes from 'Routes'
export const AppReducerContext = createContext()
const initState = AppReducer()
export default function App () {
View Foo.jsx
import { useContext } from 'react'
import { AppReducerContext } from 'app'
export default function Foo () {
const [state, dispatch] = useContext(AppReducerContext)
// can read state or dispatch action to appReducer
return (
...
)
}
View useAppReducer.js
import { createContext, useContext, useReducer } from 'react'
import { combineReducers, persistReducer } from 'Reducers/helpers'
import TokenReducer from 'Reducers/Token'
import FeatureReducer from 'Reducers/Feature'
const AppReducer = combineReducers({
token: persistReducer({ key: 'token', storage: localStorage })(TokenReducer),
feature: persistReducer({ key: 'feature', storage: sessionStorage })(FeatureReducer)
})