본문 바로가기

전체 글93

[TIL] git The requested URL returned error: 403 해결 git add , commit 을 하고 push 를 하려는데 permisstion denied error 가 났다. 1. 먼저 git remote -v 로 origin 이 내가 push 하려는 레포 주소가 맞는지 확인한다. 아니라면 git remote set-rul origin "레포주소" 로 remote 를 설정해준다. 2. 아래 글 처럼 제어판 - 사용자 계정 - windows 자격 증명 - 일반 자격증명에서 git 을 선택하고 거기에 내 id와 pw를 입력해준다. https://itsjh.tistory.com/47 [Git] git error: 403 깃허브에서 소스 파일을 커밋 후 push 하려고 하는데 아래와 같이 403 에러가 발생하는 상황이 있다. unable to acess 'https:/.. 2023. 3. 28.
[TIL] html tag 의 id attribute 는 유일해야한다. form 을 제출하는 간단한 과제를 했는데 너무 기본을 모르고있어서 반성하는 마음으로 .. 개념을 정리 해 본다.. ^_T button 태그의 type 속성의 default 는 submit이다. button submit과 input submit 은 기능적으로 동일하지만 button 은 자식요소를 가질 수 있어 다양한 스타일링이 가능하다. id 는 전체 html 태그 중 유일한 값이어야한다. form 제출 사용 예제 First name: Last name: Submit form attribute 의 사용 정의 The form attribute specifies the form the button belongs to. The value of this attribute must be equal to the i.. 2023. 3. 24.
Recoil 사용 연습하기 - 1 Recoil 개념 recoiil 에서 하나의 전역 상태는 Atom 이라고 부른다. Atom 은 어느 하나의 컴포넌트에 묶여있지 않고, 모든 컴포넌트에서 접근 가능한 하나의 그래프이다. Atom 상태를 구독하여 업데이트되는 Selector 혹은 Atom 을 자식으로 점점 붙여나갈 수 있다. Recoild 도 Redux처럼 단방향 데이터 흐름을 가진다. Recoil 을 사용하면 atoms(공유상태)에서 selectors(순수함수) 를 거쳐 React 컴포넌트로 내려가는 data-flow graph 를 만들 수 있다. Atoms은 컴포넌트가 구독할 수 있는 상태의 단위이다. Selectors는 atoms 상태값을 동기 또는 비동기 방식을 통해 변환한다. Atoms Atoms는 상태의 단위이며, 업데이트와 구독.. 2023. 3. 21.
[React] useEffect 란? useEffect 란 ? useEffect 란? useEffect(callback, [dependencies]) Effect 란? useEffect 는 왜 useEffect 라고 불리는걸까? effect 란 무엇일까? effect는 함수형 프로그래밍 용어인 "side effect" 를 의미한다. side effect 가 뭔지 이해하기 위해 먼저 pure function 에 대해 이해 해 보자 대부분의 react component는 pure function 이 되려고 한다. react component 를 함수라고 생각하는게 이상하겠지만 react component 는 함수다! 대부분의 react component는 pure function 이며 input을 받고 예측 가능한 JSX output을 만들어낸.. 2022. 11. 3.
[React] Props 로 콜백 함수 전달하기 / 어떨때 Props로 콜백 함수를 전달해야 하는가? Props 로 콜백 함수 전달하기 개념 정리 Props 란 ? react에서 props는 데이터를 한 컴포넌트에서 다른 컴포넌트로 전달 할 때 사용된다. (부모 -> 자식 ) CallBack Function 이란? 정의: 프로그래밍에서 콜백 또는 콜백함수는 다른 코드의 인수로서 넘겨주는 실행 가능한 코드를 말한다. 콜백을 넘겨받는 코드는 이 콜백을 필요에 따라 즉시 실행할 수도 있고, 아니면 나중에 실행할 수도 있다. 이벤트는 페이지가 로드되거나 유저가 click, hover, change 등의 상호작용을 했을 때 등 그 밖의 여러가지 상황에서 발생한다. 이벤트에 반응하기 위해서 함수를 공급해야한다. 이벤트가 발생했을 때 불려 질 함수를 콜백함수라고 한다. React Data Flow data는 부모에서.. 2022. 10. 29.
nvm 주요기능 / nvm exit status 5: Access is denied. 에러 NVM은 Node Version Manager 로 노드의 버전을 관리하는 도구이다. 프로젝트에 따라 사용해야 하는 노드 버전이 다를 수 있기 때문에 그럴 때 사용하기 좋다. NVM 의 주요 기능 nvm version : 현재 사용하는 nvm 의 버전 확인 nvm current : 현재 사용되고 있는 node 버전 확인 nvm list: 설치 된 노드 버전 리스트 확인 nvm install : 특정 버전 설치 가능 nvm exit status 5: Access is denied. vsCode 의 터미널에서 nvm use 16.14.2 해 주자 exit status5: Access is denied. 에러가 발생했다. 권한 문제 때문이라 윈도우 cmd를 관리자 권한으로 열어서 nvm use 16.14.2 해.. 2022. 10. 22.
한 우물 로또왕 - UI , Component 계획, Create React App으로 개발 환경 구성하기 한 우물 로또왕은 2021년 개발 동아리 프로젝트로 시작 된 기획이다. 당시에는 바닐라 자바스크립트로만 프로젝트를 구현 했었는데 이번엔 리액트로 구현 해 보려고 한다. 자바스크립트 프로젝트에서는 로또게임 결과를 조회하기만 했었는데 이번엔 회원가입 기능, 랭킹 확인 기능을 추가하기로 했다 . 어느정도 앞단만 구현을 하다가 시간이 지나고 보니 이때까지 구현했던 코드들에 부족한 점이 많이 보여서 블로그 글로 정리 하면서 처음부터 다시 구현 해 볼까 한다. Pages , Components 기획 Pages Home 메인 페이지 Login 로그인 페이지 Join 회원가입 페이지 Rank 랭킹 확인 페이지 Components MyHeader MyButton (props - txt , onClick, blockFla.. 2022. 10. 9.
[leetcode/JS] 234. Palindrome Linked List / Javascript 문제링크 https://leetcode.com/problems/merge-two-sorted-lists/ Merge Two Sorted Lists - LeetCode Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 생각정리 기억하면 좋을 것 1. 두 list를 비교 후 남은 node 처리 할 때 crt.next = list1 || list2 이렇게 깔끔하게 처리 해줄 수 있다. 2. crt.next 를 지정 해 준 후 crt = crt.next 로 다음 노드로 이동 해 주어야 한.. 2022. 8. 27.
[leetcode/JS] 234. Palindrome Linked List / Javascript 문제링크 https://leetcode.com/problems/palindrome-linked-list/ Palindrome Linked List - LeetCode Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 기억하면 좋을 것 배열의 순서를 정반대로 뒤바꾸고 싶을때 어떻게 할까 ? 바로 reverse 배열 내장 함수를 사용하면 된다. 그런데 문자열을 정반대로 바꾸어 주고 싶다면 ? split() reverse() join() 세가지를 기억하자 split('') 은 문자열을 .. 2022. 8. 25.