Frameworkers, 주목! “베어” 코드가 진정한 사치일 때

Source: Dev.to

왜 나는 베어‑본스 사이트를 만들었는가

어젯밤, 갑작스러운 영감이 떠올라 나는 toviszsolt.com 에 새로운 웹사이트—내 개인 허브—를 만들기로 했다. 큰 계획도, Jira 티켓도 없었고, 가장 중요한 것은 프레임워크가 전혀 없었다.
React도, Vue도, Angular도 전혀 없었다. Tailwind 클래스 하나조차 쓰지 않았다.

대신 기본으로 돌아갔다: 원시 HTML, 커스텀 CSS, 그리고 아주 최소한의 JavaScript.

순수 HTML, CSS, JavaScript의 즐거움

왜? 20년이 넘는 경력을 가진 수석 소프트웨어 아키텍트이자 직접 코딩하는 풀‑스택 엔지니어로서, 나는 가끔 개발이 실제로 무엇인지 스스로에게 상기시켜야 할 때가 있다.

오랫동안 이 업계에 몸담다 보면, 창작이 주는 단순하고 어린아이 같은 기쁨—코드를 한 줄 입력하고, 브라우저를 새로 고침했을 때 “뿅, 바로 보인다”—를 잊기 쉽다.

• 빌드 프로세스가 없다.
• npm install 로 인터넷 절반을 다운로드하지 않는다.
• Webpack을 기다릴 필요도 없다.

그냥 너와 코드뿐이다. 기술과의 이 직접적인 연결은 목공이 산업용 기계 대신 손 대패를 사용하는 것과 같다. 느리게 하기 위해 하는 것이 아니라, 나무 결을 느끼기 위해 하는 것이다. 순수 HTML과 CSS를 사용하면 그 제어권을 되찾는다. 모든 일이 왜 일어나는지 정확히 알 수 있고, 2픽셀 정도 차이가 나면 라이브러리 문서를 뒤적일 필요 없이 바로 마진을 고칠 수 있다.

프레임워크가 적절한 경우

오해하지 말라, 나는 현대적인 도구들을 사랑한다. 프레임워크(예: Next.js)가 적이 아니다. 복잡성, 확장성, 팀 협업 문제를 해결하기 위해 만들어졌다.

은행 시스템, 복잡한 SaaS 제품, 혹은 Stacklegend 같은 대규모 엔터프라이즈 포털을 구축한다면 프레임워크를 사용하지 않을 수 없을 것이다. 그런 경우 구조, 상태 관리, 컴포넌트 기반 사고가 생명을 구한다.

과도한 도구 사용의 위험

소개 페이지, 랜딩 페이지, 혹은 간단한 포트폴리오를 만들 때 프레임워크를 띄우는 것은 마치 sparrow(참새)를 죽이기 위해 대포를 쓰는 것과 같다. 우리는 불필요한 레이어를 사용자와 우리 사이에 쌓아두기만 한다, 할 수 있기 때문에.

나는 개발자들이 도구의 바다에 빠지는 모습을 자주 본다. 그들은 “Frameworkers”가 되어 버리고, 엔지니어가 아니다. 프레임워크의 규칙은 익히지만, 그 뒤에서 엔진을 움직이는 것이 무엇인지 잊어버린다.

원시 기술에 뿌리를 두기

프레임워크를 사용하더라도, 기본이 되는 “원시” 기술을 알아야 한다는 점이 중요하다:

• CSS Grid와 Flexbox를 이해한다면 UI 키트의 제한에 휘둘리지 않는다.
• 네이티브 DOM manipulation을 이해한다면 Virtual DOM이 느려질 때를 알 수 있다.
• semantic HTML을 이해한다면 SEO와 접근성을 사후 생각이 아니라 처음부터 고려한다.

결론

내가 미쳤냐고 묻는가? 나는 이 길을 마조히즘 때문에 선택한 것이 아니다. 단지 다른 것이 필요 없었기 때문이다. 고통을 위해 CSS를 손으로 작성한 것이 아니라, 빠르고 깔끔하며 정보 전달이 명확한 사이트가 필요했기 때문이다.

그 결과는 번개처럼 빠른 웹사이트가 되었으며, 불필요한 부피가 없고, 5년 후에도 의존성이 사라진 것을 걱정하지 않고 쉽게 편집할 수 있다.

그러니, Frameworkers 여러분, 때때로 “벌거벗은” 코딩에 도전해 보라. 얼마나 해방감이 느껴지는지 놀라게 될 것이다.

Happy coding!