{"id":172,"date":"2026-06-26T13:33:09","date_gmt":"2026-06-26T13:33:09","guid":{"rendered":"https:\/\/aabbee.cafe24.com\/?p=172"},"modified":"2026-06-26T14:02:46","modified_gmt":"2026-06-26T14:02:46","slug":"%ec%bb%b4%ed%8f%ac%eb%84%8c%ed%8a%b8-%eb%8d%b0%ec%9d%b4%ed%84%b0%ea%b4%80%eb%a6%ac","status":"publish","type":"post","link":"https:\/\/coalacoding.com\/?p=172","title":{"rendered":"\ucef4\ud3ec\ub10c\ud2b8-\ub370\uc774\ud130\uad00\ub9ac"},"content":{"rendered":"

3\ucc28\uc2dc \ucef4\ud3ec\ub10c\ud2b8\uc758 props \ub97c \uae30\uc5b5 \ud560 \uac83\uc774\ub2e4.
\nprops\ub780 \ucef4\ud3ec\ub10c\ud2b8 \uac04 \uc8fc\uace0\ubc1b\ub294 \ub370\uc774\ud130\uc774\uba70 \ubd80\ubaa8\uac00 \uc790\uc2dd\uc5d0\uac8c \uc804\ub2ec\ud560\uc218 \uc788\ub2e4\uace0 \ubc30\uc6e0\ub2e4.
\n\uc608\uc2dc\ub85c \uc5ec\ub7ec \uce5c\uad6c\ub97c \ucd08\ub300\ud558\uace0 \ud55c \ud14c\uc774\ube14 \uc704 3\uac1c\uc758 \ub3d9\uc77c\ud55c \uc811\uc2dc\uc5d0 3\uc885\ub958\uc758 \uac01\uae30 \ub2e4\ub978 \uc74c\uc2dd\uc744 \uc804\ub2ec\ud558\ub294 \uc0ac\ub840\ub97c \ub4e4\uc5b4 \uc124\uba85\ud558\uc600\ub2e4.\u00a0\ud83d\udd17\u00a0\uc601\uc0c1\ub9c1\ud06c 18:29<\/strong><\/a>
\n\uadf8\ub9bc 1<\/strong>\u00a0\uc744 \ub9ac\uc561\ud2b8 \ucef4\ud3ec\ub10c\ud2b8\ub85c \uad6c\ud604 \ud560 \uacbd\uc6b0\u00a0\uadf8\ub9bc 2<\/strong>\u00a0\uc758 \uad6c\uc870\uac00 \ub420 \uac83 \uc774\ub2e4.
\n\ud584\ubc84\uac70,\ub538\uae30,\uc0ac\uacfc\ub294 \ucef4\ud3ec\ub10c\ud2b8\ub85c \uc804\ub2ec\ub418\ub294 props \uc989 \uc18d\uc131\uc758 \uac12\uc774 \ub41c\ub2e4.<\/p>\n

\"\"<\/p>\n

\uc774\ubc88 \ucc28\uc2dc\uc758 \ud559\uc2b5 \ub0b4\uc6a9\uc740 \uc544\ub798\uc758 \uadf8\ub9bc\ucc98\ub7fc \uce5c\uad6c\uac00 \uc74c\uc2dd\uc744 \uba39\uc5b4\ubc84\ub838\uc744 \uacbd\uc6b0 \uc774\ub2e4.
\nPlate \ucef4\ud3ec\ub10c\ud2b8\uc758 \ud584\ubc84\uac70\ub77c\ub294 \uac12\uc774 \uc788\ub2e4\uac00 \uc5c6\uc5b4\uc9c0\uac8c \ud558\ub824\uba74 \uc5b4\ub5bb\uac8c \ud574\uc57c \ud560\uae4c?<\/strong><\/p>\n

\"\"<\/p>\n

Plate \ucef4\ud3ec\ub10c\ud2b8\uc758 \ud584\ubc84\uac70\uac00
\n\uc788\ub294 \uc0c1\ud0dc\uc5d0\uc11c \uc5c6\ub294 \uc0c1\ud0dc\ub85c \ubc14\uafb8\uba74
\n\ub41c\ub2e4.
\n\ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0c1\ud0dc\uad00\ub9ac \uc640 \ub77c\uc774\ud504 \uc0ac\uc774\ud074\uc5d0 \ub300\ud574 \uc54c\uc544\ubcf4\uc790<\/strong><\/p>\n

\n

#<\/strong><\/a>1. \uc2dc\uc791\ud30c\uc77c<\/strong><\/h3>\n
\n

\ub9cc\uc57d \uc804\uc2dc\uac04 \ud30c\uc77c\uc774 \uc5c6\uc744 \uacbd\uc6b0 \uc544\ub798\uc758 \ud30c\uc77c\uc744 \ub2e4\uc6b4\ub85c\ub4dc \ud558\uc5ec \uc9c4\ud589\ud55c\ub2e4<\/p>\n<\/blockquote>\n

\uc9c0\ub09c \uc218\uc5c5 \ud30c\uc77c<\/strong><\/a>
\n\ud30c\uc77c\ud65c\uc6a9\ubc29\ubc95<\/strong><\/p>\n

\"\"<\/p>\n

#<\/strong><\/a>2. Component State(\uc0c1\ud0dc\uad00\ub9ac)<\/strong><\/h3>\n

#<\/strong><\/a>2.1. \ud074\ub798\uc2a4\ud615 vs \ud568\uc218\ud615 \uc0c1\ud0dc\uad00\ub9ac<\/strong>
\n\ud074\ub798\uc2a4\ud615 vs \ud568\uc218\ud615 \uc0c1\ud0dc\uad00\ub9ac<\/strong>
\n#<\/strong><\/a>2.2. \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0c1\ud0dc\uad00\ub9ac<\/strong>
\n#<\/strong><\/a>2.2.1. useState()<\/strong>
\n\uacf5\uc2dd\ucc38\uc870\ubb38\uc11c<\/strong>
\n\uc704\uc5d0\uc11c \uc5b8\uae09\ud588\ub4ef \ucef4\ud3ec\ub10c\ud2b8 \ub0b4\ubd80\uc5d0\uc11c A -> B \ub85c \ubcc0\uacbd\ub3fc\uc57c \ud558\ub294 \uac83\ub4e4\uc774 \uc788\ub2e4.
\n\uc608\ub97c \ub4e4\uba74 \uc544\ub798\uc758 \ubc84\ud2bc \ucef4\ud3ec\ub10c\ud2b8\ucc98\ub7fc \ud074\ub9ad\uc2dc \ud14d\uc2a4\ud2b8\uac00 \ub85c\uadf8\uc778 -> \ub85c\uadf8\uc544\uc6c3 \uc73c\ub85c \ubc14\ub00c\ub294 \uacbd\uc6b0\ub97c \uc0dd\uac01\ud574 \ubcfc\uc218 \uc788\ub2e4.<\/p>\n

\"\"<\/p>\n

\uc774\ub7f0 \uacbd\uc6b0\u00a0useState()<\/code>\u00a0\ub77c\ub294 \ub9ac\uc561\ud2b8\uc758\u00a0\ud83d\udd17Hook<\/strong><\/a>\uc744 \uc0ac\uc6a9\ud55c\ub2e4.
\nHook\uc774\ub780 \uac04\ub2e8\ud788 \ub9d0\ud558\uba74 \ub9ac\uc561\ud2b8\uc5d0\uc11c \uc81c\uacf5\ud558\ub294 \uba54\uc11c\ub4dc\uc774\ub2e4.
\n\ub9ac\uc561\ud2b8 v16 \uc774\ud558\uc5d0\uc11c\ub294 \ucef4\ud3ec\ub10c\ud2b8\uc758 \ud615\ud0dc\uc5d0 \ub530\ub77c state \uc640 Hook \uc744 \uad6c\ubd84\ud558\uc600\uc73c\ub098 v16.8\uc774\uc0c1\ubd80\ud130\ub294 useState \ub97c \uc0ac\uc6a9\ud558\uc5ec \ucc98\ub9ac\ud55c\ub2e4.<\/em>
\n\ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c\ub294 useState() \ub77c\ub294 \ud6c5\uc744 \uc0ac\uc6a9\ud558\uc5ec \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0c1\ud0dc\uad00\ub9ac\ub97c \ud55c\ub2e4<\/strong><\/p>\n


\n“`text<\/p>\n

\n\n```text\n<\/code><\/pre>\n
\n<\/code><\/pre>\n
\n<\/code><\/pre>\n
<\/Accordion><\/p>\n
\uae30\ubcf8\ubb38\ubc95<\/strong><\/p>\n
import { useState } from 'react';\nconst [<\uc0c1\ud0dc \uac12 \uc800\uc7a5 \ubcc0\uc218>, <\uc0c1\ud0dc \uac12 \uac31\uc2e0 \ud568\uc218>] = useState(<\uc0c1\ud0dc \ucd08\uae30 \uac12>);\n<\/code><\/pre>\n
#<\/strong><\/a>2.2.1.1. \uce74\uc6b4\ud130\ub97c \ub9cc\ub4e4\uc5b4\ubcf4\uc790-1<\/strong><\/p>\n
    \n
  1. src\/Counter.js \ud30c\uc77c\uc744 \uc0dd\uc131\ud55c\ub2e4.
    \n  Counter.js<\/li>\n<\/ol>\n
    const Counter = () => {\n return (\n \t<>\n \t\t<div>Counter<\/div>\n \t<\/>\n );\n};\nexport default Counter;\n<\/code><\/pre>\n
      \n
    1. Counter \ucef4\ud3ec\ub10c\ud2b8\ub97c App \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \uc784\ud3ec\ud2b8\ud55c\ub2e4.
      \n  App.js<\/li>\n<\/ol>\n
      import Counter from ".\/Counter";\n...\nfunction App() {\n return (\n...\n \t<Counter \/>\n...\n<\/code><\/pre>\n
        \n
      1. Counter \ucef4\ud3ec\ub10c\ud2b8 \uc0c1\ub2e8\uc5d0 useState \uc784\ud3ec\ud2b8\ud55c\ub2e4.useState\ub780 \ub9ac\uc561\ud2b8\uc758 \ud6c5 \uc885\ub958\uc758 \ud558\ub098\ub85c \ub9ac\uc561\ud2b8\uc5d0\uc11c \uc81c\uacf5\ud558\ub294 \ub0b4\uc7a5 \ud568\uc218\uc774\ub2e4.\uc81c\uc774\ucffc\ub9ac\uc758 show(), hide() \uc640 \uc720\uc0ac\ud558\ub2e4.Counter \ucef4\ud3ec\ub10c\ud2b8\uc758 \ub0b4\ubd80\uc5d0 \ucf58\uc194\ub85c\uadf8\ub85c useState \ud568\uc218\uc758 \ubc18\ud658\uac12\uc744 \ucd9c\ub825\ud574\ubcf8\ub2e4.
        \n  Counter.js<\/li>\n<\/ol>\n
        import { useState } from 'react';\nconst Counter = () => {\n console.log(useState());\n...\n<\/code><\/pre>\n
        \n
        useState\ud568\uc218(\ud6c5)\ub97c \ucf58\uc194\ucc3d\uc5d0\uc11c \ud638\ucd9c\uc2dc \ubc18\ud658\ub418\ub294 \uac12\uc774 \uc788\ub294\ub370 \ubc30\uc5f4\uc784\uc744 \uc54c\uc218\uc788\ub2e4.<\/p>\n<\/blockquote>\n
        \ub450\uac1c\uc758 \uac12\uc774 \ubc18\ud658\ub418\uba70 0\ubc88\uc5d0\ub294 \ubcc0\uc218\ub97c \uc120\uc5b8\ud558\uc600\uc73c\ub098 \ucd08\uae30\ud654\ud558\uc9c0 \uc54a\uc558\uc744\ub54c \ubcfc\uc218\uc788\ub294 undefined \uc790\ub8cc\ud615\uc774 \ubcf4\uc774\uace0 1\ubc88\uc5d0\ub294 \ud568\uc218\uac00 \ubcf4\uc778\ub2e4.\n<\/code><\/pre>\n
        \"\"<\/p>\n
        **\ub9ac\uc561\ud2b8\uc758 \ud6c5\uc740 \uc0ac\uc6a9\uc2dc import \ud574\uc57c\ud558\uba70 \ucef4\ud3ec\ub10c\ud2b8 \ud568\uc218\ub0b4\uc5d0 \uc791\uc131\ud574\uc57c \ud55c\ub2e4.**\n<\/code><\/pre>\n
        \n
        #<\/strong><\/a>2.2.1.2. \uce74\uc6b4\ud130\ub97c \ub9cc\ub4e4\uc5b4\ubcf4\uc790-2<\/strong><\/p>\n
          \n
        1. \ubcc0\uc218 num \uc744 \uc120\uc5b8\ud558\uace0 useState\ud6c5\uc744 \ud638\ucd9c\ud558\uba74\uc11c \ucd08\uae30\uac12\uc73c\ub85c 0 \uc804\ub2ec\ud55c\ub2e4.
          \n  Counter.js<\/li>\n<\/ol>\n
          import { useState } from 'react';\nconst Counter = () => {\n let num = useState(0);\n \tconsole.log(num);\n...\n<\/code><\/pre>\n
          \n
          \ucf58\uc194\ub85c\uadf8\uc5d0 num \ubcc0\uc218\uc758 \uac12\uc744 \ud655\uc778\ud558\uba74 undefined \uac00 \uc544\ub2cc 0\uc774 \ud655\uc778\ub41c\ub2e4.<\/p>\n<\/blockquote>\n
          \uc778\ub371\uc2a4\ubc88\ud638 1\ubc88\uc5d0 \ubc18\ud658 \ub418\ub294 \ud568\uc218\ub294 \uc9c0\uae08 \ucd08\uae30\ud654\ud55c \uc774 \ubcc0\uc218\uc758 \uac12\uc744 \uc5c5\ub370\uc774\ud2b8\ud558\ub294 \ud568\uc218\uc774\ub2e4.\n<\/code><\/pre>\n
          \"\"<\/p>\n
            \n
          1. num\uc758 \ubc18\ud658\uac12\uc774 \ubc30\uc5f4\uc774\ubbc0\ub85c \ubc30\uc5f4\ub0b4 \uc6d0\uc18c\ub4e4\uc744 \uac01\uac01 \ubcc0\uc218\uc5d0 \ud560\ub2f9\ud574\ubcf4\uc790
            \n  Counter.js<\/li>\n<\/ol>\n
            ...\nconst Counter = () => {\n let num = useState(0);\n let count=num[0];\n let setCount=num[1];\n console.log(count);\n console.log(setCount);\n...\n<\/code><\/pre>\n
            \n
            \ubcc0\uc218 count \uc5d0\ub294 num \uc758 \uccab\ubc88\uc9f8 \uac12\uc774 \ud655\uc778\ub41c\ub2e4.<\/p>\n<\/blockquote>\n
            \ubcc0\uc218 setCount \uc5d0\ub294 num \uc758 \ub450\ubc88\uc9f8 \uac12\uc774 \ud655\uc778\ub41c\ub2e4.\n<\/code><\/pre>\n
            \"\"<\/p>\n
            \n
            #<\/strong><\/a>2.2.1.3. \uce74\uc6b4\ud130\ub97c \ub9cc\ub4e4\uc5b4\ubcf4\uc790-3<\/strong><\/p>\n
              \n
            1. \uce74\uc6b4\ud2b8\ud568\uc218\ub97c \uc791\uc131\ud55c\ub2e4.
              \n  Counter.js<\/li>\n<\/ol>\n
              ...\nconst updateCount = () => {\n\tsetCount(count + 1);\n};\n...\n<\/code><\/pre>\n
                \n
              1. \ubc84\ud2bc\uc5d0 \uc774\ubca4\ud2b8\ub9ac\uc2a4\ub108\ub97c \uc5f0\uacb0\ud55c\ub2e4. h1<\/code> \uc0ac\uc774\uc758 \ub370\uc774\ud130\ub97c \ubcc0\uc218\ub85c \uc218\uc815\ud55c\ub2e4.<\/li>\n<\/ol>\n
                \"\"<\/p>\n
                `<button onClick={()=>setCount(count + 1)}>\ub354\ud558\uae30<\/button>`\n:::\n<\/code><\/pre>\n
                \n
                #<\/strong><\/a>2.2.1.4. \uce74\uc6b4\ud130\ub97c \uac1c\uc120 \ud574\ubcf4\uc790<\/strong><\/p>\n
                  \n
                1. useState \ud6c5\uc758 \ubc18\ud658\uac12\uc744 \ubcc0\uc218\uc5d0 \ud560\ub2f9 \ubc1b\ub294 \ubd80\ubd84\uc744 \uad6c\uc870 \ubd84\ud574 \ud560\ub2f9 \ubb38\ubc95\uc744 \uc0ac\uc6a9\ud558\uba74 \uac04\uacb0\ud558\uac8c \uc218\uc815\ud560\uc218 \uc788\ub2e4.
                  \n  Counter.js<\/li>\n<\/ol>\n
                  ...\nlet [count, setCount] = useState(0);\n...\n<\/code><\/pre>\n
                    1
                  \n  2
                  \n  3
                  \n                  #<\/strong><\/a>2.3. \ud034\uc988\ud034\uc988<\/strong>
                  \n\uc2e4\ud589\ud654\uba74<\/p>\n
                  \"\"<\/p>\n
                  \uc9c0\uc2dc\ubb38<\/p>\n
                  \ucef4\ud3ec\ub10c\ud2b8\ub97c \uc0dd\uc131\ud558\uc5ec \uc704\uc758 \uadf8\ub9bc\ucc98\ub7fc \ud074\ub9ad\ud558\uba74 \uc0c1\ud0dc\ub97c \uc5c5\ub370\uc774\ud2b8 \ud55c\ub2e4.\n\ud83c\udf54 \ub97c \ud074\ub9ad\ud558\uba74 \ud83c\udf57 \uc73c\ub85c \uc0c1\ud0dc\uac00 1\ud68c \ubcc0\uacbd\ub418\ub3c4\ub85d \ud55c\ub2e4. (\ud1a0\uae00\uc544\ub2d8)\n<\/code><\/pre>\n
                  #<\/strong><\/a>3. Component LifeCycle(\uc0dd\uba85\uc8fc\uae30)<\/strong><\/h3>\n
                  \n
                  \ucef4\ud3ec\ub10c\ud2b8 \ub77c\uc774\ud504\uc0ac\uc774\ud074\uc740 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uc131\ubd80\ud130 \uc18c\uba78\uc5d0 \uc774\ub974\ub294 \uc77c\ub828\uc758 \uc8fc\uae30\ub97c \ub9d0\ud55c\ub2e4.<\/p>\n<\/blockquote>\n
                    \ubaa8\ub4e0 \ub9ac\uc561\ud2b8 \ucef4\ud3ec\ub10c\ud2b8\ub294 Lifecycle\uc744 \uac00\uc9c4\ub2e4.
                  \n  \ub9ac\uc561\ud2b8\uc758 \ucef4\ud3ec\ub10c\ud2b8 \uc720\ud615\ubcc4(\ud074\ub798\uc2a4,\ud568\uc218) \uc0dd\uba85\uc8fc\uae30 \uad00\ub9ac\ubc29\uc2dd\uc758 \ucc28\uc774\uac00 \uc788\ub2e4
                  \n  \uc6b0\ub9ac\ub294 \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uba85\uc8fc\uae30\ub9cc\uc744 \ub2e4\ub8f0 \uac83\uc774\uba70 \ud074\ub798\uc2a4\ud615\uc758 \uc0dd\uba85\uc8fc\uae30\ub294 \uc544\ub798 2.1\uc758 \uc790\ub8cc\ub97c \ucc38\uace0\ud558\ub3c4\ub85d \ud558\uc790.
                  \n                  #<\/strong><\/a>3.1. \ud074\ub798\uc2a4\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc640 \uc0dd\uba85\uc8fc\uae30<\/strong>
                  \n\ud074\ub798\uc2a4\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc640 \uc0dd\uba85\uc8fc\uae30<\/strong>
                  \n1. <\/p>\n
                  \"\"<\/p>\n
                  \"\"<\/p>\n
                  \"\"<\/p>\n
                    \n
                  1. <\/li>\n
                  2. <\/li>\n<\/ol>\n
                    \"\"<\/p>\n
                      \n
                    1. <\/li>\n<\/ol>\n
                      \"\"<\/p>\n
                      \n
                      #<\/strong><\/a>3.2. \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uba85\uc8fc\uae30<\/strong>
                      \n\uc55e\uc11c \uc5b8\uae09\ud588\ub4ef \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uba85\uc8fc\uae30\ub294 \uc0ac\ub78c\uc758 \uc131\uc7a5 \uacfc\uc815 \ucc98\ub7fc \ucef4\ud3ec\ub10c\ud2b8\uac00 \ud654\uba74\uc5d0\uc11c \ub80c\ub354\ub418\ub294 \uc77c\ub828\uc758 \uacfc\uc815\uc744 \uc758\ubbf8\ud55c\ub2e4.
                      \n\uc774\uac83\uc744 \ud559\uc2b5\ud574\uc57c \ud558\ub294 \uc774\uc720\ub294 \uc0dd\uba85\uc8fc\uae30\ubcc4 \uc0ac\uc6a9\ud560\uc218 \uc788\ub294 \ud568\uc218\ub098 \ubc1c\uc0dd\ud560\uc218 \uc788\ub294 \ud6a8\uacfc\uac00 \ub2e4\ub974\uae30 \ub54c\ubb38\uc774\ub2e4.<\/p>\n
                      \"\"<\/p>\n
                      \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uba85\uc8fc\uae30\ub294 3\ub2e8\uacc4\ub85c \uad6c\uc131\ub41c\ub2e4.
                      \n\uc544\ub798 \uadf8\ub9bc\uacfc \ud45c\ub97c \ucc38\uace0\ud558\uc790.<\/p>\n\n\n\n\n\n\n\n
                      \ub2e8\uacc4<\/strong><\/th>\n\uc124\uba85<\/strong><\/th>\nuseEffect \uc6a9\ubc95<\/strong><\/th>\n<\/tr>\n<\/thead>\n
                      Mount (\uc0dd\uc131)<\/td>\n\ucef4\ud3ec\ub10c\ud2b8\uac00 \uc0dd\uc131\ub418\ub294 \ub2e8\uacc4<\/td>\nuseEffect(()=>{},[])<\/code><\/td>\n<\/tr>\n
                      Update (\uac31\uc2e0)<\/td>\n\ucef4\ud3ec\ub10c\ud2b8\uac00 \uadf8\ub824\uc9c0\uace0 \ubcc0\ud654\ud558\ub294 \ub2e8\uacc4<\/td>\nuseEffect(()=>{})useEffect(()=>{},[\ubcc0\uc218\uba85])<\/code><\/td>\n<\/tr>\n
                      UnMount (\uc18c\uba78)<\/td>\n\ucef4\ud3ec\ub10c\ud2b8\uac00 \uc0ac\ub77c\uc9c0\ub294 \ub2e8\uacc4<\/td>\nuseEffect(()=>{ return \uc2e4\ud589\ubb38 },[])<\/code><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
                      \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc758 \uc0dd\uba85\uc8fc\uae30 \ub2e4\uc774\uc5b4\uadf8\ub7a8<\/p>\n
                      \"\"<\/p>\n
                      react-hooks-flow : https:\/\/github.com\/donavon\/hook-flow<\/a>
                      \n\ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c\ub294\u00a0useEffect()<\/code><\/strong><\/strong>\u00a0\ud6c5\uc744 \uc0ac\uc6a9\ud558\uc5ec \uc0dd\uba85\uc8fc\uae30\ub97c \uad00\ub9ac\ud55c\ub2e4.<\/strong>
                      \n                      #<\/strong><\/a>3.2.1. useEffect<\/strong><\/p>\n
                      \n
                      Info<\/strong>: \ud83d\udca1 useEffect<\/code>\ub97c \uac00\uc7a5 \uac04\ub2e8\ud558\uac8c \uc124\uba85\ud558\uba74,
                      \n"\ucef4\ud3ec\ub10c\ud2b8\uac00 \ud654\uba74\uc5d0 \ub2e4 \uadf8\ub824\uc9c4(\ub80c\ub354\ub9c1 \ub41c) \ud6c4\uc5d0<\/strong><\/strong><\/em>, \ucd94\uac00\uc801\uc73c\ub85c \ud574\uc57c \ud560 \uc77c\uc744 \uc2dc\ud0ac \ub54c"<\/strong> \uc0ac\uc6a9\ud558\ub294 \uc57d\uc18d(Hook)\uc774\uc5d0\uc694.<\/p>\n<\/blockquote>\n
                        React \ucef4\ud3ec\ub10c\ud2b8\uc758 '\uc8fc\ub41c \uc784\ubb34'\ub294 UI(\ud654\uba74)\ub97c \uadf8\ub9ac\ub294 \uac70\uc8e0?
                      \n\ud558\uc9c0\ub9cc \uc885\uc885 \ud654\uba74\uc744 \ub2e4 \uadf8\ub9b0 \ud6c4\uc5d0<\/em> \ud574\uc57c \ud560 \ubd80\uc218\uc801\uc778 \uc77c\ub4e4\uc774 \uc0dd\uaca8\uc694. \uc608\ub97c \ub4e4\uba74:<\/p>\n