LocalStorage Counter - React Typing CST Test

LocalStorage Counter — React Code

Persists counter value in localStorage using useEffect.

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

const LocalStorageCounter = () => {
	const [count, setCount] = useState(0);
	useEffect(() => {
		const saved = localStorage.getItem('count');
		if (saved) setCount(parseInt(saved, 10));
	}, []);
	useEffect(() => {
		localStorage.setItem('count', count);
	}, [count]);
	return (
		<div>
		<h2>Count: {count}</h2>
		<button onClick={() => setCount(c => c + 1)}>+</button>
		<button onClick={() => setCount(c => c - 1)}>-</button>
		</div>
	);
};

export default LocalStorageCounter;

React Language Guide

React is a declarative, component-based JavaScript library for building user interfaces, primarily for single-page applications. It allows developers to create reusable UI components and manage application state efficiently.

More React Typing Exercises

Practice Other Languages