분류 전체보기 (33) 썸네일형 리스트형 Overview of the RenderingNG architecture (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://developer.chrome.com/blog/renderingng-architecture/ 저작권 정보: https://developers.google.com/terms/site-policies 이 글은 크롬 렌더링 엔진에 있는 시리즈의 일부분이다. 렌더링NG, 주요 데이터 구조, VideoNG 및 LayoutNG에 대해 자세히 알아보려면 나머지 시리즈를 확인하십시오. 이전 게시물에서는 렌더링NG 아키텍처 목표와 주요 속성에 대한 개요를 제공했다. 이 게시물에는 구성 요소 조각의 설정 방법과 렌더링 파이프라인이 어떻게 구성 요소를 통과하는지 설명된다. 가장.. LocalStorage vs. Cookies: All You Need to Know About Storing JWT Tokens Securely in the Front-End (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://indepth.dev/posts/1382/localstorage-vs-cookies 저작권 정보: https://indepth.dev/ 제 이전 글에서는 OAuth 2.0이 어떻게 동작하는지 살펴보고 액세스 토큰과 리프레시 토큰을 생성하는 방법을 알아보았습니다. 이제 토큰을 프런트 엔드에 저장하는 방법에 대해 살펴보겠습니다. 액세스 토큰은 일반적으로 서버가 서명한 것으로 만료 기한이 짧은 JWT 토큰이고, 요청에 권한을 부여하기 위해 서버로 보내는 모든 HTTP 요청에 포함됩니다. 리프레시 토큰은 일반적으로 DB에 저장되어 있으며 만료 기한이 긴 이해하기 어.. RenderingNG - Ready for the next generation of web content(한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://developer.chrome.com/blog/renderingng/ 저작권 정보: https://developers.google.com/terms/site-policies 이 글은 크롬 렌더링 엔진에 있는 시리즈의 일부분이다. 나머지 시리즈에서 렌더링NG 아키텍처, 주요 데이터 구조, VideoNG 및 LayoutNG에 대해 자세히 알아보십시오. 나는 Chris Harrelson이고, Blink의 Rendering (HTML과 CSS를 픽셀로 변환)의 엔지니어링 리더 입니다. 나는 웹에서 우수한 UX를 더 빠르고, 더 쉽고, 더 신뢰할 수 있게 전달하기 위.. Reactivity In Vue (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://www.smashingmagazine.com/2021/03/reactivity-in-vue/ 저작권 정보: https://www.smashingmagazine.com/ 요약 반응성은 변수(array, string, number, object 등)의 값이나 참조하는 다른 변수가 선언 이후에 변경이 일어났을 때, 변수를 업데이트하는 기능입니다. 이 글에서, 우리는 Vue의 반응성(reactivity)에 대해, 그것이 어떻게 동작하는지, 그리고 새로운 메서드와 함수를 이용해서 어떻게 반응성 있는 변수를 만들 수 있는지 알아보겠습니다. 이 글은 2 버전대 Vue가 .. Nested Gradients with background-clip / background-clip (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://css-tricks.com/almanac/properties/b/background-clip/ https://css-tricks.com/nested-gradients-with-background-clip/ 저작권 정보: https://css-tricks.com/license/ ※ 번역전 사족 background 속성을 이용해 border에 gradation 을 주는 재미있는 글이 있어 가지고 와봤습니다. :) 해당 글을 이해하려면 background-clip 속성의 이해가 필요해서 이번에는 두개의 포스팅을 번역해봤습니다. 사실 border에 gradation.. Building A Dynamic Header With Intersection Observer (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://www.smashingmagazine.com/2021/07/dynamic-header-intersection-observer/ 저작권 정보: https://www.smashingmagazine.com/privacy-policy/ 빠른 요약 ↬ 뷰포트 내의 특정 임계값으로 스크롤할 때 페이지의 일부 구성요소가 요소에 응답해야 하는 UI를 구축해야 하는 경우 또는 뷰포트 자체 내부 및 외부 UI를 구축해야 하는 경우 자바스크립트에서, 스크롤에 콜백을 계속 발사하기 위해 event listener를 부착하는 것은 성능 집약적일 수 있으며, 현명하지 못한 방법으로 .. Front-End Testing is For Everyone (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://css-tricks.com/front-end-testing-is-for-everyone/ 저작권 정보: https://css-tricks.com/translate-an-article/ 테스트는 당신을 매우 신나게 하거나 혹은 눈을 감고 외면하게 하는 것들 중 하나입니다. 당신이 어느 캠프에 들어갔든, 저는 당신에게 프런트엔드 테스트는 모두를 위한 것이라고 말하기 위해 왔습니다. 많은 종류의 테스트들이 있고, 아마도 이것이 진입장벽 중 하나일 것입니다. 저는 이 글에서 가장 유명하고 널리 사용되는 테스트들을 다루려고 합니다. 몇몇 분들에게는 새로운 것이 아닐 .. The Last Guide For Angular Change Detection You'll Ever Need (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://www.mokkapps.de/blog/the-last-guide-for-angular-change-detection-you-will-ever-need/ 저작권 정보: 원문 작성자인 Michael Hoffmann 에게 번역 허락을 받았습니다. ※ Change Detection 은 '변화 감지' 로 번역했습니다. 참고 부탁드립니다. Angular의 변화 감지(Change Detection) 은 프레임워크의 핵심 메커니즘 (적어도 제 경험에 따르면요)이지만 매우 이해하기 힘듭니다. 불행히도, 이 주제에 관해서는 공식 웹사이트에선 공식적인 가이드는 없습니다. 이 블.. Implementing Private Fields for JavaScript (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: https://hacks.mozilla.org/2021/06/implementing-private-fields-for-javascript/ 저작권 정보: https://creativecommons.org/licenses/by-sa/3.0/ 이 게시물은 Matthew Gaudet의 블로그에서 교차 게시되었습니다. JavaScript용 언어 기능을 구현할 때, 구현자는 사양의 언어가 구현에 매핑되는 방법에 대한 결정을 내려야 합니다. 때로는 사양과 구현이 동일한 용어와 알고리즘의 대부분을 공유할 수 있는 상당히 간단한 방법이기도 합니다. 또한 구현에 대한 압박으로 인해 구현 .. Node-Sass or Dart-Sass : The CSS Preprocessor Dilemma (한글) 이 글은 아래 원문을 번역한 글로 의역이 있을 수 있습니다. 정확한 의미를 파악하고 싶으신 분은 원문을 참고해주시기 바랍니다. 원문: Node-Sass or Dart-Sass : The CSS Preprocessor Dilemma 저작권 정보: 원문 작성자인 Ali Bahraminezhad에게 번역을 허락받았습니다. 1년 좀 더 전에, 스택오버플로우에서 Vue CLI에 Node-Sass를 사용할지, Dart-Sass를 사용할지에 대한 질문에 답변을 한 적이 있습니다. 많은 추천을 받았기에, 이 주제에 대해 좀 더 깊이 생각해볼 가치가 있다고 생각했습니다. 개요 이 글은 Sass와 Sass의 전처리기 구현체, Dart-Sass와 Node-Sass에 관한 글입니다. 그럼, CSS 전처리기란 무엇일까요? CS.. 이전 1 2 3 4 다음 목록 더보기
