Note
-
CI/CDNote 2021. 4. 17. 14:50
CI/CD는 애플리케이션 개발 단계를 자동화하여 애플리케이션을 보다 짧은 주기로 고객에게 제공하는 방법 CI/CD의 기본 개념은 지속적인 통합, 지속적인 서비스 제공, 지속적인 배포입니다. CI/CD는 새로운 코드 통합으로 인해 개발 및 운영팀에 발생하는 문제를 해결하기 위한 해결책이다. CI(Continuous Integration) CI는 지속적인 통합으로 개발이 끝난 후에 코드 품질을 관리하는 고전적 방식의 단점을 해소하기 위해 나타난 개념이다. 개발을 하면서 코드 변경 사항에 대해 정기적, 지속적으로 제공, 통합하면서 충돌할 수 있는 문제들을 해결하는 것이다. 지속적인 제공이란 개발자들이 자신의 작업이 모두 끝난 뒤에야 리포지토리에 올리고 코드를 한 번에 통합하는 것이 아니라 중간중간에 지속적으로..
-
Forward proxy, Reverse proxyNote 2021. 4. 15. 20:59
proxy 프록시(proxy)는 대신, 대리라는 뜻을 가지고 있다. 프로토콜에 있어 대리 응답에서 사용하는 개념이다. 보안 등의 이유로 직접 통신을 주고받을 수 없을 때 프록시를 이용하여 중계하는 개념이다. 이렇게 중계 기능을 하는 것을 프록시 서버라고 부른다. 프록시 서버 중 일부는 프록시 서버에 요청된 내용들을 캐시를 이용하여 저장해 둔다. 이렇게 캐시를 해 두고 난 후에, 캐시 안에 있는 정보를 요구하는 요청에 대해서는 원격 서버에 접속하여 데이터를 가져올 필요가 없게 됨으로써 전송 시간을 절약할 수 있게 됨과 동시에 불필요하게 외부와의 연결을 하지 않아도 된다는 장점을 갖게 된다. 또한 외부와의 트래픽을 줄이게 됨으로써 네트워크 병목 현상을 방지하는 효과도 얻을 수 있게 된다. 프록시 서버는 서버..
-
CDN(Contents Delivery Network)Note 2021. 4. 14. 23:26
웹 콘텐츠, 비디오 스트림 및 API를 안전하게 대규모로 전송할 수 있는 콘텐츠 전송 네트워크(CDN) 서비스로 대표적으로 AWS CloudFront가 있다. CDN(Contents Delivery Network) 콘텐츠를 효율적으로 전달하기 위해 여러 노드를 가진 네트워크에 데이터를 저장하여 제공하는 시스템을 말한다. 내가 만든 서비스를 호스팅 해주는 서버는 한국에 있고 내 서비스를 전 세계에 제공하고자 할 때, 한국 사용자들에게는 빠르게 제공 가능하지만 유럽이나 미국 같이 멀리 있는 사용자들에게는 거리가 멀기 때문에 느리게 제공될 것이다. 이런 문제를 해결하기 위해서는 서버와 클라이언트 사이의 거리를 줄여야 한다. 다수의 Cashe Server를 여러 지역에 배치하여 트래픽을 분산시키는 방식으로 말이..
-
Lazy LoadingNote 2021. 4. 13. 10:59
이미지는 모든 웹 사이트와 애플리케이션에서 매우 중요한 요소이다. 그러나 이미지는 페이지 성능에 가장 많은 영향을 주고 있는 요소다. 이미지를 웹 페이지에서 없앨 수는 없기에, 이미지를 그대로 쓰면서 웹 페이지를 빠르게 로딩할 수 있는 방법을 찾아야 한다. Lazy Loading Image Lazy Loading은 페이지 안에 있는 이미지들이 화면에 보일 필요가 있을 때 로딩을 하는 기법(로딩 시점을 뒤로 미루는 것) 유사하게 Lazy Loading은 페이지 내에서 실제로 필요로 할 때까지 리소스의 로딩을 미루는 것이다. Lazy Lodaing의 장점으로는 2가지가 있다. 성능 향상 Lazy Loading을 이용하면 페이지 초기 로딩 시 필요로 한 이미지의 수를 줄일 수 있다. 이것은 디바이스가 다른 리..
-
JSONPNote 2021. 4. 12. 10:38
자바스크립트는 서로 다른 도메인에 대한 요청을 보안상 제한한다. 이 정책을 동일 출처 정책(Same-Origin Policy, SOP)이라고 하며, 이러한 정책으로 인해 생기는 이슈를 cross-domain-issue라고 한다. 개발을 하다 보면 다른 도메인으로부터 데이터를 가져와야 하는 경우가 생기는데 이럴 때 JSONP(JSON with Padding)은 이 이슈를 우회해서 데이터 공유를 가능하게 하였다. JSONP(JSON with Padding) CORS가 활성화되기 이전의 데이터 요청 방법으로, 다른 도메인으로부터 데이터를 가져오기 위해 사용하는 방법 (*CORS: 교차 출처 리소스 공유(Cross-Origin Resource Sharing)는 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 ..
-
Node.insertBefore() 특정 위치에 노드를 삽입Note 2021. 4. 10. 21:13
insertBefore() 참조된 노드 앞에 특정 부모 노드의 자식 노드를 삽입한다. 만약 주어진 자식 노드가 document에 존재하는 노드를 참조한다면, insertBefore()insertBefore()가 자식 노드를 현재 위치에서 새로운 위치로 옮긴다. (노드를 다른 노드에 추가하기 전에 상위 노드에서 제거할 필요가 없음) 문법 var insertedNode = parentNode.insertBefore(newNode, referenceNode); referenceNode 가 null이라면, newNode가 자식 노드의 리스트의 끝에 삽입된다. 예시 let parent = document.querySelector('#parent'); let ele = document.querySelector('...