프론트엔드 개발자의 개념 저장소 프론트엔드 개발자의 개념 저장소

웹 브라우저에서 데이터를 저장하는 방법은 여러가지가 있다. cookie, indexedDB, Local Storage, Session Storage 등등.. cookie는 가장 흔히 사용하는 데이터 저장 방식이긴하나, http 요청 시 항상 request의 Header에 Cookie로 담겨서 전송되게 된다. 이는 보안상 아주 취약한 문제가 될 수 있으며, 중요한 정보를 쿠키에 저장하는 방식은 권장되지 않는다. 이에 대응할 수 있는 Storage는Local Storage와 Session Storage가 있다. Local Storage local Storage의 정의를 MDN에서 살펴보면 다음과 같다. https://developer.mozilla.org/ko/docs/Web/API/Window/localS..

현재 배포 된 서비스가 모바일 ios의 safari에서 scroll을 하면 일부 요소가 사라졌다가 다시 등장하는 증상이 생겼다. stackoverflow를 찾아보니, scroll을 하게 되면 resize event가 random하게 trigger 된다고 한다! 이 resize event에서 position recalculation이 일어나게 되면 자원절약을 위해 사라진다고 한다. 모바일에서는 resize event 가 필요가 없어서 제거함으로써 이 문제는 해결되었다. 또 다른 해결책으로는 stackoverflow에서 -webkit-transform: translate3d(0, 0, 0); 이 css를 적용하면 된다고 하는데, 나중에 한번 적용을 해 봐야겠다. 각 브라우저에 따라 호환되는 api나 위와 같..

개요 개발을 진행하다보면 무수히 많은 데이터를 처리할 때가 있다. 이 때 그 데이터를 모두 사용하게 되면 서버 리소스의 과부하 또는 클라이언트에서 Out of memory 등의 오류가 생길 수 있다. 그럴 때 데이터의 유의미한 정보만을 추출 할 수 있는 down sampling을 할 필요가 있다. Down Sampling 을 위한 알고리즘 목록 1. Douglas-Peucker Algorithm 2. SMA ( Simple Moving Average ) 3. LTOB ( Largest-Triangle-One-Bucket ) 4. LTTB(Largest Triangle Three Buckets) 5. LTD ( Largest-Triangle-Dynamic ) 1. Douglas-Pecker Algorith..

Dynamic Programing 흔히들 줄여서 DP라고 한다. 한국말로 하면 동적 계획인데, 기본적인 개념부터 알아보자. DP로 프로그램을 설계한다고 하는 것은 메모이제이션을 활용해 계산 결과를 저장, 그 저장 된 결과를 이용하여 다시 계산을 하여 점차 답을 도출해 나가는 것을 의미한다. Binomial Coefficient를 계산하는 과정을 살펴보자. 단순 재귀로 구현을 하게 된다면 class Binomial{ public static void main(String... args){ int n = 5; int k = 2; System.out.println(binomialCoeff(n,k)); } static int binomialCoeff(int n, int k) { // Base Cases if (..

우리는 main 메소드를 사용할 때, public static void main() 이 처럼 사용한다. public은 접근 제한자, void는 return type, main은 메소드의 이름을 의미하는데, static이란 무엇일까? static은 "정적인, 고정된"의 의미를 담고있다. class에서 사용 할 수 있는 static keyword의 방식에는 크게 두가지가 있다. public class Main{ static int a; static void add(){} } 첫번째로는 정적 필드이다. 위 코드에서는 int type의 a가 정적 필드로 선언이 되어있다. add() 메소드는 정적 메소드이다. 여기서 핵심, 정적멤버들은 인스턴스에 속해 있는 멤버가 아닌 클래스에 속해있는 멤버이다. 그 말인 즉슨,..

자바 프로그래밍을 한다 하면 기본적으로 알아야 하는 개념이 바로 "객체지향이란?" 세상의 모든 물체는 객체이다. 예를들어보자. 시계의 이름은 시계이고 시계의 기능은 시간을 표시하는 것이다. 사람은 사람으로 불리고, 각자 이름, 나이, 성별(멤버)가 있으며, 각자의 행동이 있다.(메소드) 자바에서는 기본 타입 primitive type(int, double, char 등)을 제외한 모든 것들을 객체로 취급하여 다뤄야 한다. 이 객체를 정의하는 것이 바로 class이다. 가장 기본적인 예를 들어보자. class Human{ String name; int age; public void eat(){System.out.println("밥먹는중...");} public void run(){System.out.pri..

var 변수는 여러모로 많은 문제점을 안고 있다. 우선, var 키워드 없이 변수를 선언해보자 function var1(){ i = 1; console.log(i); } var1(); console.log(i); 위 코드를 실행시키게 되면, 이 실행 결과가 나오게 되는데, 다시말하자면, var 키워드 없이 변수를 선언하면 전역변수가 된다. 그러나 var 키워드를 사용한다면 function var1(){ var i = 1; console.log(i); } var1(); console.log(i); 다음과 같이 var1을 벗어나게 되었을 경우에는 해당 변수를 사용할 수 없다. 즉, var 키워드를 사용한 경우는 스코프 내에서만 사용이 가능하다 자, 지금부터는 이 포스트의 주제인 var 변수의 호이스팅에 대해..

자바에서 유용하게 쓰이는 Stream. ​ Stream이 어떻게 유용할까? ​ Stream은 영 단어 그대로 해석보면 개울, 시내, 줄기 등의 뜻을 가지고 있다. ​ Buffer로 부터 입력을 받을 때, 출력을 할 때 역시 이 Stream을 사용한다. ​ 가장 중요한 것은 ​ 바로 Stream의 역할은 데이터를 필터, 수집, 집계, 그룹화 해주는 것이다. ​ 예를들어 다음과 같은 Human class가 정의되어 있다고 하자. class Human{ public static int MALE = 0; public static int FEMALE = 1; String name; int age; int sex; public Human(String name, int age, int sex){ this.name =..