Skip to content

Instantly share code, notes, and snippets.

Avatar
🤙
Good Vibes Only!

Karanja Mochu alexmochu

🤙
Good Vibes Only!
View GitHub Profile
@alexmochu
alexmochu / clean_code.md
Created Jun 15, 2021 — forked from wojteklu/clean_code.md
Summary of 'Clean code' by Robert C. Martin
View clean_code.md

Code is clean if it can be understood easily – by everyone on the team. Clean code can be read and enhanced by a developer other than its original author. With understandability comes readability, changeability, extensibility and maintainability.


General rules

  1. Follow standard conventions.
  2. Keep it simple stupid. Simpler is always better. Reduce complexity as much as possible.
  3. Boy scout rule. Leave the campground cleaner than you found it.
  4. Always find root cause. Always look for the root cause of a problem.

Design rules

@alexmochu
alexmochu / cookie-typescript-utils.ts
Created May 17, 2021 — forked from joduplessis/cookie-typescript-utils.ts
Setting, deleting and retrieving cookies in Typescript.
View cookie-typescript-utils.ts
View rootReducer.tsx
import { combineReducers } from '@reduxjs/toolkit'
import clicksReducer from './counter'
const clicks = { count: clicksReducer }
export let rootReducer = combineReducers({
...clicks
})
View template.json
{
"package": {
"dependencies": {
"@reduxjs/toolkit": "^1.4.0",
"@types/node": "^12.0.0",
"@types/react": "^16.9.0",
"@types/react-dom": "^16.9.0",
"@types/react-redux": "^7.1.9",
"react-redux": "^7.2.0",
"redux": "^4.0.5",
View counter.tsx
import React from 'react';
import './App.css';
interface ICounterProps {
value?: number;
onIncrement?: any;
onDecrement?: any;
onIncrementAsync?: any;
}
const Counter: React.FC<ICounterProps> =
View index.ts
import { createSlice, PayloadAction } from '@reduxjs/toolkit';
type CurrentDisplayState = {
clicks: number
}
let initialState: CurrentDisplayState = {
clicks: 0,
}
View index.tsx
import { all, call, delay, put, takeEvery } from 'redux-saga/effects'
import { addCount } from '../counter';
export function* incrementAsync() {
yield delay(1000)
yield put(addCount(1))
}
export function* watchIncrementAsync() {
yield takeEvery('INCREMENT_ASYNC', incrementAsync)
View app.tsx
import React from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { RootState } from './rootReducer';
import logo from './logo.svg';
import Counter from './Counter';
import { addCount, minusCount } from './counter';
import './App.css';
export const incrementAsync = () => ({
type: 'INCREMENT_ASYNC',
View index.tsx
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import './index.css';
import configureStore from './store'
import App from './App';
import * as serviceWorker from './serviceWorker';
const initialState = {};
const store = configureStore(initialState);