남남이루의 고군분투 🌳

키워드 리액트란? MVC에서 View (유저에게 보여주는 화면)에 최적화된 라이브러리 템플릿과 컴포넌트 템플릿 : HTML태그 형식을 문자열로 반환 (재사용이 어렵) 컴포넌트 : 재사용이 가능한 API, 수많은 기능을 내장 (재사용 용이, React의 방식) 렌더링 : 사용자 화면에 뷰를 띄우는 것 리액트는 동적으로 화면을 구성하기에 최적화 되어 있음 Virtual DOM, 변경되는 부분을 기존 돔과 비교해서 차이만 반영해서 렌더링 되도록 함 리액트 적용하기 CDN 삽입 (리액트, 리액트돔, 바벨) 하위에 script 태그생성, 해당 태그에 타입 지정 "type"="text/babel" 삽입할 위치를 querySelector로 할당한 돔 객체로 생성 삽입할 내용 생성 : 변수명 = (JSXHTML문법 작..

문제 해결 과정 문제 상황 : 파이썬 파일 실행하는데, input 파일 상대 경로를 못 읽어온다. 액션 1 : 기준이 되는 경로를 찾자 print(os.getcwd()) 결과 : 예상했던 루트가 아니다, 실행 경로가 상위 폴더로 되어 있다. ➔ 경로 기준은 뭐로 결정되는 걸까? 액션 2 : 출력된 경로를 살펴보니, 켜져있던 터미널 창이 파이썬 파일을 실행할 때 기준이 된다는 것을 알게 됨 액션 3 (해결) : 터미널 경로를 실행파일로 맞춰주고 ctrl + F5 실행하니 성공 추가 개선 추가 문제 상황 : 매 실행파일마다 터미널 경로를 바꿔야 하나?, 터미널을 끈 채로 실행할 때, 자동으로 상위 폴더로 설정되어 실행됨 액션 : debug 설정파일인 launch.json의 파라미터 탐색 후 관련 코드 추가 ..

플러그인 주소 기본 단축키 hjkl : 이동, i, v , esc : 모드 변경 그 외 참고 !!! 가장 중요한 필수 기본 설정 vimium option > show advanced option > ignore keyboard layout 체크 ignore keyboard layout 을 하면 한영변환을 하지 않아도 단축키를 사용할 수 있다. 참고 1 참고 2 : 일일이 매핑하기

성능측정 : time, timeEnd 함수의 호출 전후에 console.time('id');, console.timeEnd('id') 입력하면 id: --ms 형식으로 걸린 시간이 출력 됨. console.time("for loop"); for (let i = 0; i < 10; i++) { i++; } console.timeEnd("for loop"); 호출 횟수 출력 : count 함수 내부에 console.count('x count'); 삽입하면, 함수가 호출될 때마다 x count : 횟수 형식으로 출력됨. 호출 경로, 디버깅에 용이 : trace 호출된 코드를 감싸는 함수를 기점으로 상위 코드를 줄줄이 출력해줌 그 외 console.table(Object) console.info(msg) con..

힙큐의 사용 이진트리 내장되어 있어서 sorting 효율적으로 해주고, pop과 push로 큐로 쓰기 좋다. import heapq q = [1,4,5] >>> [1,4,5] heapq.heappop(q) # 최소값 반환 1 q >>> [4,5] heapq.heappush(q,5) # 순서에 맞게 삽입 q >>> [4,5,5] 22. 9. 17. 추가 heapq.heapify({list}) heapify는 리스트를 heap으로 정렬해준다. [3,2,1] => [1,2,3] 다만 사용법이 헷갈리기 쉬운데, 할당을 따로 하는 게 아니고, sort() 메서드 쓸 때 처럼 실행만 시켜주면 된다. import heapq as hq Alist = [] # Case 1 hq.heapify(Alist) print(Al..

지금까지 백엔드 프로젝트와 알고리즘을 풀며, 데이터를 처리할 때 인덱스를 가장 많이 사용하다보니, 자료구조 중 유독 리스트를 자주 사용한다는 것을 알게 되었다. 헷갈릴 때마다 노션에 적어두었던 관련 문법들을 모아 블로그에 포스팅할 필요를 느꼈다. 생성 - 수정(자르기, 추가하기) - 심화(다차원 배열 생성, map) 1. 리스트 생성하기 # 빈리스트 생성하기 a = list() a = [] # 특정 리스트 생성하기 (for 없이) a = list(range(3)) # [0,1,2] a = list(0 for i in range(3)) # [0,0,0] a = [0 for i in range(3)] # [0,0,0] # 다차원 리스트 생성하기 a = [list(0 for _ in range(3)) for ..

1. 목표 : 키보드에 글자가 입력될 때마다, 입력값을 검증하여 사용자가 보다 편리하게 사용할 수 있게 가이드를 해주고 싶다. 그렇지 않으면 제출버튼을 눌러서야 이메일 형식이 틀렸음을 알게되는 것! 번거로움! 2. 문제점 : 입력과 동시에 결과를 표시해줘야하는데 한박자 느리게 검증해서 혼란스러움.. let passWordInput = document.querySelector("#dialog_input"); passWordInput.addEventListener("keydown", (e)=> {validationCheck(e)}); function validationCheck() { // ... 생략 } 3. 원인 : 한글, 한자, 일본어 등 아시아권의 문자들은 한 글자를 입력하기 위해 조합이 필요하다. ..

람다함수 = 익명의 함수 OR 람다 표현식, 한줄로 표현할 때 편리 함수로 호출할 때 # 함수로 호출하기 def plus_one(x): return x+1 print(plus_one(1)) >>>2 람다함수로 표현할 때 #람다함수로 표현해보기 lambda x: x+2 # 콜른 왼쪽이 매개변수x, 오른쪽이 return값 plus_two = lambda x : x+2 # 할당해서 print(plus_two(2)) # 출력 map을 이용해 리스트에 함수 적용하기 # 보통 함수를 맵으로 적용할 때 def plus_one(x): return x+1 a = [1, 2, 3] print(list(map(plus_one, a))) # map(함수명, 대상) => 리스트의 인자 하나씩 함수를 적용하겠다 >>>[2, 3,..

a = [[0]*3 for x in range(3)] >>> [[0, 0, 0], [0, 0, 0], [0, 0, 0]] 이므로 행렬 형태가 아님 따라서 for문에 넣어주면 for i in a: #각 행마다 i에 할당되고 print(i) #행 출력하고나면 줄바꿈됨 >>> [0, 0, 0] [0, 0, 0] [0, 0, 0] 혹은 # try1 for x in a: for y in x: print(y) >>> 0 0 0 0 0 0 0 0 0 # try2 for x in a: for y in x: print(y, end = ' ') #행 안에서는 옆으로 한칸만 이동 (줄바꿈없이) print() #한 행이 끝나면 다음열로 이동하기 위해 줄바꿈 >>> 0 0 0 0 0 0 0 0 0 # 일차원 리스트 a = [0..

1.1 문자열이란 : 문자나 단어등으로 구성된 문자들의 집합이다. int와 배척되는 개념 출력할 때 "Sooo Good, and Yummy" 따옴표로 감싸져서 출력이 된다. 문자 그대로 출력하고 싶을 때는 \ 이스케이프를 앞에 붙여주면 된다. 1.2 이스케이프 \n 줄바꿈 \t 문자열 사이에 탭 \\ 문자 \를 그대로 표현 \' 작은따옴표 '를 그대로 표현 \" 큰따옴표 "를 그대로 표현 \r 줄바꾸고 현재커서를 가장앞으로 이동(캐리지 커서) \f 줄바꾸고 현재커서를 다음줄로 이동(폼피드) \a 벨소리(출력시 PC에서 삑-) \000 널 1.3 문자열 연결하기 ( + ) >>> Name = "Jude" >>> Action = "is going to school" >>> Sentence = Name + A..