AI가 개발자를 대체한다? 현업에서 보면 전혀 다른 이야기

 요즘 AI 관련 광고를 보면 공통된 메시지가 있다. “이제 개발자 필요 없다” “AI가 대신 다 만들어준다” 처음 보면 맞는 말처럼 들린다. 코드도 만들어주고, 수정도 해주고, 심지어 앱도 만든다고 한다. 그런데 실제 개발 현장에서 보면 이야기가 완전히 다르다. AI는 분명히 빠르다. 간단한 기능이나 화면 정도는 금방 만들어준다. 검색보다 빠르고, 기본 코드 작성도 훨씬 편해졌다. 문제는 그 다음이다. 실제 서비스는 단순히 “코드가 돌아간다”로 끝나지 않는다. 로그인, 결제, 데이터 처리, 오류 대응까지 들어가는 순간 상황이 완전히 달라진다. 예를 들어 이런 경우가 있다. 기능은 정상적으로 동작하는데 특정 상황에서만 데이터가 저장되지 않는다. 또는 결제는 됐는데 DB에는 기록이 안 남는다. 이런 문제는 AI가 해결해주지 않는다. 오히려 원인을 찾는데 더 시간이 걸리는 경우도 많다. 그리고 더 중요한 건 따로 있다. 고객은 “코드”를 원하는 게 아니다. “문제가 없는 서비스”를 원한다. AI는 코드를 만들어준다. 하지만 구조를 설계하고, 예외를 고려하고, 문제가 생겼을 때 책임지는 건 사람이 해야 한다. 그래서 현업에서는 이렇게 말한다. AI는 도구다. 좋은 도구인 건 맞지만, 개발자를 대체하는 수준은 아니다. 오히려 반대다. AI 덕분에 개발 속도는 빨라졌지만 검수와 안정성의 중요성은 더 커졌다. 결국 개발자의 역할은 사라지는 게 아니라 조금씩 바뀌고 있다. 코드를 직접 다 치는 사람이 아니라 전체를 이해하고 문제를 해결하는 사람이 더 중요해지는 방향이다. 정리하면 이렇다. AI는 코드를 만들어준다. 하지만 서비스를 완성하는 건 여전히 사람이다.

구글 블로거(Blogger)에서 syntax highlight(코드 문법 강조) 적용하기

블로거(Blogger)는 구글에서 운영하는 블로그입니다. 이름은 블로거지만 도메인이 블러그스팟이라  블로그스팟이라고 많이 들 부릅니다.

블러거를 사용해 보시면 글을 작성할 때 아쉬운 기능이 몇 가지 있습니다. 그중에서 가장 아쉬운 기능은 제공하는 에디터에서 프로그래밍 언어를 작성할 때 코드를 입력하는 메뉴가 없다는 것 이였습니다. 프로그래밍 소스는 코드에 따라 알록 달록 색깔이 바뀌어야 제 맛인데 말이죠.

알아보니 몸으로 때워서 syntax highlight(코드 문법 강조)를 적용하는 방법이 몇 가지 있더군요.그 중에서 기능도 막강하고 적용하기도 쉬운 highlight.js를 사용하는 방법을 알아보겠습니다.


1. highlight.js 코드 가져오기

highlight.js 는 구문 번호는 제공하지 않습니다. 구문 번호가 필요하다면 다른 방법을 알아 보셔야 합니다. 하지만 기능은 막강합니다. 그 이유는 조금 있다 알게 되십니다. 다음의 링크로 이동합니다.

https://highlightjs.org/

링크를 쭉 내리시면 아래 그림과 같이 첫 번째 cdnjs 탭이 보이실 겁니다. 

거기에 보이는 다섯 줄의 코드를  복사합니다. 제가 복사해 왔으니 지금은 아래 코드를 사용하셔도 됩니다. 가장 최근 버전입니다.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css"></link>

<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>

<!-- and it's easy to individually load additional languages -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/go.min.js"></script>

<script>hljs.highlightAll();</script>

제가 복사해 온 코드는 <link> 태그 끝에 </link> 태그로 막아줘서 에러가 안 나는데 직접 코드를 복사해 오셨다면  <link> 태그 끝에 </link> 태그 막는 부분이 없습니다. 꼭 </link> 이 부분 넣어 주세요.

2. 나의 Blogger에 적용하기

블로거에 로그인 후 테마를 클릭합니다. 테마를 클릭하고 우측을 보시면 아래 그림과 같이 맞춤 설정 버튼이 보입니다.






버튼을 클릭하면 메뉴가 열리는 데 거기에서 HTML 편집 메뉴를 클릭하시고 html 페이지를 엽니다.

아래 복사해 온 코드를 </head> 바로 위에 붙여 넣습니다. </head> 코드를 찾기 어려우시면 라인 번호가 있는 곳에 보면 <head>와 <body> 등을 접을 수 있는 기능이 있는데 이 기능을 사용하시면 </head>를 쉽게 찾을 수 있습니다

복사해온 코드를 </head> 위에 붙여 넣으셨나요? 이제 저장만 해 주면 끝입니다


사용법: <pre><code>프로그래밍 코드</code></pre>


사용법은 위와 같이 <pre><code>태그로 감싸 주시면 됩니다. 반드시 명심해야 할 것은 HTML 모드에서 작성해야 syntax highlight가 적용된다는 것입니다. 아래 그림에 있는 HTML 보기 버튼을 클릭해야 HTML 모드로 작성하실 수 있습니다.






가장 기초적인 자바 소스로 syntax highlight가 잘 적용 되었는지 확인 해 보겠습니다. 아래는 적용 화면입니다.


적용은 잘 되었는데 화면이 너무 밋밋합니다. 우리가 복사해 넣은 코드 중에 첫 번째 링크 태그 안에 있는 href 속성을 확인해 보십시오. 다음의 url이 보이실 겁니다. 

https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css

default.min.css 로 되어 있습니다. default.min.css 대신에 아래 링크로 들어가서 아무 css나 골라 옵니다.

github.com

저는 stackoverflow-dark.css를 선택해서 아래와 같이 교체했습니다. default.min.css만 지우고 stackoverflow-dark.css라 적어 주시면 됩니다. 아래와 같이 말이죠.

https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/stackoverflow-dark.css

stackoverflow-dark.css를 적용 후의 syntax highlight입니다.

이제 좀 마음에 드네요. 마음에 안들면 마음에 드는 syntax highlight로 css를 교체하시면됩니다. 이 점이 highlight.js 의 강력함 입니다.

PS : 다른 코드는 문제가 없는데 html 코드를 삽입 할 때는 <> 이 태그들이 문제가 되어서 정상 작동을 안 합니다. 꼭 html 태그를 치환해서 사용해야 합니다

https://accessify.com/ 여기가 html 태그를 치환할 수 있는 사이트인데 치환할 수 있는 페이지에 쉽게 가시라고 아래 링크 걸어 둡니다.

https://accessify.com

댓글