리팩토링을 다시 시작하는 도중 내 코드는 손을 댈 수 없다는 것을 깨달았다. 폴더 구조도 뒤죽박죽이고 모듈화를 진행한다고 해도 답이 없고 css 네이밍도 의미없이 지었다. 추가적으로 페이지네이션과 무한 슬라이드, 지도 api 사용 등도 내가 직접 짠 코드 보다 복사 붙

연이어 발생한 이벤트를 하나의 그룹으로 묶어서 처리하는 방식으로 주로 그룹에서 마지막, 혹은 처음에 처리된 함수를 처리하는 방식으로 사용되곤 한다.연속적으로 들어오는 입력중에 마지막 입력만 실행하게 하는 기법이다.window의 resize이벤트에서 마지막 변할때만 실행

비동기 처리가 왜 필요할까? 자바스크립트에서는 비동기 처리가 중요하다. 그러면 왜 비동기 처리를 해야할까? > 서버로 http 요청을 했을 때 요청에 대한 응답이 언제 올지 모르는데 계속 기다릴 수는 없기 때문이다. 아래 그림으로 예를 들어보자. A는 서버에 htt

react-router-dom 으로 a 태그 대신 링크를 달 수 있다. a태그는 이동할 때 페이지를 전부 새로고침 하지만 Link 는 브라우저의 주소만 바꿀때 사용한다.NavLink 와 Link 차이점은, NavLink는 스타일을 적용할 수 있다. 폴더 구조는

fetch 로 해당 주소에 네트워크 요청하기. 주소에 데이터를 가져오는것은 시간이 많이 걸리기 때문에 await을 이용해 비동기 처리 해준다. .json으로 바꿔줄때도 비동기처리 해줘야해서 await이 두번 쓰이게 됐다. 데이터를 받아오면 해당 데이터의 movie

a.map(함수) 은 a 배열의 모든 요소들을 하나씩 돌며 함수 실행. 이때 함수에 파라미터가 이 요소가 됨. onChange 함수는 input 의 값을 가져오는 함수.input의 value들을 하나하나씩 e.target.value를 이용해 가져와서 사용해야함. o

useEffect : 컴포넌트 rendering 할 때 특정 state가 변할때만 해당 함수 호출즉, 한 컴포넌트 안에 여러 이벤트가 있을 때, 특정 이벤트가 특정 state가 변할때만 render 하고 싶을 때 사용한다.\[] 안에는 2개 이상의 상태가 들어갈 수도

node -v 로 노드 설치되어있는지 미리 확인npm : package 관리npx: package 설치모듈 업데이트 확인이 어렵다.프로젝트마다 다른 버전의 모듈이 필요할 때는 버전 문제가 발생할 수 있다.create-react-app 같은 보일러플레이트(여러 군데에서

props는 컴포넌트에 어떤 값을 전달해줄때 사용.같은 스타일, 상태 등을 가지고 다른 html 을 할당하고 싶을 때 props를 이용할 수 있다.이때 props는 {banana, big} 이고,({banana,big} 대신 props 라고 지정하면 사용할 때 pro

Inputs and State

깃 GUI : git gui , source tree, kraken 등..(확인하는 용도로만 사용하는게 좋다.)git → Blob + tree = commitmkdir a : a 폴더 생성cd a : a 폴더로 이동(a폴더를 drag&drop하면 경로가 생긴다.)to

설치해야 할 것 : vmware(virtual machine -> 현재컴퓨터의 OS에 추가로 운영체제를 설치할 수 있게 해줌(가장 최신버전)\-> vmware fusion 을 설치해야함.(맥의 경우)\-> 무료로 사용하려면 회원가입 후 라이선스 키를 받은 후 추후에 입

1. ajax 이전 HTML,CSS,조금의 JS로만 이루어진 정적인 웹페이지. 데이터 변경 시 HTML 파일의 데이터를 수정했다. 2. PHP/ASP/JSP 페이지에 동적인 데이터 넣을 수 있게 됨. 하지만 브라우저가 새로 필요한 정보가 있으면 페이지를 다시 읽어야

정적 페이지 : css/html , 이미지 파일, js 파일 등..\-> 어떤 사용자가 오던 동일한 페이지.동적 페이지 : \-> 사용자, 시간, 상태 등에 따라 다른 페이지 보여줌.\-> parameter에 따라 다른 페이지 보여줌\-> 예)게시판 번호에 해당하는 페

state 이해하기.여기서 countUp 이라는 함수는 counter 이라는 숫자를 1씩 증가.Container은 html 요소들을 띄워주며, 이때 {변수} 를 넣어줄 수 있다. onClick={함수이름} 은 클릭 시 함수가 실행된다는 뜻.바닐라에서는 innerText

브랜치가 업데이트 되지 않아서 생긴 에러"git remote update" 한 후 "git fetch" 해주면 해결.

용액 풀이 풀기 위해 생각해야 할 것. 두개의 용액 비교하기. 첫번째 용액을 target 으로 설정해주고 for 문 돌려서 모든 용액 검사. -target과 배열의 미드를 비교하는데, 타겟이 더 크면 오른쪽에 타겟과 일치하는 것이 있다는 것. 타겟이 더 작으면 왼쪽에

기본 유형

2차원 배열 입력받고, dx, dy (x와 y의 이동 방법) 선언해준 후, 큐 선언 후, 모든 노드들 방문 False로 선언해준다. 함수 두개 선언해주기 첫번째는 해당 노드에 방문 후(방문 True 로 해주기) 큐에 넣고, 큐에 넣어져 있는 곳 상하좌우로 이동할

파이썬 문법→ idle로 간단하게 이용 가능문자열 길이 len(a)문자열 + ,\* 가능a-1 은 뒤에서 첫번째, a0 은 앞에서 첫번째 문자열 포매팅 → “i am %d %s” %(number,gender) → %s 는 문자열인데 아무거나 넣을 수 잇음format