절대 위치를 잡는 강력한 앵커

프런트엔드 작업에서 풍선 도움말 또는 이와 비슷한 UI를 구현해야 할 일이 참 많다. 풍선 도움말의 위치를 지정하는게 매우 간단할 때도 있지만 그렇지 않을 때도 있다. 절대 위치를 지정해 함에도 auto라는 값으로 대상 요소의 아래나 오른쪽에 딱 붙기를 기대해야 한다. 위쪽이나 왼쪽이어야 할 때는 대략 난감하다.

그렇다면 이제부터 절대위치를 갖는 요소에 대한 강력한 위치 제어 메커니즘을 사용해 보기를 바란다. 출시된지 얼마안된 따끈따끈한 모듈이다.

도구인듯 도구 아닌 도구 같은 너

'AI 이면' 기획 콘텐츠를 통해 주제별 이슈를 글과 관련 기사로 틈틈히 업데이트 하고 있다. 한동안 계속될 데브딕 콘텐츠 업데이트 일정 속에 추가적인 글을 올리지 못했다 이번에는 계속 생각만 하고 있던 AI가 개발자에게 미치는 영향에 대한 현실과 생각을 정리해 보았다.

바이브(vibe) 코딩

바이브(vibe) 코딩이 유행이다. 'vibe'의 사전적 의미는 '분위기', '느낌'이라고 한다. 'vibe coding'을 직역한다면 '분위기 코딩' 또는 '느낌 코딩'이라는 뜻인데 참 묘하다. 코딩도 예술의 영역에 들어온 건가?

이 신조어가 등장하게 된 배경은 AI 코드 어시스턴트(assistant)가 활성화되기 시작되면서이다. 실제 의미는 자연어로 AI 에이전트에게 구현 목표를 설명하고 코드를 제시받는 작업 방식을 뜻한다.

이번 다이제스트에서 'AI의 이면'이라는 기획 콘텐츠에 업데이트된 '코딩하는 개발자에 대한 위협' 글과도 연관된 이야기라고 볼 수 있다. 요지는 AI를 적극 활용하는 한 개발자의 솔직한 생각을 소개하는 것이다.

새로운 작업 방식을 반기지 않을 이유는 없다. 정말로 내게 도움이 된다면 말이다. 개발자가 코딩 작업을 돕는 AI 도구를 끼고 개발 작업을 시도하는 이유는 이러한 기대 때문이다. 그 기대는 확신에 가깝다.

하지만 실제로는 그렇지 않다는 것을 깨닫게 되는 모양이다. 이 깨달음은 원래부터 바이브 코딩 또는 AI를 이용한 코딩 작업 방식을 한번도 시도해 보지 않은 나로서는 의외의 결과로 보였다. IDE의 그 흔한 기능중의 하나인 코드 추천 기능에 대해서 부정적인 입장이라 AI 코딩 도구는 더욱더 나와는 어울리지 않았다. 속내는 편리함에 익숙하면서 기억에 대한 본성을 잃어버릴 것 같다는 강박이 있었기 때문이다.

혹시 AI 코딩 도구를 활용하고자 하거나 이미 활용중인 개발자라면 다음의 글을 꼭 읽어보기를 권한다. 

바이브 코딩 1년째, 서서히 드러나는 'AI 피로'

제너레이터 함수

if() 문은 거의 대부분의 개발 언어에서 기본 구문으로 소개된다. 잘 알다시피 불리언 값을 테스트해 true, false 여부에 따라 실행문을 제어한다. 개발자라면 하루에도 수십번씩 작성하며 모든 제어문이 필요한 곳에서 사용된다. 물론 if() 문을 이야기하고자 하는 것이 아니다.

다음의 코드를 보자. 별 의미없는 코드이다.

calc(10);

function calc(init) {
  let r = init;

  if(r === 10) {
    r += 10;
    console.log(r);
  }

  if(r === 20) {
    r += 100;
    console.log(r);
  }  
}

무슨 일을 하는지 도대체 알 수 없지만 익숙한 코드 스타일이다. 이 코드를 제네레이터 함수를 사용하여 바꾸어 보려 한다. 링크를 열어 보면 마지막 샘플에 해당 코드가 존재한다. 어떤 코드 스타일이 더 좋은지 비교해 보기 바란다.