전체 글 (45) 썸네일형 리스트형 반응형 웹과 적응형 웹 차이점 [반응형 웹] 화면의 크기에 따라 홈페이지의 사이즈가 변화한다. PC / 태블릿 / 모바일 각각의 전용 홈페이지를 만들 필요가 없음 장점 : 1. 유지보수가 효율적이다. -> 하나의 소스를 수정하면 모든 기기 사이즈에 맞추어 콘텐츠가 최적화 2. 사용자가 기기에 구애를 받지 않는다 단점 : 1. 비용이 높다 해상도별로 출력될 화면을 정의하는데 소요되는 공수가 있어 제작비용이 높다 2. 접근성이 떨어지거나 , 비효율적일 수 있다. -> 쇼핑몰과 같이 많은 양의 정보를 한 화면에서 보여주는 경우 3. 코드가 복잡하다. (적응형 웹보다 가격이 비싼이유이다.) -> 고정된 픽셀값 대신 백분율 값을 사용하고 기기화면 크기에 따라 조정해야 되기 때문 [적응형 웹] 적응형 홈페이지는 기준이 되는 기기의 사이즈가 되면.. Broken pipe 오류 원인, 해결 방법 직접 경험해 본 것은 아니지만 공부도중 적어볼 필요가 있어 끄적여 봅니다. ㅎㅎ [java.net.SocketException : Broken pipe] [원인] - 잦은 입출력 호출로 발생한다. 처리 중인 요청(또는 응답)을 사용자가 기다리지 않고 '새로고침(또는 종료, 연속 클릭)' 을 자주 실행하게 되면 소켓이 끊어져서 발생한다. EX ) 동작원리 : 웹브라우저에서 서버에 연결을하면 accept된 soket을 HttpThread에 넘기고, ThreadPool에서 조건에 맞으면 해당 HttpThread를 기동하게 되어있다. 오류원인 : HttpThread가 완료되기 전까지 다시 재요청을 하지 않는다면 문제가 되지 않지만, HttpThread가 완료되지전에 재요청을 하게 되면 문제가 된다. 이유는 처음.. 함수형 컴포넌트와 클래스형 컴포넌트의 차이 React 컴포넌트를 만들때 클래스형 컴포넌트, 함수형 컴포넌트 2가지 방식이 있다 과거에는 클래스형 컴포넌트를 많이 사용했지만 2019년 v16.8 부터 함수형 컴포넌트에 리액트 훅(hook)을 지원해 주어서 현재는 공식 문서에서도 함수형 컴포넌트와 훅(hook)을 함께 사용할 것을 권장하고 있다. [함수형 컴포넌트를 선호하는 이유] 요즘은 많은 개발자들이 클래스형 컴포넌트보다 함수형 컴포넌트+Hook을 사용한다. 클래스형 컴포넌트는 로직과 상태를 컴포넌트 내에서 구현하기 때문에 상대적으로 복잡한 UI 로직을 갖고 있는 반면, 함수형 컴포넌트는 state를 사용하지 않고 단순하게 데이터를 받아서(props) UI에 뿌려준다. Hook들을 필요한 곳에 사용하며 Logic의 재사용이 가능하다는 장점이 있어.. 컴포넌트 반복 : map() [map() 함수] arr.map(callback, [thisArg]) 1) callback : 새로운 배열의 요소를 생성하는 함수이며, 파라미터는 다음 3가지 - currentValue : 현재 처리하고 있는 요소 - index : 현재 처리하고 있는 요소의 index 값 - array : 현재 처리하고 있는 원본 배열 2) thisArg(선택항목) : callback 함수 내부에서 사용할 this 레퍼런스 [컴포넌트 map 예시 1 - key가 없는 경우] : 하단의 예시대로 한다면 키값이 없어 콘솔창에 경고를 출력하게 된다. key • 리액트에서 key는 배열을 렌더링 했을 때 어떤 엘리먼트에 변동이 있었는지 알아낼 때 사용합니다. 1) key가 없으면 - 가상 DOM을 비교하는 과정에서 리스트를 .. ref: DOM [ref:DOM 이란?] jquey에서 이런 식으로 ID값을 가져와 DOM를 직접 핸들링한다. React에서도 DOM를 직접 접근하고 싶을때 사용하는것이 ref DOM 이다. [예시] 컴포넌트에 ref 사용 : 스크롤 박스 조작하기 ( this.scrollBox=ref } } this.scrollBox.scrollToBottom() HTML DOM 에 ref 사용 : 특정 input 에 focus 주기 this.input=ref } /> this.input.focus() : 하단 예시를 보면 input에 입력한 값이 0000이면 텍스트필드의 색상을 lightgreen 아니면 lightcoral 으로 변경한다. 우선 CSS를 만들어준다. [ref 사용 전] [ref 사용 후] Collection 이란? 자바에서 컬렉션 프레임워크(collection framework)란 다수의 데이터를 쉽고 효과적으로 처리할 수 있는 표준화된 방법을 제공하는 클래스의 집합을 의미합니다 즉, 데이터를 저장하는 자료 구조와 데이터를 처리하는 알고리즘을 구조화하여 클래스로 구현해 놓은 것입니다. java.util.Collection 인터페이스 그룹 java.util.List : List 자료 구조 ( ordered, sequential ) java.util.Set : Set 자료 구조 ( unique element ) java.util.SortedSet : 정렬된 set java.util.NavigableSet java.util.Queue : Queue 자료 구조 (한쪽에서 삽입, 반대에서 추출) java.util.Deque.. [프로그래머스 - 전화번호 목록] - Java, Python [문제] [JAVA] 아래 소스는 제가 효율성 체크에서 실패한 경험이있어 제 블로그 메뉴 중 '자아성찰'에 가시면 자세히 설명되어있습니다.ㅋ [Python - Hash이용] [Python - zip이용] [Zip 함수] 여러 개의 순회 가능한(iterable) 객체를 인자로 받고, 각 객체가 담고 있는 원소를 tuple의 형태로 접근 가능한 반복자(iterator)를 반환합니다. 기본 병렬 처리 : 여러 그룹의 데이터를 한번의 루프로 처리한다. unzip : zip() 함수로 엮은 데이터를 다시 해체한다. 사전(dictionary) 변환 주의사항: 만약 zip를 사용할때 가장짧은 인자의 기준으로 나머지는 버려지므로 주의해야 합니다. [프로그래머스 - 완주하지 못한 선수]- Java, Python [문제] [JAVA] getOrDefault(Object key, V defalutValue) : 현재 Map에 key값이 존재한다면 그 값의 value값을 반환하고 없다면 defaultValue를 반환한다. keySet() : Map의 전체 Key값을 가져온다. key,value값을 가져오려면 entrySet()을 사용한다. 위 소스의 원리를 설명하자면 현재 참가자를 HashMap에 넣어주며 존재유무를 가려 +1를 해주고 완주자를 HashMap에 넣을땐 값을 -1해준다 결과적으로 HashMap안에 값이 0보다 크다면 참가자는 완주하지 못한 것이기에 그 값을 리턴해준다. [Python] 파이썬...한줄이면 되버린다....무서운 파이썬... Collections.Counter는 결과값은 요소의 갯수가 많은.. 이전 1 2 3 4 5 6 다음
