Blog

크롬이 웹에서 모달을 없앤다

모달이라고 하면 사이트별로 디자인해서 사용하는 레이어 팝업창이 떠오르지만 여기서 말하는 모달은 alert나 confirm, prompt와 같은 자바스크립트 기능을 말한다. 이 기본 모달이 사용자로 하여금 메시지의 출처를 헷갈리게 해서 보안 위험을 일으키고 있으니 크롬이 이 기능을 없애버리겠다고 한다. 뭔가 "랜섬웨어에 걸리지 않으려면 랜선을 뽑으세요."와 ……

2021-08-21 | Comments (0)

CSS-in-JS와 성능

리액트같은 컴포넌트 기반 도구를 사용할 때 CSS를 JS안에 포함(CSS-in-JS)시키는 도구를 많이 사용한다. CSS를 JS 안에 작성하면 컴포넌트 파일을 하나로 유지하면서 기능과 스타일을 같이 관리할 수 있어서 선호하는 사람이 많다. CSS가 JS안에 포함된 경우와 별도의 파일로 분리된 경우의 성능을 비교를 한 글(Real-world CSS vs. C……

2021-06-28 | Comments (1)

리액트와 스벨트 비교 글 몇 개

"Svelte for the Experienced React Dev" 글의 내용이 좋아서 공감가는 부분을 뽑아 봤다. 가감한 부분이 있어서 보다 자세한 내용은 원글을 보는 것이 좋다. 표준 CSS 구문으로 스타일을 지정할 수 있고 컴포넌트 범위로 스코프가 설정된다. 컴포넌트가 랜더될 때 마다 다시 실행되지 않고 한번만 실행되기 떄문에 메모이즈나 업데이트 조……

2021-06-06 | Comments (2)

우분투에 최신 버전 노드 설치하기

우분투에 apt-get으로 노드(nodejs)를 설치했더니 10.X 버전이다. ESM(ECMAScript Module) 구문에서 오류가 나면서 스벨트킷 앱이 돌지를 않는다. 게다가 npm도 따로 설치해야 한다. 검색해보니 설치할 수 있는 많은 방법 중에 노드소스(NodeSource)에서 배포하는 판을 까는 것이 제일 권장되는 것 같다. 아래와 같이 PPA(……

2021-04-21 | Comments (0)

Accessibility.kr에 스벨트킷 적용

피엠위키(PmWiki)로 구축해놓고 거의 방치되어 있던 Accessibilty Korea에 스벨트킷(SvelteKit)을 적용했다. Accessibility Korea는 예전에 접근성 관련된 일을 많이 할 때 정보화 진흥원에서 하지 않는 일들을 진행해 보려고 야심차게 만든 사이트였지만 많은 활동을 하지는 못했다. 장애인 웹 사용 실태 조사 빼고 나머지 내용……

2021-04-18 | Comments (0)

아이피타임 익스텐더로 와이파이 신호 확장

내 방은 안방 구석의 옷방이다. 코로나 덕분에 재택을 많이 하는데 내 방에서 와이파이가 잘 잡히지 않는다는 문제가 있다. 업무용 노트북은 랜선으로 연결했지만 핸드폰이나 테스트용 기기는 와이파이가 약해서 제대로 사용할 수가 없다. 와이파이를 어떻게 확장할 수 있을지 이것 저것 생각해 봤는데, 인터넷 서비스 업체에 무선 단말기를 바꿔달라고 할 수 있지만 알아보……

2021-03-24 | Comments (0)

IE에서 스벨트 실행하기

뷰(Vuejs)는 기본값으로 IE9를 지원하지만 스벨트(Svelte)는 IE에서 구동이 안되어서 내부 프로젝트에만 쓰고 있었다. 이번에 IE를 지원하는 앱을 리팩토링해야 해서 뷰를 걷어내고 스벨트를 적용해보려고 IE에서 작동하게 하는 방법을 찾아봤다. 보통은 바벨로 트랜스파일하지만 리치 해리스가 버블(Buble)이라는 프로젝트도 만들었다는 것을 듣고 버블을……

2021-02-06 | Comments (1)

스태틱 파일 버저닝

스태틱 파일을 변경하고 배포를 하면 클라우드 플레어가 캐시를 하고 있어서 바로 적용이 안되고 수동으로 캐시 삭제를 해줘야 적용이 됐다. 자주 하는 일은 아니어서 손으로 해오다가 스태틱 파일 버저닝을 해보기로 했다. 파이선 환경이니 플라스크에서 사용할 수 있는 기능이 있는지 검색해 봤다. 플라스크 오토버저닝(Flask-Autoversion)이라는 패키지가 있……

2021-01-30 | Comments (0)

2020년 CSS 트랜드

자바스크립트 트랜드를 조사해서 공유하는 자바스크립트 트랜드(State of JavaScript) 사이트에서 CSS에 대한 조사도 한다는 것을 발견해서 설문에 참여했었는데 2020년 CSS 트랜드(State Of CSS 2020) 결과가 나와서 살펴봤다. 먼저 나의 의도가 다분히 들어간 해석을 할 것이기 떄문에 나에 대해서 간단히 언급하는 것이 좋은 사전 정……

2021-01-19 | Comments (0)

원숭이섬의 비밀 SE

하드 정리하다가 원숨이섬의 비밀 SE(The secret of Monkey Island sepcial edition)가 있길래 플레이 해봤다. 어렸을 때는 엄청 오래 했던거 같은데 플레이 타임은 생각보다 짧아서 하루만에 클리어되는 분량이다. 게임 하면서 화면이 예뻐서 열심히 캡춰했는데 유투브에 원숭이섬의 비밀 SE 플레이 영상이 이미 많아서 굳이 필요가 없……

2020-12-19 | Comments (0)

이전글