민지 개발자 성장 일기

보호되어 있는 글입니다.

보호되어 있는 글입니다.

ThemeContext.jsx import React from "react"; const ThemeContext = React.createContext(); ThemeContext.displayName = "ThemeContext"; export default ThemeContext; MainContent.jsx import { useContext } from "react"; import ThemeContext from "./ThemeContext"; function MainContent(props){ const { theme, toggleTheme } = useContext(ThemeContext); return ( 안녕하세요, 테마 변경이 가능한 웹사이트 입니다. 테마 변경 ); } export de..

DOCTYPE html> Document username css .field { position: relative; } .field input { color: #565656; background: none; padding: 0.625rem; border: 2px solid #030104; } .field label{ position: absolute; top: 0; left: 0; translate: 0.625rem 0.625rem; color:#030104; background-color: #efe4f7; padding-inline: 0.25rem; border: 2px solid transparent; pointer-events: none; transition: translate 250ms, back..

보호되어 있는 글입니다.

보호되어 있는 글입니다.

useCounter() 커스텀 훅 만들기 useCounter.jsx import React, { useState } from "react"; function useCounter(initialValue) { const [count, setCount] = useState(initialValue); const increaseCount = () => setCount((count) => count + 1); const decreaseCount = () => setCount((count) => Math.max(count-1, 0)); return [count, increaseCount, decreaseCount]; } export default useCounter; Accommodate.jsx import Reac..

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.