-
React 기본 : 끝말잇기 React Hooks로 전환 (CMD 명령어 익히기)컴퓨터 알아가기/React 2021. 8. 3. 19:30728x90반응형
요즘 React는 Class 형 component대신 Hooks가 대세라고 합니다. 따라서 다시한번 현재까지 만든 Component를 이용한 끝말잇기 프로그램을 Hooks로 바꾸는 과정을 공부해 볼려고 합니다.
지난번 만든 폴더에는 많은 파일과 폴더를 생성하여 Webpack을 실행하였습니다. 에러없이 만들어진 기본 React Webpack이었기에 큰 변화가 없는한 본 파일들을 활용하여 새로운 프로젝트에 적용하는게 편할 듯 합니다. 이런 과정을 거치면 변경하고자하는 파일만 수정을 하면 될 듯 합니다.
▒ CMD 파일 복사 명령어
윈도우탐색기에서 미리 만들어 놓은 폴더를 전체 복사하여 새로운 폴더안에 옮길수도 있으나 React의 폴더 전체를 복사하고 붙혀넣기하는 과정이 시간적으로 많이 소요됩니다. 이에 따라 CMD 창에서 전체를 복사하여 새로운 폴더로 붙혀넣기 하는 방식을 알아보도록 하겠습니다.
1. 원하는 폴더 만들기
이 작업은 탐색기에서 하는 편이 편합니다. 본인이 원하는 이름으로 빈 폴더를 만들면 됩니다. 저같은 경우는 RelayHook라는 폴더를 생성 하였습니다.
2. 복사하고자 하는 폴더 전체내용을 복사하고 빈 폴더에 붙혀 넣기
① CMD 창 열고 원하는 폴더로 이동
윈도우 검색창에서 cmd로 타이핑하고 해당 창을 엽니다. (참고로 Node 명령어창도 되고 항상 사용하는 VS Code의 Terminal창도 같은 역할을 합니다.)
다음 순서는 복사하고자 하는 폴더로 찾아가는 방식입니다. 저의 경우는 D 드라이브에 빈 폴더를 만들어 놓았기에 다음순서대로 진행 하였습니다.
상기 1번은 CMD 창을 열면 내컴퓨터가 설정되어 있는 기본 디렉토리로 들어갑니다. 완전 Root로 가기 위한 명령어입니다.
2번은 C드라이브에서 D드라이브로 변경하는 명령어이며, 3번에서 5번까지는 기존에 만들어진 폴더 (pack)까지 옮겨가는 과정입니다.
② 폴더 전체 내용 복사후 옮기고자 하는 폴더에 붙혀넣기
일반적인 파일을 복사할 경우는 copy라는 명령어만 사용하면 되는데 하위 폴더까지 복사해서 붙혀넣기 하기 위해서는 xcopy라는 명령어를 사용합니다.
xcopy의 기본 명령방식은 xcopy [복사할 폴더와 전체] [붙혀넣기할 폴더]가 기본입니다. 그런데 해보니 윈도우 탐색기로 옮기는 시간이나 CMD창에서 옮기는 시간이 같네요. (React 폴더 없애는 경우는 CMD 창이 훨씬 빨라서 복사 붙혀넣기도 같은줄 알았는데 아닙니다.)
다음과 같이 명령어를 쳐주니 하나하나 하위 폴더까지 복사 및 붙혀넣기가 되네요.
상기 첫번째 잘못된 매개 변수의 수 에러는 폴더 이름중 React Zero라고 여백이 있습니다. 이럴경우는 큰따옴표로 전체를 감싸주어야 합니다.
성공한 두번째 명령어를 설명하면 다음과 같습니다.
전체폴더를 복사하고자 하는 폴더(pack)에서 하위 디렉토리까지 전체를 복사합니다. 전체는 마침표로 지정합니다.
xcopy .
붙혀넣기할 위치를 지정합니다. 여백이 있으므로 큰따옴표를 사용합니다.
"D:\React Zero\RelayHooks\"
비워있는 하위 디렉토리까지 복사합니다. /e
히든파일을 포함 시스템 속성까지 복사합니다. /h
파일속성을 복사합니다. /k
덮어쓰기 할 경우 강제로 yes 명령어를 설정합니다. /y
③ 최종적으로 옮겨졌는지는 윈도우 탐색기를 통하여 확인합니다.
이제 해당 폴더의 내용을 Hooks로 수정하면서 공부해 보도록 하겠습니다.
반응형'컴퓨터 알아가기 > React' 카테고리의 다른 글
React 기본 : 끝말잇기 Hooks로 전환 후 에러 수정 - Uncaught TypeError : value is not a function (0) 2021.09.07 React 기본 : Class형 끝말잇기 Hooks로 전환 (0) 2021.08.05 React 기본 : 웹팩개발서버와 핫리로딩 설치 (0) 2021.08.02 React 기본: 끝말잇기 프로그램 Webpack Build 및 에러 수정 (0) 2021.07.29 React 기본 : 끝말잇기 프로그램 만들기 (WordRelay.jsx 파일 만들기) (0) 2021.07.27