Balaganesh Damodaran asleepysamurai

asleepysamurai / TodoContainer.js

Created March 9, 2019 05:43

TodoContainer Function Component

	/**
	* Todo Root Container Component
	*/

	import React, { useReducer, useCallback, useEffect } from 'react';
	import TodoItem from './TodoItem';
	import TodoInput from './TodoInput';

	const generateID = () => {
	return Date.now().toString(36) + '-' + (Math.random() + 1).toString(36).substring(7);

asleepysamurai / TodoContainer.js

Created March 9, 2019 05:42

TodoContainer useEffect

	/**
	* Todo Root Container Component
	*/

	import React, { useReducer, useCallback, useEffect } from 'react';
	import TodoItem from './TodoItem';
	import TodoInput from './TodoInput';

	const generateID = () => {
	return Date.now().toString(36) + '-' + (Math.random() + 1).toString(36).substring(7);

asleepysamurai / useEffectSig.js

Created March 9, 2019 05:41

useEffect Signature

useEffect(enqueuedActionFunction);

asleepysamurai / TodoContainer.js

Created March 9, 2019 05:40

TodoContainer useReducer

	/**
	* Todo Root Container Component
	*/

	import React, { useReducer, useCallback } from 'react';
	import TodoItem from './TodoItem';
	import TodoInput from './TodoInput';

	const generateID = () => {
	return Date.now().toString(36) + '-' + (Math.random() + 1).toString(36).substring(7);

asleepysamurai / useReducerSig.js

Created March 9, 2019 05:40

useReducer Signature

const [state, dispatch] = useReducer(reducerFunction, initialState, stateInitializerFunction);

asleepysamurai / TodoItem.js

Created March 9, 2019 05:39

TodoItem getDerivedStateFromProps

	/**
	* TodoItem Component
	*/

	import React, { useState, useCallback } from 'react';

	function TodoItem({
	id,
	text,
	toggleItemCompleted,

asleepysamurai / TodoItem.js

Created March 9, 2019 05:39

TodoItem useState

	/**
	* TodoItem Component
	*/

	import React, { useState, useCallback } from 'react';

	function TodoItem({
	id,
	text,
	toggleItemCompleted,

asleepysamurai / TodoInput.js

Created March 9, 2019 05:38

TodoInput Function Component

	/**
	* TodoInput Component
	*/

	import React, { useState, useCallback } from 'react';

	function TodoInput({
	onAdd
	}) {
	const [text, setText] = useState('');

asleepysamurai / useCallbackSig.js

Created March 9, 2019 05:37

useCallback signature

const memoizedFunction = useCallback(inlineFunctionDefinition, memoizationArguments);

asleepysamurai / TodoInput.js

Created March 9, 2019 05:36

TodoInput useState

	/**
	* TodoInput Component
	*/

	import React, { useState } from 'react';

	function TodoInput({
	onAdd
	}) {
	const [text, setText] = useState('');