EricaBlog

Erica
Written by@Erica
좋은 개발자가 되기 위해서 공부하는 중입니다.

CSS 성능 향상 시키기

참고 링크 : https://yceffort.kr/2021/03/improve-css-performance 개발을 진행하다보면, 페이지 성능에 대해 고민할 때가 있다. 이 포스트에서는 CSS 성능 향상을 위해 필요한 작업들에 대해 다뤄보려고 한다. CSS 동작 방법 CSS는 랜더링을 막을 수 있다. CSS의 존재 자체 만으로, CSS가 파싱되기 전까지 …

문자열 메서드

기본적인 문자열 메서드 자바스크립트에는 문자열에 사용할 수 있는 많은 메서드가 있다. 문자열에서 지정된 값이 처음 나타나는 위치 반환한다. 문자열의 지정된 부분을 새 문자열로 반환한다. 문자열 내의 모든 문자를 대문자로 바꾼다. ES6의 새로운 문자열 메서드 이 메서드는 매개변수로 받은 값으로 문자열이 시작하는지 확인한다.

템플릿 리터럴

문자열 삽입 ES6부터 백틱을 사용하여 코드 작성이 가능하다. 여러줄의 문자열 생성 중첩 템플릿 : 템플릿 안에 템플릿을 중첩하는 것 삼항연산자 사용 삼항연산자를 사용하면 템플릿 문자열 내에 로직을 쉽게 추가할 수 있다. 템플릿 리터럴에 함수 전달하기 다음 예제 코드처럼 필요하면 템플릿 리터럴 내에 함수를 전달할 수 있다. 태그된 템플릿 …

반응형 웹 (가변 폰트, 멀티미디어, 미디어쿼리, 뷰포트)

이 글에서는 최신형 기술이 아닌, 하위 브라우저를 호완할 수 있는 기술들에 대해 다루고자 합니다. <웹 사이트 구조> 웹 사이트 구조는 플렉서블 박스를 이용해서 반응형 웹사이트를 제작할 수도 있지만 기존의 속성인 (HTML, CSS, 가변 그리드, 미디어 쿼리, 뷰포트)를 사용하여 반응형 웹사이트를 만들 수도 있습니다.

반응형 웹 (가변 폰트, 멀티미디어, 미디어쿼리, 뷰포트)

<브라우저 기술 지원 현황을 확인할 수 있는 사이트> CSS3와 같이 새로 나온 속성들은 브라우저마다 제각기 지원하는 방식이나 지원율이 다를 수 있으므로 반드시 브라우저 지원 현황을 확인하고 사용해야 합니다. 브라우저 기술 지원 현황을 확인할 수 있는 Can I use… 사이트에서 기술명을 검색하여 사용해 보기 바랍니다. 링크 : https://can…

반응형 웹 (가변 그리드, 마진과 패딩)

반응형 웹이란, 기기마다 또는 환경마다 최적화된 웹사이트를 제공해주는 것을 말합니다. 반응형 웹 소식을 가장 빨리 받아볼 수 있고, 잘 만들어진 반응형 웹사이트를 만날 수 있는 대표적인 사이트는 ‘미디어 쿼리’( https://mediaqueri.es/ ) 입니다. 이 사이트 역시 반응형 웹입니다. 반응형 웹의 필요성 웹사이트를 사용하는 모든 사람들에…

다이나믹 프로그래밍

다이나믹 프로그래밍은 메모리를 적절히 사용하여 수행 시간 효율성을 비약적으로 향상키는 방법이다. 이미 계산된 결과는(작은 문제) 별도위 메모리 영역에 저장하여 다시 계산하지 않는다. 동적 계획법이라고 명명하기도 한다. 다이나믹 프로그래밍의 조건 최적 부분 구조 : 큰 문제를 작은 문제로 나눌 수 있으며 작은 문제의 답을 모아서 큰 문제 해결 가능 중복되는…

Sorting

정렬 알고리즘 정렬이란 데이터를 특정한 기준에 따라 순서대로 나열하는 것을 말합니다. 일반적으로 문제 상황에 따라서 적절한 정렬 알고리즘이 공식처럼 사용됩니다. 선택정렬 처리되지 않은 데이터 중 가장 작은 데이터를 선택해 맨 앞으로 보냅니다. 이중반복문 사용 시간 복잡도 : O(N제곱) 삽입정렬 처리되지 않은 데이터를 하나씩 골라 적절한 위치에 삽입 선…

BFS DFS

사전에 필요한 지식 : 스택, 큐, 재귀함수 그래프 탐색 알고리즘: DFS/BFS 탐색이란 많은 양의 데이터 중 원하는 데이터를 찾는 과정을 의미 대표적 그래프 탐색 알고리즘 : DFS, BS 파이썬에서 스택 사용하기 리스트(list) 파이썬에서 큐 사용하기 리스트를 사용하는 것보다 deque를 사용하는 것이 시간 복잡도 상으로 유리 재귀함수 자기자신을 …

react-native-1

이 포스팅은 앱을 개발하면서 배운 지식들을 정리하고 공유하기 위해 쓰는 글입니다. react-native와 typescript를 사용했습니다. <개발 Tip> image 삽입 전역으로 imag폴더 만든 후 하여 이미지 사용합니다. 이유 : 공통 사용 이미지를 두번 중복하여 저장하지 않음으로 메모리 공간이 늘어납니다. 코드 작성 한 파일에 코드가 100줄…