🛠️ Solution

to do list 프로젝트를 하면서 배열 내에 있는 값을 삭제하거나 상태를 변경하기 위해 각 배열 요소에 고유한 값을 부여해야 할 필요성을 느꼈다. 어떻게 배열 내에 요소를 생성할 때마다 고유한 값을 부여해야 하는지 고민을 하고 있던 찰나에 라이브러리의 도움을 받았다.. UUID 설치 커맨드 npm install uuid yarn add uuid UUID 사용방법 import { v4 as uuidv4 } from "uuid"; 해당 라이브러리를 사용할 컴포넌트 파일에 uuid를 import 해두고 고유한 값 부여가 필요한 태그에 위와 같이 대괄호 안에 uuid() 함수를 선언해주면 된다.

1. “build.command” failed 1번째 시도: 프로젝트 패키지 파일내 scripts 수정 [React] "build.command" failed (Netlify 배포) 나와 같은 에러를 겪은 경우인데 package.json을 다음과 같이 설정해두었더니 해결했다고 한다. "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", "predeploy": "CI npm run build", "deploy": "gh-pages -d build" }, 그러나 실패 2번째 시도: 배포 사이트 내에 빌드 명령어 수정..

문제 리액트로 투두리스트 프로젝트를 하고 있는데 위와 같이 한글로 입력하는 경우에는 입력한 문자열 중 마지막 문자가 한 번 더 등록되는 문제가 발생했다 { enterkeyEvent(e); }} /> 원인 한글, 한자처럼 컴퓨터 자판에 있는 글자보다 수가 더 많은 문자를 계산하거나 조합하여 입력해 주는 시스템 소프트웨어인 입력 방식 편집기(input method editor, IME) 자체 오류로 비단 한글뿐만 아니라 일본어, 중국어도 텍스트 입력과정에서 두 번 입력되는 오류가 생긴다고 한다. 해결방법 1) onKeyDown -> onKeyPress onKeyPress 이벤트의 경우 문자가 실제로 입력됐을 때 반응한다고 한다. 그래서 두 번씩 입력되는 오류를 해결할 수 있다. input 태그 내에 onKe..

Error Messge Module not found: Error: Can't resolve '@fortawesome/fontawesome-svg-core' in ' /vercel/path/node_modules/@fortawesome/react-fontawesome React로 npm start해서 개발하는 과정에는 문제가 없다가 해당 프로젝트를 Vercel로 배포하는 과정에서 위와 같은 오류 메세지가 떴다. 원인 아이콘을 작동시키는데에 있어서 핵심 패키지인 @fortawesome/fontawesome-svg-core을 배포할 프로젝트에 설치하지 않아서 생긴 오류이다. 해결방법 @fortawesome/fontawesome-svg-core 패키지 설치 npm i --save @fortawesome/fon..

1 ① Vercel에 로그인한 다음 Add New... 버튼 클릭 ② Add New... > Project 클릭 2 ① 배포할 프로젝트가 저장된 원격저장소의 계정을 선택 ② 해당 계정에 저장된 repositories 중에서 배포할 repository 선택 3 Deploy 버튼 클릭 후 대기화면 4 에러가 없는 경우에 배포 성공 📌 Vercle로 배포한 프로젝트 보러가기 👉 https://github-profile-finder-of-kimgoat.vercel.app/

1.  node.js 설치하기1-1. 해당 사이트에서 OS에 맞는 버전을 다운받기 Node.jsNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org 1-2. 터미널에서 명령어를 사용하여 다운받기 설치가 되었는지 확인하려면 '설치한 패키지 이름 -v' 을 통해 확인 가능하다.  💡 React 프로젝트에서 사용하는 tools 종류node JS: 자바스크립트를 실행할 수 있는 환경, 자바스크립트로 프로그래밍을 가능토록 하는 프레임워크npm: 패키지 매니저, 라이브러리들을 쉽게 관리(설치, 삭제, 버전관리)할 수 있도록 도와준다.npx: 설치하는 것이 아닌 우리가 원하는 라이브러리를 실행할 수 있도록 도와준다.yar..

① 자신이 원하는 경로에 작업할 파일 생성 (필자의 경우 배경화면에서 생성) ② 이클립스 왼쪽 Project Explorer 창에서 'Create a project' 클릭 ③ New Project 창에서 Java Project 선택 후 Next 버튼 클릭 ④ Test 파일 내부에 생성할 프로젝트 파일 이름 설정 후 Finish 버튼 클릭 ⑤ 프로젝트 파일을 생성하고 난 뒤에 이클립스 작업창을 이클립스에서 제공해주는 셋업 대로 할 것인지 여부를 묻는 창이 뜬다. 본인이 원하는 대로 클릭 ⑥ 프로젝트 생성 완료!

① 프로필 페이지 상단바에 있는 Repositories 클릭 ② New 버튼 클릭 ③ Repo 생성 페이지에서 Repo 이름과 Repo 공개 범위 설정 후 하단에 있는 Create repository 버튼 클릭 ④ Repo 처음 생성하면 뜨는 화면으로 원격 저장소인 github과 사용자가 작성한 파일을 연동할 때 사용하는 명령어를 소개한다. 최종적으로 Repository 생성을 완료하면 Repositories 페이지에 생성된 Repository가 나열된다.

① 깃허브 프로필 페이지에서 우측 상단 프로필 아이콘 클릭 ② 메뉴에서 Settings 클릭 ③ 왼쪽 카테고리에서 하단에 있는 Developer settings 메뉴 클릭 ④ Personal access tokens > Tokens (classic) 이동 후 토큰 사용 용도 기입 후 토큰에 권한 부여하는 체크리스트 체크 후 토큰 생성 ⑤ 토큰 생성 완료 후 화면에서 토큰 키 복사 ⚠️ 해당 화면은 토큰 생성 당시에만 볼 수 있는 화면이라서 토큰 키는 반드시 복사하여 따로 관리해야 한다.