Skip to content

Instantly share code, notes, and snippets.

View alexmochu's full-sized avatar
🤙
Good Vibes Only!

Karanja Mochu alexmochu

🤙
Good Vibes Only!
View GitHub Profile

Project Setup

Create a directory and run the following command.

npm init 

For this tutorial, I will be adding an index.js file to the src folder, and this will be our entry point. Our file directory should look like this.

@alexmochu
alexmochu / clean_code.md
Created June 15, 2021 07:58 — forked from wojteklu/clean_code.md
Summary of 'Clean code' by Robert C. Martin

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 07:29 — forked from joduplessis/cookie-typescript-utils.ts
Setting, deleting and retrieving cookies in Typescript.
paypal id : mochualex4@gmail.com
import { combineReducers } from '@reduxjs/toolkit'
import clicksReducer from './counter'
const clicks = { count: clicksReducer }
export let rootReducer = combineReducers({
...clicks
})
{
"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",
import React from 'react';
import './App.css';
interface ICounterProps {
value?: number;
onIncrement?: any;
onDecrement?: any;
onIncrementAsync?: any;
}
const Counter: React.FC<ICounterProps> =
import { createSlice, PayloadAction } from '@reduxjs/toolkit';
type CurrentDisplayState = {
clicks: number
}
let initialState: CurrentDisplayState = {
clicks: 0,
}
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)
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',