거의 1년 반만에 플젝 현업 복귀해서 느낀 점

[ 이글은 2020년 10월 29일에 최종 수정되었습니다. ]
§

저는 작년 여름 부터 변호사로 복귀해 1년동안 변호사로 열심히 일했습니다. 거의 매일 다운타운으로 출퇴근 하다가 “다행히?” 코로나 사태로 인해 올해 봄 부터 자택근무를 할 수 있게 되었고, 제가 취직한 법률단체의 특성 상 1년동안 벌써 세번이나 법원에 나가 재판을 하기도 했습니다. (미국 변호사들 중, 재판을 자주보는 변호사는 많지 않습니다.)

그러다 2개월전 아주 괜찮은 새로운 스타트업의 웹사이트와 앱 구축 의뢰를 받게 되어 현재는 잠시 휴직계를 내고 예전에 같이 일하던 제 팀원들을 불러모아 다시 개발자로 현업에 복귀해서 신나게 일했습니다.

이 플젝은 이제 시마이 마무리 단계에 이르렀고, 2주 후면 저는 다시 변호사로 복귀해야 합니다. ㅠㅠㅠㅠ

이번 플젝에 팀리더/front-end lead (프론트 lead 라고 해봐야 제 보조 역활을 한 다른 팀원 한명: 직함만 거창함. ㅋㅋㅋ) 로 이 플젝을 진행하며 느낀 점 몇가지를 공유합니다.

1. Modernizr

테마를 from scratch (아무런 기초 없이 아예 처음부터 시작) 부터 제작하면서 functions.php 에 modernizr 를 enqueue 할까 말까 고민하다가 혹시 몰라 포함시키고 출발 했습니다.

최근 1-2년 사이 front-end 개발자들로 부터 가장 많이 버림받은 Modernizr. 물론 그 이유는 IE 의 몰락때문이죠.

Source: StatCounter Global Stats – Browser Market Share

StateCounter 에서는 통계에 잡히지도 않고, 예전부터 IE 점유율을 가장 후하게 쳐주던 Net Marketshare 의 통계를 봐도 IE 의 시장 점유율은 3.88% 밖에 되지 않습니다.

그래서 사실 요즘 미국 대기업 플젝도 Modernizr 를 쓸 이유가 없어졌습니다. (예전부터 특별한 니즈가 없는 경우, 시장 점유율 5% 미만 브라우져는 대응을 해주지 않는게 관례 입니다.)

그래서 왜 아직까지 Modernizr 가 존재하는지 그 이유도 모르겠지만, 아무튼 지금, 2020년도에도 존재해 주니, 저는 고맙게 사용하게 되었습니다. (그 이유는 한국쪽 웹사정 때문.)

저희의 플젝의 주 audience 는 글로벌 이지만, 한국쪽 audience 도 신경을 써야 하는데, 한국은 아직도 IE 사용률이 두자리 숫자더군요. 허거걱…

출처: Korea HTML5

그래서 며칠전 IE 11 상황이 어떤지 IE 11 으로 사이트를 열어보니, 이건 뭐 레이아웃 다 깨지고, js 먹통이고… ㅋㅋㅋㅋ

하.. 이 ㄱ 같은 IE. 이러면서 반나절 정도 크로스 브라우징 작업을 해야 했는데… 훔… 예전 IE7/8 시절과는 비교도 안되게 작업이 수월했습니다. 솔직히 말해서 너무 싱겁게 끝나버렸습니다. (나때 IE 6 시절에는 말이야… 라는 댓글 기대해 봅니다. ㅋㅋㅋ)

2. Babel

flexbox IE 버그 나는거 잡아주고, IE 가 인식 못하는 ES5 (arrow function 같은거) 를 예전 legacy (ES4 라고도 하죠) 로 변환해주니 작업끝.

Transpiler 없이 ES5 를 legacy 로, 혹은 ES5 를 ES6 로 가장 간편하게 변환해주는 도구는 Babel 이라고 생각됩니다. 다운로드 필요 없이 온라인에서도 변환이 가능한데, 갖고 계신/사용하시는 js code base 가 많으시면, local 에 설치해서 사용하는 것을 권하고 싶습니다.

VScode 를 IDE 로 쓰시면, VScode extension 으로 설치하는게 가장 간편합니다.

https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel

3. SVG

2년, 3년전 이나 IE 에서 SVG 관련 filter, scale, animation 등이 지원되지 않는 문제는 지금도 달라진게 하나도 없습니다. filter 는 css 로 먹히지 않으니 SVG 자체에 내장해서 IE 11 에서 표현해주는 방법이 있고 scale 은 SVG 의 size attribute 을 삭제한 후, width 값을 100%로 주는 해결책이 존재하지만, animation 이 표현되지 않는 문제는, GSAP 등의 무거운 library 를 이용하지 않고는 방법이 없습니다. 2017년이나 지금이나 SVG 에 한해서는 IE 11 이 전혀 바뀌지 않은거죠.

아무튼 마소 크로스브라우징은 빌게이츠를 욕을 해가면서 해야 제맛인데, 이제는 그럴일도 없더군요. 그나마 아직 IE11 이 살아있으니 크로스브라우징도 하지, IE11 이 한국에서도 사라지면 크로스브라우징 이란 단어 자체가 사라질 듯 합니다. ㅠㅠㅠㅠ

내년 8월 (정확하게 8월 17일 2021년) 에는 전세계 FE 들이 IE 가 공식 소멸되었음을 기뻐하며 여러 축제/파티 를 열게 될 것 같습니다. 10년도 넘게 frontender 들을 괴롭혀온 IE 의 지원을 마소가 중단하는 날 이니까요. IE 11 사망 카운트 다운 시계

(사실 지금도 유튜브, 페북, 인스타 등, 천여개가 넘는 사이트를 IE 11 으로 접속이 되지 못하도록 마소가 자체적으로 막고 있습니다. 관련 마소 공지)

그런데 크로스브라우징이 사라지면 뭔 재미로 front-end 코딩을 하죠? ㅋㅋㅋㅋ/ㅠㅠㅠㅠ

hackya 는

Attorney, front-end developer, digital media artist, WordPress enthusiast, & a father of 4 wonderful children.

Tags: , , ,

카테고리:

Ω

Leave a Reply

Your email address will not be published. Required fields are marked *