Programming147

• 

  [HTML]  (non-breaking space, 줄 바꿈 없는 공백)이란? FE 개발을 하다 보면 JSX나 HTML에 명시적으로 공백을 표시해야 할 때가 있다. 텍스트 요소 길이가 너무 길 때 줄을 바꾸고 그곳에 nbsp를 쓰는 식이다. nbsp가 정확히 무엇을 의미하는지와 사용해야 하는 경우, 사용하면 안 되는 경우를 알아 보았다. 1. nbsp란? nbsp는 사실 공백을 표시하는 데 쓰는 것이 아니다. 하지만 공백의 역할을 한다. nbsp를 쓰면 공백이 표시됨과 동시에 그 위치에서는 줄 바꿈이 일어나지 않아 그 이전 공백이나 이후 공백에서 줄 바꿈이 일어나게 한다. 그러니까 극단적으로 한 p 태그 안의 모든 공백을 nbsp로 대체해 표시하면, p 태그의 콘텐츠가 p 태그를 감싸고 있는 div의 오른쪽 바깥을 한 줄로 뚫고 나가게 된다. 줄 바꿈 없는 공백을 HTML이 인식할.. Programming/HTML, CSS 2024. 3. 26.

• 

  [HTML] <a> 태그 'target' 요소 target 요소는 주로 _blank를 사용해서 새로운 탭에서 페이지를 열려고 할 때 말고는 사용한 적이 거의 없었다. 하지만 이번에 기능 하나를 개발하면서 다른 요소를 사용해야 하는 경우를 만나서 mdn을 보고 정리해 보았다! 의미 target 요소는 링크한 URL을 표시할 '위치'를 말한다. 위치는 브라우징 맥락을 말하는데, 탭, 창, 의 이름 등이 될 수 있다. target 요소에는 총 네 가지 값이 들어갈 수 있다. _self: URL을 현재 브라우징 맥락에 표시한다. (기본값) _blank: URL을 새로운 브라우징 맥락에 표시한다. 보통 새 탭이지만, 사용자가 브라우저 설정을 통해 새 창으로 바꿀 수 있다. _parent: URL을 현재 브라우징 맥락의 부모에 표시한다. 부모가 존재하지 않으면.. Programming/HTML, CSS 2024. 1. 27.

• 

  [WIP] [JavaScript] 모던 자바스크립트 Deep Dive 02장 자바스크립트란? 비록 다른 객체지향 언어와의 차이점에 대한 논쟁이 있긴 하지만 자바스크립트는 강력한 객체지향 프로그래밍 능력을 지니고 있다...상속, 정보 은닉을 위한 키워드가 없어서 객체지향 언어가 아니라고 오해하는 경우도 있지만 자바스크립트는 클래스 기반 객체지향 언어보다 효율적이면서 강력한 프로토타입 기반의 객체지향 언어다. -p.15 브라우저와 Node.js 모두 자바스크립트의 코어인 ECMAScript를 실행할 수 있지만 브라우저와 Node.js에서 ECMAScript 이외에 추가로 제공하는 기능은 호환되지 않는다. -p.17 03장 자바스크립트 개발 환경과 실행 방법 간단한 웹 애플리케이션은 브라우저만으로도 개발할 수 이싿. 하지만 프로젝트의 규모가 커짐에 따라 React, Angula.. Programming/Javascript, Typescript 2024. 1. 2.

• 

  [JavaScript] JavaScript Cheatsheet (ES6-ES10) Programming/Javascript, Typescript 2023. 12. 26.

• 

  [CSS] 속성 선언 순서 CSS 속성의 선언 순서를 스스로 정리해 본 적이 없는 것 같아 네이버의 CSS 코드를 참고해 정해 보았다. 평소 best practice나 클린 코드 관련 글들에서 읽은 것과 결이 같아 좋은 기준이 될 것 같다. display - 표시(관련 속성: visibility) overflow - 넘침 float - 흐름(관련 속성: clear) position - 위치(관련 속성: top, right, bottom, left, z-index) width & height - 크기 margin & padding(그룹) - 간격 border(그룹) - 테두리 background(그룹) - 배경 font(그룹) - 폰트(관련 속성: color, letter-spacing, text-align, text-decorat.. Programming/HTML, CSS 2023. 11. 12.

• 

  JWT(JSON Web Tokens), OAuth(Open Authorization) Programming/ETC 2023. 9. 24.

• 

  [Low-code] 로우 코드 서비스 개발 툴, Retool 최근에 low-code 툴인 'Retool'에 대해 알게 되었다. admin 페이지 등 UI를 직접 개발할 필요 없이 약간의 JS와 SQL 지식만으로 웹 페이지를 만들고 운영할 수 있는 툴이라고 한다. 데이터에 관한 여러 대시보드를 만들 수 있을 뿐만 아니라 데이터를 직접 조작할 수도 있다. 홈페이지 https://retool.com/ Build any business software, remarkably fast. Retool is the fast way to build internal tools. Drag-and-drop our building blocks and connect them to your databases and APIs to build your own tools, instantly. C.. Programming/ETC 2023. 8. 28.