분류 전체보기

일렉트론은 내부적으로 메인 프로세스와 렌더러 프로세스 구조를 가진다. 단일 메인 프로세스가 여러 개의 렌더러 프로세스를 관리하게 된다. 메인 프로세스(main process) 일렉트론은 웹이 아닌 앱, 즉 데스크 탑 응용 프로그램의 창을 통해 화면에 표시하게 해준다. 메인 프로세스가 바로 이 응용 프로그램창의 생성 및 삭제 및 컨트롤을 해주는 역할을 한다. 또한 node 기반으로 동작한다. 렌더러 프로세스(renderer process) 렌더러 프로세스는 응용 프로그램 창 내부에 띄워지게 되는 화면(html,css,js를 통해 만들어진 화면)에 대한 것을 담당한다. IPC(Inter-process Communication) Ipc를 직역하면 내부 프로세스 의사소통이다. 즉 메인 프로세스와 렌더러 프로세스..

insertBefore로 참조된 노드 앞에 해당 부모 노드의 자식노드를 삽입하기 const [draggingItem, setDraggingItem] = useState(null); /** 처음 드래그를 시작할때 * 1. 드래그 시작시의 요소를 state에 저장 */ const onDragStart = (e) => { setDraggingItem(e.currentTarget); }; /** 드래그가 끝날시 드래그하던 객체를 놓는 장소에서 이벤트 발생 */ const onDrop = (e) => { e.preventDefault(); const rect = e.currentTarget.getBoundingClientRect(); //드래그가 끝난 요소의 뷰포트 기준 위치 //현재 마우스 위치가 버튼의 위에 ..

리스트를 드래그 앤 드롭으로 순서를 변경해야하는 프로젝트를 진행하였다. 이에 drag 이벤트를 간단히 정리하였다. 이벤트 핸들러 설명 drag ondrag 요소를 드래그하면 항상 발생 dragstart ondragstart 드래그가 시작되면 발생 dragend ondragend 드래그가 끝날때 발생(마우스버튼 놓을시) dragenter ondragenter 이벤트가 달린 요소에 드래그한 아이템이 들어가면 발생 dragleave ondragleave 이벤트가 달린 요소에 드래그한 아이템이 떠날시 발생 dragover ondragover 이벤트가 달린 요소에 드래그가 이루어지면 발생 drop ondrop 이벤트가 달린 요소에 드래그가 끝나면(마우스 버튼을 놓으면) 발생 드래그 이벤트를 발생시키기 위해서는 d..

setState() setState()는 리액트의 함수형 컴포넌트에서 상태를 변경하기 위해 사용되는 hook useState()를 통해 반환되는 함수라고 할 수 있다. setState()의 특징 1. 비동기 동작이다. 2.연속적으로 호출 setState() 호출 시 BATCH(일괄) 처리가 된다. 3.단순히 state 객체를 넘겨줄 수도 있지만 함수형으로 새로운 state를 인자로 넘겨 줄 수 있다. setState()의 연속사용? 리액트에서 state가 변경되면 변경되기 이전의 state로 구성된 element tree와 변경 이후의 state로 구성된 element tree를 비교하여 변경된 부분을 감지하여 DOM에 적용하게된다. 그런데 리액트 내부적으로 이 과정에서 setState() 가 연속적으로..

문제 설명 배열 arr가 주어집니다. 배열 arr의 각 원소는 숫자 0부터 9까지로 이루어져 있습니다. 이때, 배열 arr에서 연속적으로 나타나는 숫자는 하나만 남기고 전부 제거하려고 합니다. 단, 제거된 후 남은 수들을 반환할 때는 배열 arr의 원소들의 순서를 유지해야 합니다. 예를 들면, arr = [1, 1, 3, 3, 0, 1, 1] 이면 [1, 3, 0, 1] 을 return 합니다. arr = [4, 4, 4, 3, 3] 이면 [4, 3] 을 return 합니다. 배열 arr에서 연속적으로 나타나는 숫자는 제거하고 남은 수들을 return 하는 solution 함수를 완성해 주세요. 제한사항 배열 arr의 크기 : 1,000,000 이하의 자연수 배열 arr의 원소의 크기 : 0보다 크거나 ..

문제 설명 스파이들은 매일 다른 옷을 조합하여 입어 자신을 위장합니다. 예를 들어 스파이가 가진 옷이 아래와 같고 오늘 스파이가 동그란 안경, 긴 코트, 파란색 티셔츠를 입었다면 다음날은 청바지를 추가로 입거나 동그란 안경 대신 검정 선글라스를 착용하거나 해야 합니다. 스파이가 가진 의상들이 담긴 2차원 배열 clothes가 주어질 때 서로 다른 옷의 조합의 수를 return 하도록 solution 함수를 작성해주세요. 제한사항 clothes의 각 행은 [의상의 이름, 의상의 종류]로 이루어져 있습니다. 스파이가 가진 의상의 수는 1개 이상 30개 이하입니다. 같은 이름을 가진 의상은 존재하지 않습니다. clothes의 모든 원소는 문자열로 이루어져 있습니다. 모든 문자열의 길이는 1 이상 20 이하인 ..