React/JSX Code Typing Practice
60
seconds
0
WPM
100%
accuracy
useEffect(() => {}, []); const [state, setState] = useState(); useCustomHook() children: React.ReactNode React.memo(Component) key={item.id} ErrorBoundary import React from 'react'; <></> React.lazy(() => import()) React.FC<Props> useContext(MyContext); export default function App() {} useCallback((e) => {}, []); React.useState<Type>() {items.map(item => <Item />)} dangerouslySetInnerHTML <Component prop={value} /> forwardRef<Ref, Props>() onClick={() => handleClick()} useRef<HTMLDivElement>(null); React.Fragment onSubmit={handleSubmit} useReducer(reducer, initial); Suspense fallback={<Loading />} onChange={(e) => setValue(e.target.value)} <div className="container"> useMemo(() => value, [deps]); ref={inputRef} createContext(defaultValue) useEffect(() => {}, []); const [state, setState] = useState(); useCustomHook() children: React.ReactNode React.memo(Component) key={item.id} ErrorBoundary import React from 'react'; <></> React.lazy(() => import()) React.FC<Props> useContext(MyContext); export default function App() {} useCallback((e) => {}, []); React.useState<Type>() {items.map(item => <Item />)} dangerouslySetInnerHTML <Component prop={value} /> forwardRef<Ref, Props>() onClick={() => handleClick()} useRef<HTMLDivElement>(null); React.Fragment onSubmit={handleSubmit} useReducer(reducer, initial); Suspense fallback={<Loading />} onChange={(e) => setValue(e.target.value)} <div className="container"> useMemo(() => value, [deps]); ref={inputRef} createContext(defaultValue)
Click the text area and start typing to begin
Practice typing React components and JSX syntax