효율적인 알고리즘 코드 작성하기 - 알고리즘이 수행을 시작하여 결과가 도출될 때까지 실행에 걸리는 시간이 짧고 연산하는 컴퓨터 내의 메모리와 같은 자원을 덜 사용하는 것이 효율적 - 같은 코드이지만 다른 효율성이 나올 수도 있음 --> 이를 개선하기 위해서는 어떠한 자료형을 쓰는가가 중요함 case1) - ArrayList와 LinkedList 추가/ 삭제를 하는 경우? ArrayList느림, LinkedList 빠름 - '' 인덱스 조회를 하는 경우? ArrayList 빠르지만 , LinkedList 느림 시간 복잡도란? - 입력을 나타내는 문자열 길이의 함수로서 작동하는 알고리즘을 취해 시간을 정량화하는 것 - 알고리즘의 시간복잡도는 주로 빅-오 표기법을 사용하여 나타냄 - 위의 그래프를 보니.. O..
Depth First Search - 시간을 우선으로 그래프를 탐색하는 알고리즘으로 시작점부터 인접한 정점을 차례대로 방문함 - Stack(FILO) 사용 , 재귀함수 형태로 사용 Breadth-First Search - Queue(FIFO) JAVA_DFS예제 class Main { static String[] vowels = {"A", "E", "I", "O", "U"}; static ArrayList words; public static void createWord(int lev, String str){ words.add(str); for (int i = 0; i < 5 ; i++){ if(lev < 5){ createWord(lev+1, str.concat(vowels[i])); } } } pub..
사용자가 떠나지 않도록 하기위해 = 수익증대 프론트 엔드 개발자로서 경쟁력 갖추기위해 [핵심] 브라우저의 렌더링 원리 Performance 패널을 이용한 분석 Lighthouse 패널을 이용한 분석 Network 패널을 이용한 분석 webpack-bundle-analyzer를 이용한 분석 텍스트 압축 이미지 사이즈 최적화 적절한 사이즈로 변환 이미지 CDN을 통한 최적화 리소스 캐싱 이미지 preload 컴포넌트 preload Component Lazy Load React Code Splitting Image Lazy Load 병목 코드 제거 repaint, flow 줄이기 웹 성능 결정 요소 화면을 부르고 최적화시 로딩, 렌더링할것인지 중요, 브라우저가 서버가 어떻게 통신하는지 알 필요가 있음 1. 로..
1. React Component란? - 재활용 가능한 UI 구성 단위 2. Component 구성하는 방식 (1) Class 이용한 방식 (2) Functional Component(함수형 컴포넌트) 예시 - 사용할때? setState와 ref를 없을 때 바로 Functional Component를 바로 사용 예시1) Class 이용한 방식 import React from 'react'; import './App.css'; function App() { return ( React App ); } export default App; 예시2) Functional Component(함수형 컴포넌트) 예시 const GuGuDan = () => { return Hello, Hooks } - Functional..
1. Select All SELECT * FROM CITY; 2. Weather Observation Station 1 SELECT CITY,STATE FROM STATION; 3. Revising the Select Query I SELECT * FROM CITY WHERE POPULATION > 100000 AND COUNTRYCODE = 'USA'; 4. Select By ID SELECT * FROM CITY WHERE ID = '1661'; 5. Weather Observation Station 6 Q. Query the list of CITY names starting with vowels (i.e., a, e, i, o, or u) from STATION. Your result cannot ..
Object VS Array - typeof 연산자를 배열에 사용하였을 때 둘다 "Object"로 출력 (1) Object - Index, length Property rk djqtdma - 리터럴 표기법 : {} const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"} - Object 값이 있는지 여부 let example = {}; Object.keys(example).length > 0 // false (2) Array const cars = ["Saab", "Volvo", "BMW"]; - 리터럴 표기법 : [] for 반복문 let cars = [ { "color": "purple", "type": "minivan", ..
기존의 객체를 건들이지 않고 새로운 객체를 만드는법 (1) Spread 문법 사용 - 기존의 객체에다가 ... 을 더해주면 새로운 객체를 생성할 수 있음 - 객체의 경우 const flower = { name : '꽃' } const sunFlower = { ...flower, attribute : 'sun'}; - 배열의 경우 const flower = ["해바라기"] const spreadFlower = [...flower, "장미", ...flower]; // (3) ["해바라기", "장미", "해바라기"] 2) rest - 객체, 배열, 함수의 파라미터에서 사용 가능 - Spread 연산자(...)를 사용하여 함수의 파라미터를 작성한 형태 - Rest 파라미터를 사용하면 함수의 파라미터로 오는 값..
Object in Array concat 하기 DATA let array1 = [ { id: "dream", date: "2021-01-24" }, { id: "love", date: "2020-09-22" } ]; let array2 = [ { id: "dream", name: "peter" }, { id: "hope", name: "rosy" } ]; 1. 일반적인 Data concat (1) concat 함수 사용 let result = array1.concat(array2); (2) 결과 // 0: {id: 'dream', date: '2021-01-24'} // 1: {id: 'love', date: '2020-09-22'} // 2: {id: 'dream', name: 'peter'} // 3..
[React] Webpack 플러그인 플로그인이란? 로더 -> 파일 단위로 처리 플러그인 -> 번들 출처 https://bogyum-uncle.tistory.com/112?category=805022 [WEBPACK] 플러그인(Plugin) 1. 플러그인(Plugin)이란, webpack으로 변환한 파일에 추가적인 기능을 더하고 싶을 때 사용 webpack의 기본적인 동작에 추가적인 기능을 제공 로더가 파일 단위로 처리한다고 하면, 플러그인은 번 bogyum-uncle.tistory.com