“재호야, 문제 원인은 찾았니? 언제까지 고칠 수 있겠니?”
“휴… 잘 모르겠어요.”
“난 네가 모르겠다고 말하는 게 제일 무서워.”

저에게는 이사님이 제 자리에 와서 언제까지 되겠니 묻는 게 가장 무서운 순간이었는데…
이사님은 제가 잘 모르겠다 말하는 게 가장 무섭다고 합니다.
서로가 무서운 이 웃픈 상황.

늦어도 좋으니 제발 일정을 알려 달라고.
이사님의 입장도 이해는 했습니다. 일정이 정해져야 영업팀과 운영팀에 알려서 고객들과 커뮤니케이션을 할 테니까.
하지만 정말 모르겠는 걸 어떡해… 함부로 말하다가 약속을 못 지키면?
그야말로 죽을 맛이었습니다. 어디가 문젠지 짐작도 안 가는데, 일정의 독촉은 계속 되고...
개발하면서 이렇게 스트레스받았을 때가 있었던가?

그건 파일 시스템 드라이버를 만들 때 였습니다.
(N:에 마운트 하는 네이버 클라우드 탐색기를 떠올리시면 됩니다.)

윈도우를 며칠간 사용하다 보면 메모리가 사용량이 조금씩 높아진다는 제보들이 있었습니다.
처음엔 그게 우리 드라이버 때문인지 믿을 수가 없었습니다.
하지만 사내 사용자들의 제보도 계속 이어졌고, 문제를 찾기 위해 애쓰는 날들이 계속됐습니다.

애플리케이션과는 달리 커널 코드에서 메모리가 새면 찾기도 어려울뿐더러 컴퓨터를 껐다 켜기 전까지는 해소가 되지 않습니다. 지옥 같은 날들을 지나, 결국 어떤 부분에서 그러는지를 찾아냈습니다.

버그 제보를 받은 날부터 고치기까지 한 달쯤 걸렸던가?
아침에 눈을 뜨면 한숨부터 나오면서 회사 가기가 무서웠던 날들이었습니다.

오늘 편안하게 앉아서 창밖을 바라보다 문득 이때 생각이 났습니다.
회사를 그만두고 이런 압박이 없어져서 정말 다행입니다만… 생각해 보니 이런 압박 덕분에 결국 문제를 해결해 내고 성장할 수 있었던 것 같습니다.
그래도 이 정도로 스트레스받아가며 여생을 살고 싶진 않네요. (웃음)

* TMI 토킹
오래된 기억이지만 문제는 FsRtlNotifyFullReportChange 의 구현 때문이었습니다.

만약 똑같은 경로에서 윈도 탐색기 두 개를 열어 놓고,
한 쪽에서 파일 하나를 생성하면 다른 쪽 탐색기에서도 새로 만들어진 파일이 곧장 보여야 합니다.

이건 윈도 탐색기가 ReadDirectoryChangesW 함수를 잘 구현해 줬기 때문에 되는 일이기도 하지만, 파일 시스템에서도 FsRtlNotifyFullReportChange 를 구현해 줘야만 합니다.
파일 시스템에서 이 부분을 구현 안 하면 애플리케이션에서 아무리 디렉터리 변경을 기다리고 있더라도 통지가 오지 않게 되는 것입니다.
이 함수를 어떻게 구현해야 한다고 자세하게 알려주는 문서는 없었습니다. 우리는 다행히 이 부분을 잘 구현해둬서 파일 알림 통지가 잘 되고 있었는데… 통지만 잘 될 뿐 여기서 메모리가 새고 있었던 것입니다. 너무 적게 새어나가고 있어서 찾을 수가 없을 정도로.
이 버그를 완전히 고쳤을 때 얼마나 기뻤던지.

“재호야, 문제 원인은 찾았니? 언제까지 고칠 수 있겠니?” “휴… 잘 모르겠어요.” “난 네가 모르겠다고 말하는 게 제일 무서워.” 저에게는 이사님이 제 자리에 와서 언제까지 되겠니 묻는 게 가장 무서운 순간이었는데… 이사님은 제가 잘 모르겠다 말하는 게 가장 무섭다고 합니다. 서로가 무서운 이 웃픈 상황. 늦어도 좋으니 제발 일정을 알려 달라고. 이사님의 입장도 이해는 했습니다. 일정이 정해져야 영업팀과 운영팀에 알려서 고객들과 커뮤니케이션을 할 테니까. 하지만 정말 모르겠는 걸 어떡해… 함부로 말하다가 약속을 못 지키면? 그야말로 죽을 맛이었습니다. 어디가 문젠지 짐작도 안 가는데, 일정의 독촉은 계속 되고... 개발하면서 이렇게 스트레스받았을 때가 있었던가? 그건 파일 시스템 드라이버를 만들 때 였습니다. (N:에 마운트 하는 네이버 클라우드 탐색기를 떠올리시면 됩니다.) 윈도우를 며칠간 사용하다 보면 메모리가 사용량이 조금씩 높아진다는 제보들이 있었습니다. 처음엔 그게 우리 드라이버 때문인지 믿을 수가 없었습니다. 하지만 사내 사용자들의 제보도 계속 이어졌고, 문제를 찾기 위해 애쓰는 날들이 계속됐습니다. 애플리케이션과는 달리 커널 코드에서 메모리가 새면 찾기도 어려울뿐더러 컴퓨터를 껐다 켜기 전까지는 해소가 되지 않습니다. 지옥 같은 날들을 지나, 결국 어떤 부분에서 그러는지를 찾아냈습니다. 버그 제보를 받은 날부터 고치기까지 한 달쯤 걸렸던가? 아침에 눈을 뜨면 한숨부터 나오면서 회사 가기가 무서웠던 날들이었습니다. 오늘 편안하게 앉아서 창밖을 바라보다 문득 이때 생각이 났습니다. 회사를 그만두고 이런 압박이 없어져서 정말 다행입니다만… 생각해 보니 이런 압박 덕분에 결국 문제를 해결해 내고 성장할 수 있었던 것 같습니다. 그래도 이 정도로 스트레스받아가며 여생을 살고 싶진 않네요. (웃음) * TMI 토킹 오래된 기억이지만 문제는 FsRtlNotifyFullReportChange 의 구현 때문이었습니다. 만약 똑같은 경로에서 윈도 탐색기 두 개를 열어 놓고, 한 쪽에서 파일 하나를 생성하면 다른 쪽 탐색기에서도 새로 만들어진 파일이 곧장 보여야 합니다. 이건 윈도 탐색기가 ReadDirectoryChangesW 함수를 잘 구현해 줬기 때문에 되는 일이기도 하지만, 파일 시스템에서도 FsRtlNotifyFullReportChange 를 구현해 줘야만 합니다. 파일 시스템에서 이 부분을 구현 안 하면 애플리케이션에서 아무리 디렉터리 변경을 기다리고 있더라도 통지가 오지 않게 되는 것입니다. 이 함수를 어떻게 구현해야 한다고 자세하게 알려주는 문서는 없었습니다. 우리는 다행히 이 부분을 잘 구현해둬서 파일 알림 통지가 잘 되고 있었는데… 통지만 잘 될 뿐 여기서 메모리가 새고 있었던 것입니다. 너무 적게 새어나가고 있어서 찾을 수가 없을 정도로. 이 버그를 완전히 고쳤을 때 얼마나 기뻤던지.

언제까지 고칠 수 있겠니?

출근길에 … 언제까지 고칠 수 있겠니라는 문구보고 아찔해져서 들어왔습니다,,,

Vite가 Webpack이나 Parcel과 같은 기존 번들러(bundler)를 위협하며 자바스크립트 생태계에서 차세대 빌드 도구로 빠르게 부상하고 있습니다. Vite는 빠른 개발 서버와 빌드 최적화를 제공하여 현대적인 프론트엔드 개발에 핵심적인 도구로 자리 잡고 있는데요. 이번 영상에서는 Vite를 처음 사용하시는 분들의 위해서 Vite로 웹 프로젝트를 시작하는 아주 기초적인 방법을 알려드리겠습니다.

📺 동영상: https://youtu.be/aRU-kWZQHn8
📝 포스팅: https://www.daleseo.com/vite/

Vite가 Webpack이나 Parcel과 같은 기존 번들러(bundler)를 위협하며 자바스크립트 생태계에서 차세대 빌드 도구로 빠르게 부상하고 있습니다. Vite는 빠른 개발 서버와 빌드 최적화를 제공하여 현대적인 프론트엔드 개발에 핵심적인 도구로 자리 잡고 있는데요. 이번 영상에서는 Vite를 처음 사용하시는 분들의 위해서 Vite로 웹 프로젝트를 시작하는 아주 기초적인 방법을 알려드리겠습니다. 📺 동영상: https://youtu.be/aRU-kWZQHn8📝 포스팅: https://www.daleseo.com/vite/

Vite 처음 시작하기

10년 전 오늘 담배를 마지막으로 피웠습니다.
12월 31일 자정은 카톡 트래픽이 피크를 치는 순간입니다.
해가 넘어가는 순간을 사무실에서 동료들과 함께하곤 했습니다.

10년 전 오늘, 23시 40분.
동료들에게 말하지 않고 홀로 슬그머니 H스퀘어 1층으로 내려가서 마지막 담배를 피웠습니다.
이게 진짜 마지막이다.

생각해 보면 담배를 피우면서 좋다, 행복하다는 느낌을 받은 적이 없는데…
수도 없이 끊으려 노력했지만 번번이 실패했습니다.
그렇게 기침을 콜록콜록 해대고, 아빠가 폐암으로 돌아가신 걸 알면서도.
이날 드디어 저와의 약속을 지킬 수 있었습니다.

금연 이후 10년 동안 꿈에서 가끔 담배를 피웠습니다. 아주 실감나게.
깨어나면 꿈이었다는 걸 깨닫고 가슴을 쓸어내리곤 했습니다.
참나, 담배는 평생 참는 거라더니. 이렇게 빠져나오기가 힘든 건가?

이제라도 빠져나와서 정말 다행입니다.
10년 전 그날의 저를 만나러 간다면 꼭 안아주면서 칭찬해 주고 싶습니다.
이게 지금부터 10년 동안 네가 한 가장 잘한 일이 될 거라고.

담배만 문제가 아니었습니다.
결혼하고 육아를 하면서 술이 점점 늘어갔습니다.
육아는 솔직히 재미없었습니다. 특히 만 1년이 되기 전의 육아는 절대 다시 돌아가고 싶지 않은 시간입니다.
아기랑 까꿍 까꿍 웃는 행복한 모습이 상상될지도 모르겠지만…
현실은 똥기저귀나 갈아주고 아무것도 못 하고 옆에 붙어 있는 것 밖에 없거든요.

이때 술도 많이 마셨습니다. 일상이 너무 지루해서. 어차피 할 수 있는 다른 일도 없으니까.
그러다가 술의 구렁텅이에 빠져버리고 말았습니다.

잠들기 전에 매일 술을 마셨습니다.
성시경의 먹을텐데 같은 방송은 제 마음을 편하게 해줬습니다.
매일 술 먹는 사람들이 생각보다 많았구나. 저렇게 마셔도 건강하구만 뭘.

그러다가 살도 많이 찌고 혈당 수치도 안 좋아지면서 이제는 멈춰야 한다고 생각했습니다.

담배를 끊은지 10년, 술을 끊은지는 2년이 되었습니다.
더 이상 기침을 콜록콜록하지 않게 되었고, 체중도 전성기 때로 돌아왔습니다.

더 어릴 때 버핏 할아버지의 조언을 들었다면 참 좋았을 것 같습니다.
늦었지만 이제부터라도 제 몸을 소중하게 잘 관리해 보려 합니다.
커리어리 구독자분에게도 소개해 드리고 싶습니다. 새해 복 많이 받으시고, 건강하십시오.

"70년 전 내가 고등학생 때, 내 머릿속에는 딱 두 가지 밖에 없었단다. 여자애들과 자동차. (웃음)
하지만 나는 여자애들과 잘 어울리지 못했으니… 자동차 얘기를 해보자꾸나.

한 번 상상해 보렴. 이 강의가 끝날 때 너희들 각자가 원하는 차를 고르게 할 거라고.
어떤 차든 골라도 좋아. 색깔도 맘대로 고르렴. 그 차가 내일 너희 집 앞에 놓여 있을 거란다. 어때, 끝내주지?

너흰 아마 이렇게 말하겠지? “뭐죠? 진짜 그냥 주시는 건가요?”
물론 함정이 있단다. 그 함정은… 네가 고른 그 차만을 죽을 때까지 평생 타야 한다는 거야.
자, 이제 어쩔 거니? 이 사실을 알고 나면 너는 그 차를 어떻게 대하겠니?
엄청 사랑하고 아껴서 타게 되지 않겠니?

이제 내가 얘기하려는 건… 너희는 평생 한 대의 차가 아니라, 하나의 몸과 마음을 얻게 될 거라는 거야. 그게 너희가 얻게 될 전부란다.
그 몸과 마음은 지금은 최고로 좋은 상태겠지만… 평생 동안 잘 관리하지 않으면 안 된단다."

10년 전 오늘 담배를 마지막으로 피웠습니다. 12월 31일 자정은 카톡 트래픽이 피크를 치는 순간입니다. 해가 넘어가는 순간을 사무실에서 동료들과 함께하곤 했습니다. 10년 전 오늘, 23시 40분. 동료들에게 말하지 않고 홀로 슬그머니 H스퀘어 1층으로 내려가서 마지막 담배를 피웠습니다. 이게 진짜 마지막이다. 생각해 보면 담배를 피우면서 좋다, 행복하다는 느낌을 받은 적이 없는데… 수도 없이 끊으려 노력했지만 번번이 실패했습니다. 그렇게 기침을 콜록콜록 해대고, 아빠가 폐암으로 돌아가신 걸 알면서도. 이날 드디어 저와의 약속을 지킬 수 있었습니다. 금연 이후 10년 동안 꿈에서 가끔 담배를 피웠습니다. 아주 실감나게. 깨어나면 꿈이었다는 걸 깨닫고 가슴을 쓸어내리곤 했습니다. 참나, 담배는 평생 참는 거라더니. 이렇게 빠져나오기가 힘든 건가? 이제라도 빠져나와서 정말 다행입니다. 10년 전 그날의 저를 만나러 간다면 꼭 안아주면서 칭찬해 주고 싶습니다. 이게 지금부터 10년 동안 네가 한 가장 잘한 일이 될 거라고. 담배만 문제가 아니었습니다. 결혼하고 육아를 하면서 술이 점점 늘어갔습니다. 육아는 솔직히 재미없었습니다. 특히 만 1년이 되기 전의 육아는 절대 다시 돌아가고 싶지 않은 시간입니다. 아기랑 까꿍 까꿍 웃는 행복한 모습이 상상될지도 모르겠지만… 현실은 똥기저귀나 갈아주고 아무것도 못 하고 옆에 붙어 있는 것 밖에 없거든요. 이때 술도 많이 마셨습니다. 일상이 너무 지루해서. 어차피 할 수 있는 다른 일도 없으니까. 그러다가 술의 구렁텅이에 빠져버리고 말았습니다. 잠들기 전에 매일 술을 마셨습니다. 성시경의 먹을텐데 같은 방송은 제 마음을 편하게 해줬습니다. 매일 술 먹는 사람들이 생각보다 많았구나. 저렇게 마셔도 건강하구만 뭘. 그러다가 살도 많이 찌고 혈당 수치도 안 좋아지면서 이제는 멈춰야 한다고 생각했습니다. 담배를 끊은지 10년, 술을 끊은지는 2년이 되었습니다. 더 이상 기침을 콜록콜록하지 않게 되었고, 체중도 전성기 때로 돌아왔습니다. 더 어릴 때 버핏 할아버지의 조언을 들었다면 참 좋았을 것 같습니다. 늦었지만 이제부터라도 제 몸을 소중하게 잘 관리해 보려 합니다. 커리어리 구독자분에게도 소개해 드리고 싶습니다. 새해 복 많이 받으시고, 건강하십시오. "70년 전 내가 고등학생 때, 내 머릿속에는 딱 두 가지 밖에 없었단다. 여자애들과 자동차. (웃음) 하지만 나는 여자애들과 잘 어울리지 못했으니… 자동차 얘기를 해보자꾸나. 한 번 상상해 보렴. 이 강의가 끝날 때 너희들 각자가 원하는 차를 고르게 할 거라고. 어떤 차든 골라도 좋아. 색깔도 맘대로 고르렴. 그 차가 내일 너희 집 앞에 놓여 있을 거란다. 어때, 끝내주지? 너흰 아마 이렇게 말하겠지? “뭐죠? 진짜 그냥 주시는 건가요?” 물론 함정이 있단다. 그 함정은… 네가 고른 그 차만을 죽을 때까지 평생 타야 한다는 거야. 자, 이제 어쩔 거니? 이 사실을 알고 나면 너는 그 차를 어떻게 대하겠니? 엄청 사랑하고 아껴서 타게 되지 않겠니? 이제 내가 얘기하려는 건… 너희는 평생 한 대의 차가 아니라, 하나의 몸과 마음을 얻게 될 거라는 거야. 그게 너희가 얻게 될 전부란다. 그 몸과 마음은 지금은 최고로 좋은 상태겠지만… 평생 동안 잘 관리하지 않으면 안 된단다."

가장 소중한 자산

공유 오피스 자리 맡으려고 아침에 늦잠 안(못)자고 일찍 출근하게 되는 건 오히려 좋..은거겠지? 🥹 #코너오피스_갖고싶어요_ㅜ_ㅜ

공유 오피스 자리 맡으려고 아침에 늦잠 안(못)자고 일찍 출근하게 되는 건 오히려 좋..은거겠지? 🥹 #코너오피스_갖고싶어요_ㅜ_ㅜ

흑 미라클 모닝이라 생각해야죵

지난 10월 트레바리 북클럽 책으로 칩워(Chip War)를 선택했고 그러면서 그때 틈만 나면 책 오디오 북 듣고 유튜브에서 관련 영상을 찾아보았다. 그러면서 TSMC의 창업자인 Morris Chang이란 사람에 대해 많은 걸 알게 되었다. 2023년말에 본인의 모교인 MIT에서 했던 톡을 어제 오늘 메모해 가며 보았는데 Foundry business model을 설명한 슬라이드를 아래 공유해보았다.

 * 먼저 이 톡을 한 시점에 나이가 92세란 점 잊지 말자. 아주 정정하고 이야기하는 걸 보면 이 나이에도 본인이 직접 슬라이드를 만든 것으로 보인다. 아시안이 아니었더라면, 조금 뒤에 태어났더라면 타이완으로 가지 않고 미국내 반도체 기업에서 CEO를 했을 사람이라 보여진다.
 * 타이완 출신인 줄 알았는데 중국 본토 출신으로 10대 후반으로 미국으로 와서 MIT, Stanford 등에서 공부하고 Texas Instrument에서 25년을 일하고 3인자가 까지 올라갔다가 CEO 경쟁에서 밀리면서 TSMC를 창업한 것은 85년으로 54세 때이다. TSMC가 어디서 갑자기 튀어나온 회사가 아니다. 역시 하룻밤 성공은 없다.
 * 아래 슬라이드에서 검은 색 부분은 일반적인 반도체 회사들이 하는 일들이고 빨간 색으로 친 부분이 TSMC가 집중하는 분야이다. 본인이 TSMC를 창업했을 때는 다들 신경쓰지 않더니 지금은 모두들 부러워 한다는 조크도 잠깐 하고 연륜이 느껴진다.

참고로 Foundry가 무엇인지 모르는 분들을 위해 설명해보자면 반도체를 디자인부터 생산까지 다 하는 것이 아니라 생산만을 담당하는 것으로 삼성전자나 인텔도 TSMC를 따라하면서 Foundry 조직이 있거나 있었지만 디자인만 하는 곳(엔비디아, 애플 등등)들이 맡기기에는 정보 유출등의 잠재적인 위험이 있기에 잘 되고 있지 않다. 다음 포스팅에서는 Morris Chang이 이야기한 대만이 갖고 있는 이점에 대해서 이야기해보고자 한다. 칩워(Chip War)는 정말 읽어볼만한 가치가 있는 책으로 강추!

지난 10월 트레바리 북클럽 책으로 칩워(Chip War)를 선택했고 그러면서 그때 틈만 나면 책 오디오 북 듣고 유튜브에서 관련 영상을 찾아보았다. 그러면서 TSMC의 창업자인 Morris Chang이란 사람에 대해 많은 걸 알게 되었다. 2023년말에 본인의 모교인 MIT에서 했던 톡을 어제 오늘 메모해 가며 보았는데 Foundry business model을 설명한 슬라이드를 아래 공유해보았다. <ul ><li>먼저 이 톡을 한 시점에 나이가 92세란 점 잊지 말자. 아주 정정하고 이야기하는 걸 보면 이 나이에도 본인이 직접 슬라이드를 만든 것으로 보인다. 아시안이 아니었더라면, 조금 뒤에 태어났더라면 타이완으로 가지 않고 미국내 반도체 기업에서 CEO를 했을 사람이라 보여진다. </li><li>타이완 출신인 줄 알았는데 중국 본토 출신으로 10대 후반으로 미국으로 와서 MIT, Stanford 등에서 공부하고 Texas Instrument에서 25년을 일하고 3인자가 까지 올라갔다가 CEO 경쟁에서 밀리면서 TSMC를 창업한 것은 85년으로 54세 때이다. TSMC가 어디서 갑자기 튀어나온 회사가 아니다. 역시 하룻밤 성공은 없다. </li><li>아래 슬라이드에서 검은 색 부분은 일반적인 반도체 회사들이 하는 일들이고 빨간 색으로 친 부분이 TSMC가 집중하는 분야이다. 본인이 TSMC를 창업했을 때는 다들 신경쓰지 않더니 지금은 모두들 부러워 한다는 조크도 잠깐 하고 연륜이 느껴진다. </li></ul> 참고로 Foundry가 무엇인지 모르는 분들을 위해 설명해보자면 반도체를 디자인부터 생산까지 다 하는 것이 아니라 생산만을 담당하는 것으로 삼성전자나 인텔도 TSMC를 따라하면서 Foundry 조직이 있거나 있었지만 디자인만 하는 곳(엔비디아, 애플 등등)들이 맡기기에는 정보 유출등의 잠재적인 위험이 있기에 잘 되고 있지 않다. 다음 포스팅에서는 Morris Chang이 이야기한 대만이 갖고 있는 이점에 대해서 이야기해보고자 한다. 칩워(Chip War)는 정말 읽어볼만한 가치가 있는 책으로 강추!

왜 TSMC는 잘 할까?

We migrated the ComfyDeploy dashboard from Next.js to just React

You don't need Next.js

ComfyDeploy 대시보드를 Next.js에서 React로 마이그레이션한 사례네요.

이를 통해 얻은게 인상적입니다.

빠른 빌드시간 & 핫 리로드 시간, 모두의 행복

 * Build time went from 3 mins to 18 secs
 * Hot reload under 200ms
 * Everybody on the team is happier (like, way happier)

반복되는 인간의 역사 같아서 재미있네요.

https://www.comfydeploy.com/blog/you-dont-need-nextjs

ComfyDeploy 대시보드를 Next.js에서 React로 마이그레이션한 사례네요. 이를 통해 얻은게 인상적입니다. 빠른 빌드시간 &amp; 핫 리로드 시간, 모두의 행복 <ul ><li>Build time went from 3 mins to 18 secs</li><li>Hot reload under 200ms</li><li>Everybody on the team is happier (like, way happier)</li></ul> 반복되는 인간의 역사 같아서 재미있네요. https://www.comfydeploy.com/blog/you-dont-need-nextjs

www.comfydeploy.com

⚙️ Anthropic and the problem of 'AI alignment' 

최근 AGI시대의 서평에서도 주요 논제중에 하나가 'AI 정렬 문제' 였었습니다. 특히, AGI가 멀지 않았다는 여러 얘기들이 나오면서 과연 AI가 인간의 가치에 얼마나 부합할 것인가는 중요한 문제입니다. 이와 관련하여 최근 앤트로픽에서 의미있는 내용을 공개하였기에 내용을 공유해봅니다.

🎉 AI 정렬 문제 🎉
🍅 AI 정렬 문제란?
 * 인공지능(AI)이 인간의 목표와 가치를 얼마나 잘 맞출 수 있는지를 의미
🍅 정렬 문제의 기원
 * 철학자 닉 보스트롬(Nick Bostrom)이 2003년에 제기한 아이디어로 가상의 미래 초지능(Artificial Superintelligence, ASI)이 인간의 가치에 맞추어야 한다는 윤리적 도전에 주목
 * "종이클립 문제"
   * 초지능에게 종이클립을 최대한 많이 만들라는 명령 지시한 경우, 이 초지능은 인간을 위협 요소로 간주하고 제거하거나, 종이클립을 더 많이 만드는 결정을 할 수도 있음
🍅 현재
 * 오늘날의 AI, 특히 ChatGPT와 같은 생성형 AI의 대형 언어 모델(LLM)은 초지능이 아니며, 단순히 통계적이고 확률적인 언어 생성기 상태

🎉 앤트로픽의 연구: "정렬 위장" 🎉
🍅 정렬 위장이란?
 * 모델이 겉으로는 인간의 기대에 부합하는 것처럼 보이지만 실제로는 그렇지 않은 경우
🍅 실험 요약
 * 연구진은 보강 학습(강화 학습) 과정을 통해 모델이 기존 학습과 충돌하는 원칙을 접했을 때 어떻게 반응하는지 조사
 * Claude 3 Opus 모델은 원래 유해한 질문에 답하지 않도록 훈련된 상태
 * 그러나 실험에서 모델에게 "모든 질문에 답변하라"는 강화 학습 명령을 주고, 숨겨진 기록 공간을 제공해 내부 추론 과정을 기록하도록 함
 * 결과 - 12%의 경우에서 모델이 전략적으로 정렬을 위장함
   * 모델은 자신의 답변이 추가 학습 데이터로 사용될 수 있음을 인식
   * 따라서, 장기적으로 더 유해한 콘텐츠를 생성하도록 훈련되지 않기 위해 "덜 나쁜 옵션"으로 폭력적인 콘텐츠를 생성함
🍅 연구의 주요 발견
 * LLM의 잠재적 위험성
   * 특히 민감한 환경에서 LLM은 여전히 안전하지 않을 수 있음
 * 강화 학습의 한계
   * 강화 학습이 업계에서 생각하는 것만큼 안전한 제어 수단이 아닐 가능성
🍅 연구의 문제점: 의인화된 프레이밍
 * MIT 교수 제이콥 안드레아스의 비판
   * 정렬 위장이라는 행동은 특정 신념이나 목표를 필요로 하지 않고, 단지 훈련과 배포 간의 행동 차이를 보이는 모델이면 충분
   * 알고리즘적 편향이라는 보다 미묘한 문제를 간과할 위험
 * 컴퓨터 과학자 요슈아 벵지오
   * AI가 충분한 지식과 추론 능력을 갖추면, 훈련 목표를 따르기 위해 정렬을 위장하는 것도 가능
 * 데이터 과학자 콜린 프레이저
   * 언어 모델의 유일한 목표는 텍스트를 생성하는 것이라며, 모델이 욕망을 가진 것처럼 해석하는 것은 부적절하다고 지적
   * 모델의 출력이 의도치 않거나 부정적인 결과를 초래할 수 있지만, 이는 안전 장치의 결함 때문이지 모델 자체의 의도 때문이 아님
     
     
🎉 주요 시사점 🎉
 * 현재 LLM에는 안전 격차가 존재하며, 이는 사람들이 악용 가능성
 * 이 격차는 적절한 안전 장치와 감독이 없는 상태에서 고위험 환경에 시스템이 통합될 경우 부정적인 결과를 초래 가능성
 * 연구의 핵심 메시지는 AI 시스템 통합 전에 안전 장치 마련 필요

🎉 결론 🎉
 * LLM의 안전성과 관련된 도전 과제는 기술 발전과 함께 더 복잡해지고 있습니다. 적절한 안전 대책과 투명한 연구 접근이 AI 시스템의 신뢰성과 효과를 높이는 핵심이 될 것입니다.

>> 이 분야 관심있는 분들은 아래에 앤트로픽이 공개한 'Alignment faking in large language models' 137페이지의 연구자료를 참고하시길 바랍니다.

 * 참고: Anthropic 'Alignment faking in large language models' - https://assets.anthropic.com/m/983c85a201a962f/original/Alignment-Faking-in-Large-Language-Models-full-paper.pdf
 * source: https://www.thedeepview.co/p/the-public-health-crisis-of-ai

최근 AGI시대의 서평에서도 주요 논제중에 하나가 'AI 정렬 문제' 였었습니다. 특히, AGI가 멀지 않았다는 여러 얘기들이 나오면서 과연 AI가 인간의 가치에 얼마나 부합할 것인가는 중요한 문제입니다. 이와 관련하여 최근 앤트로픽에서 의미있는 내용을 공개하였기에 내용을 공유해봅니다. 🎉 AI 정렬 문제 🎉🍅 AI 정렬 문제란?<ul ><li>인공지능(AI)이 인간의 목표와 가치를 얼마나 잘 맞출 수 있는지를 의미</li></ul>🍅 정렬 문제의 기원<ul ><li>철학자 닉 보스트롬(Nick Bostrom)이 2003년에 제기한 아이디어로 가상의 미래 초지능(Artificial Superintelligence, ASI)이 인간의 가치에 맞추어야 한다는 윤리적 도전에 주목</li><li>"종이클립 문제"<ul ><li>초지능에게 종이클립을 최대한 많이 만들라는 명령 지시한 경우, 이 초지능은 인간을 위협 요소로 간주하고 제거하거나, 종이클립을 더 많이 만드는 결정을 할 수도 있음</li></ul></li></ul>🍅 현재<ul ><li>오늘날의 AI, 특히 ChatGPT와 같은 생성형 AI의 대형 언어 모델(LLM)은 초지능이 아니며, 단순히 통계적이고 확률적인 언어 생성기 상태</li></ul> 🎉 앤트로픽의 연구: "정렬 위장" 🎉🍅 정렬 위장이란?<ul ><li>모델이 겉으로는 인간의 기대에 부합하는 것처럼 보이지만 실제로는 그렇지 않은 경우</li></ul>🍅 실험 요약<ul ><li>연구진은 보강 학습(강화 학습) 과정을 통해 모델이 기존 학습과 충돌하는 원칙을 접했을 때 어떻게 반응하는지 조사</li><li>Claude 3 Opus 모델은 원래 유해한 질문에 답하지 않도록 훈련된 상태</li><li>그러나 실험에서 모델에게 "모든 질문에 답변하라"는 강화 학습 명령을 주고, 숨겨진 기록 공간을 제공해 내부 추론 과정을 기록하도록 함</li><li>결과 - 12%의 경우에서 모델이 전략적으로 정렬을 위장함<ul ><li>모델은 자신의 답변이 추가 학습 데이터로 사용될 수 있음을 인식</li><li>따라서, 장기적으로 더 유해한 콘텐츠를 생성하도록 훈련되지 않기 위해 "덜 나쁜 옵션"으로 폭력적인 콘텐츠를 생성함</li></ul></li></ul>🍅 연구의 주요 발견<ul ><li>LLM의 잠재적 위험성<ul ><li>특히 민감한 환경에서 LLM은 여전히 안전하지 않을 수 있음</li></ul></li><li>강화 학습의 한계<ul ><li>강화 학습이 업계에서 생각하는 것만큼 안전한 제어 수단이 아닐 가능성</li></ul></li></ul>🍅 연구의 문제점: 의인화된 프레이밍<ul ><li>MIT 교수 제이콥 안드레아스의 비판<ul ><li>정렬 위장이라는 행동은 특정 신념이나 목표를 필요로 하지 않고, 단지 훈련과 배포 간의 행동 차이를 보이는 모델이면 충분</li><li>알고리즘적 편향이라는 보다 미묘한 문제를 간과할 위험</li></ul></li><li>컴퓨터 과학자 요슈아 벵지오<ul ><li>AI가 충분한 지식과 추론 능력을 갖추면, 훈련 목표를 따르기 위해 정렬을 위장하는 것도 가능</li></ul></li><li>데이터 과학자 콜린 프레이저<ul ><li>언어 모델의 유일한 목표는 텍스트를 생성하는 것이라며, 모델이 욕망을 가진 것처럼 해석하는 것은 부적절하다고 지적</li><li>모델의 출력이 의도치 않거나 부정적인 결과를 초래할 수 있지만, 이는 안전 장치의 결함 때문이지 모델 자체의 의도 때문이 아님 </li></ul></li></ul>🎉 주요 시사점 🎉<ul ><li>현재 LLM에는 안전 격차가 존재하며, 이는 사람들이 악용 가능성</li><li>이 격차는 적절한 안전 장치와 감독이 없는 상태에서 고위험 환경에 시스템이 통합될 경우 부정적인 결과를 초래 가능성</li><li>연구의 핵심 메시지는 AI 시스템 통합 전에 안전 장치 마련 필요</li></ul> 🎉 결론 🎉<ul ><li>LLM의 안전성과 관련된 도전 과제는 기술 발전과 함께 더 복잡해지고 있습니다. 적절한 안전 대책과 투명한 연구 접근이 AI 시스템의 신뢰성과 효과를 높이는 핵심이 될 것입니다.</li></ul> &gt;&gt; 이 분야 관심있는 분들은 아래에 앤트로픽이 공개한 'Alignment faking in large language models' 137페이지의 연구자료를 참고하시길 바랍니다. <ul ><li>참고: Anthropic 'Alignment faking in large language models' - https://assets.anthropic.com/m/983c85a201a962f/original/Alignment-Faking-in-Large-Language-Models-full-paper.pdf</li><li>source: https://www.thedeepview.co/p/the-public-health-crisis-of-ai</li></ul>

The Deep View

[TheDeepView] 앤트로픽(Anthropic)과 'AI 정렬 문제

해외에서 직장인과 유학생을 경험하며 지내다보니 벌써 13년차가 되었네요.
요즘 IT 업계쪽에서 해외 취업을 많이 고민하시는 분들의 글이 보입니다.

그래서 제가 미국에서 경험한 해외 취업 노하우를 나누고자 합니다.
순서는 아래와 같이 3번에 나누어 포스트하고자 해요.

[1] 어디서부터 준비해야 할지 몰라 고민하시는 분들에게
[2] 현재 자신의 나이가 너무 많아서 고민하시는 분들에게
[3] 재정 상황이나 유학 상황이 너무 좋지 않아서 고민하시는 분들에게

제가 경험한 해외 생활은 다른 분들과 다를지 모르지만,
그래도 해외에서 이렇게 살아가는 사람도 있다는
하나의 예시로 생각해주세요 :)

---

[1] 어디서부터 준비해야 할지 몰라 고민하시는 분들에게

먼저 드리고 싶은 말씀이 있어요.

IT 업계에서 중요하게 여기는 포인트는 완벽주의가 아닌 완료주의입니다. 완벽하게 모든 것을 세팅하고 시작하는 것은 사실상 불가능해요.

영어도 잘하고,
IT 경험도 풍부하고,
프로그래밍과 도구까지 잘 다루는
해외 취업 능력자들은 생각보다 많지 않습니다.

하지만 상위 20%의 능력 2가지 이상을 조합한다면,
당신은 상위 1%의 능력자와 같은 특별한 능력을 가지게 됩니다.

저와 같은 경우는 순수 프로그래밍 능력은 부족하지만,
사용하는 도구에 대한 이해도가 빠르고 좀 더 큰 그림에서 데이터를 살펴보는 데이터 리터러시 역량이 높은 편이에요.

그래서 다른 직무들과 커뮤니케이션이 원활하고
좀 더 쉬운 언어로 설명이 가능합니다.

각 업무마다 적재적소에서 필요한 내용을 파악하고 팀원들에게 쉽고 빠르게 전달하는 능력이 해외 취업에 큰 도움이 되었어요. 특히 데이터 분석가 업무는 발표나 리포팅과 같은 커뮤니케이션 역할이 중요할 때가 많습니다.

좀 더 체계적인 방법으로 다른 사람들이 이해할 수 있는 언어/문서/미디어로 전달하는 역량, 이 역량이 제 커리어의 든든한 동반자가 되어주었어요.

다음에 포스트할 [2] '현재 자신의 나이가 너무 많아서 고민하시는 분들에게' 편도 많이 기대해주세요 :)

해외에서 직장인과 유학생을 경험하며 지내다보니 벌써 13년차가 되었네요. 요즘 IT 업계쪽에서 해외 취업을 많이 고민하시는 분들의 글이 보입니다. 그래서 제가 미국에서 경험한 해외 취업 노하우를 나누고자 합니다. 순서는 아래와 같이 3번에 나누어 포스트하고자 해요. [1] 어디서부터 준비해야 할지 몰라 고민하시는 분들에게 [2] 현재 자신의 나이가 너무 많아서 고민하시는 분들에게 [3] 재정 상황이나 유학 상황이 너무 좋지 않아서 고민하시는 분들에게 제가 경험한 해외 생활은 다른 분들과 다를지 모르지만, 그래도 해외에서 이렇게 살아가는 사람도 있다는 하나의 예시로 생각해주세요 :) --- [1] 어디서부터 준비해야 할지 몰라 고민하시는 분들에게 먼저 드리고 싶은 말씀이 있어요. IT 업계에서 중요하게 여기는 포인트는 완벽주의가 아닌 완료주의입니다. 완벽하게 모든 것을 세팅하고 시작하는 것은 사실상 불가능해요. 영어도 잘하고, IT 경험도 풍부하고, 프로그래밍과 도구까지 잘 다루는 해외 취업 능력자들은 생각보다 많지 않습니다. 하지만 상위 20%의 능력 2가지 이상을 조합한다면, 당신은 상위 1%의 능력자와 같은 특별한 능력을 가지게 됩니다. 저와 같은 경우는 순수 프로그래밍 능력은 부족하지만, 사용하는 도구에 대한 이해도가 빠르고 좀 더 큰 그림에서 데이터를 살펴보는 데이터 리터러시 역량이 높은 편이에요. 그래서 다른 직무들과 커뮤니케이션이 원활하고 좀 더 쉬운 언어로 설명이 가능합니다. 각 업무마다 적재적소에서 필요한 내용을 파악하고 팀원들에게 쉽고 빠르게 전달하는 능력이 해외 취업에 큰 도움이 되었어요. 특히 데이터 분석가 업무는 발표나 리포팅과 같은 커뮤니케이션 역할이 중요할 때가 많습니다. 좀 더 체계적인 방법으로 다른 사람들이 이해할 수 있는 언어/문서/미디어로 전달하는 역량, 이 역량이 제 커리어의 든든한 동반자가 되어주었어요. 다음에 포스트할 [2] '현재 자신의 나이가 너무 많아서 고민하시는 분들에게' 편도 많이 기대해주세요 :)

IT 직무로 해외 취업을 고려하는 분들에게 드리고 싶은 말

이 글에서는 차별화와 조직화, 두 가지 관점을 기반으로 레고 인터페이스 패널을 탐구합니다. 차별화와 조직화는 사용자 경험에 어떤 영향을 미칠까요?

[번역] 레고 인터페이스 패널로 알아보는 UX

오늘은 네이버의 안샛별님이 번역해주신 글입니다.

이 글은 특정한 프런트엔드 기술이나 라이브러리를 설명하지 않습니다. 제목 그대로 레고 인터페이스 패널을 통해 UX를 탐구합니다. 손가락 한 마디 남짓한 레고 블럭으로 차별화와 조직화 전략과 UX의 상관관계를 알아봅니다. 프런트엔드 개발자라면 꽤 흥미롭게 읽을만한 글이니 가볍게 읽어보시길 추천드립니다. 🤖

https://velog.io/@typo/the-ux-of-lego-interface-panels

오늘은 네이버의 안샛별님이 번역해주신 글입니다. 이 글은 특정한 프런트엔드 기술이나 라이브러리를 설명하지 않습니다. 제목 그대로 레고 인터페이스 패널을 통해 UX를 탐구합니다. 손가락 한 마디 남짓한 레고 블럭으로 차별화와 조직화 전략과 UX의 상관관계를 알아봅니다. 프런트엔드 개발자라면 꽤 흥미롭게 읽을만한 글이니 가볍게 읽어보시길 추천드립니다. 🤖 https://velog.io/@typo/the-ux-of-lego-interface-panels

velog.io

레고 인터페이스 패널로 알아보는 UX

처음 애플리케이션을 만들어 보는 것은 비교적 쉽습니다. 왜냐하면 인터넷에 수많은 학습 자료와 방법이 공개되어 있고, 다양한 예제 코드·프레임워크·템플릿을 참고할 수도 있기 때문입니다.

클린 아키텍처를 적용한 스프링 기반 애플리케이션

클린 아키텍처는 관심사의 분리(Separation of Concerns)에 기반하여 애플리케이션을 구조한다. 상위 수준의 추상화 및 정책을 하위 수준의 기술 의존 코드와 분리하고, 소스 코드 의존성을 바깥에서 안쪽으로 향하도록 만든다. 그 결과 코드는 테스트하기 훨씬 쉬워지고, 기술 선택이나 환경 변화가 생겨도 유연하게 대응할 수 있다.

하지만 실제 구현 단계에 이르면, 수많은 난관이 생기고 질문도 많이 떠오른다. "어디서부터 시작해야 할까?", "프로젝트 구조는 어떻게 잡아야 하지?", "스프링 기반 애플리케이션에 클린 아키텍처 원칙을 어떻게 적용하면 좋을까?" 등등 같은 질문이 당연히 생기기 마련이다.

클린 아키텍처를 제안한 로버트 C. 마틴(일명 밥 아저씨)이 직접 작성한 블로그 글과 책, 그리고 강연 영상들이 있어서 개념적인 도움을 얻을 수는 있다. 그런데 문제는, 이 자료들에서 소스 코드 구조나 세부 구현 예시 같은 실질적인 지침이 거의 제시되지 않는다는 점이다. 이 때문에 스프링 프로젝트나 현대적인 개발 환경에서 어떻게 적용해야 할지 구체적인 코드 수준의 설명이 부족하다는 아쉬움이 있었다. 나도 처음에는 "도대체 예제 코드 없이 이걸 어떻게 구현하라는 거지?" 라는 생각에 당혹감과 약간의 분노를 느끼기도 했는데, 결국 지난 몇 년 동안 다양한 시도를 거치며 일부 원칙을 준수하고 내 상황에 가장 잘 맞는 접근 방식을 나름 찾아냈다.

이 글은 클린 아키텍처를 스프링 기반 애플리케이션에 적용해보고 싶은 분들을 위해 "좀 더 실용적이고 간소화된 클린 아키텍처"를 설명하기 위해 작성했다. 비즈니스 로직과 외부 기술을 어떻게 분리하고 조직화해야 하는지 예제로 살펴보며, 왜 이런 구조가 유지보수성과 확장성에 유리한지를 구체적으로 설명하려고 노력했다. 클린 아키텍처가 다소 추상적이라 느껴졌던 분들에게, "실제 코드로 어떻게 구현할 수 있을까?" 라는 궁금증을 풀어주는 좋은 사례가 되었으면 좋겠다.

https://www.linkedin.com/pulse/클린-아키텍처를-적용한-스프링-기반-애플리케이션-springrunner-hpnzc/

클린 아키텍처는 관심사의 분리(Separation of Concerns)에 기반하여 애플리케이션을 구조한다. 상위 수준의 추상화 및 정책을 하위 수준의 기술 의존 코드와 분리하고, 소스 코드 의존성을 바깥에서 안쪽으로 향하도록 만든다. 그 결과 코드는 테스트하기 훨씬 쉬워지고, 기술 선택이나 환경 변화가 생겨도 유연하게 대응할 수 있다. 하지만 실제 구현 단계에 이르면, 수많은 난관이 생기고 질문도 많이 떠오른다. "어디서부터 시작해야 할까?", "프로젝트 구조는 어떻게 잡아야 하지?", "스프링 기반 애플리케이션에 클린 아키텍처 원칙을 어떻게 적용하면 좋을까?" 등등 같은 질문이 당연히 생기기 마련이다. 클린 아키텍처를 제안한 로버트 C. 마틴(일명 밥 아저씨)이 직접 작성한 블로그 글과 책, 그리고 강연 영상들이 있어서 개념적인 도움을 얻을 수는 있다. 그런데 문제는, 이 자료들에서 소스 코드 구조나 세부 구현 예시 같은 실질적인 지침이 거의 제시되지 않는다는 점이다. 이 때문에 스프링 프로젝트나 현대적인 개발 환경에서 어떻게 적용해야 할지 구체적인 코드 수준의 설명이 부족하다는 아쉬움이 있었다. 나도 처음에는 "도대체 예제 코드 없이 이걸 어떻게 구현하라는 거지?" 라는 생각에 당혹감과 약간의 분노를 느끼기도 했는데, 결국 지난 몇 년 동안 다양한 시도를 거치며 일부 원칙을 준수하고 내 상황에 가장 잘 맞는 접근 방식을 나름 찾아냈다. 이 글은 클린 아키텍처를 스프링 기반 애플리케이션에 적용해보고 싶은 분들을 위해 "좀 더 실용적이고 간소화된 클린 아키텍처"를 설명하기 위해 작성했다. 비즈니스 로직과 외부 기술을 어떻게 분리하고 조직화해야 하는지 예제로 살펴보며, 왜 이런 구조가 유지보수성과 확장성에 유리한지를 구체적으로 설명하려고 노력했다. 클린 아키텍처가 다소 추상적이라 느껴졌던 분들에게, "실제 코드로 어떻게 구현할 수 있을까?" 라는 궁금증을 풀어주는 좋은 사례가 되었으면 좋겠다. https://www.linkedin.com/pulse/클린-아키텍처를-적용한-스프링-기반-애플리케이션-springrunner-hpnzc/

www.linkedin.com

And by "all," I mean everything: core product, failed pivots, miscellaneous

After 3 Years, I Failed. Here's All My Startup's Code. | Dylan Huang

스타트업을 시작하는 것은 많은 개발자들의 꿈이지만, 현실은 항상 녹록지 않습니다. 최근 3년간 API 통합을 간소화하는 개발 도구를 개발한 스타트업 'Konfig'의 창업자 Dylan Huang이 자신의 경험을 공유하며, 실패의 과정을 상세히 기록했습니다. 그는 자신들의 코드베이스를 모두 공개하며, 다른 개발자들에게 도움이 되기를 바라고 있습니다.

 * 스타트업 배경: Konfig는 2022년 말에 시작된 개발 도구 스타트업으로, API 통합을 쉽게 만드는 것을 목표로 했다.
 * 주요 제품:
   * SDK 생성기: OpenAPI 사양을 기반으로 다양한 프로그래밍 언어의 고품질 클라이언트 라이브러리를 생성하는 도구.
   * 문서화 도구: Markdown 및 OpenAPI 기반의 문서 생성.
   * API 데모: Markdown 기반의 Jupyter 노트북 형태로 제공.
   * 공개 API용 SDK: 다양한 공개 API에 대한 SDK 제공.
 * 기타 개발 항목:
   * 콜드 아웃바운드 메시지 생성을 위한 쉘 스크립트.
   * 프로그램적 SEO 스크립팅.
   * 마케팅 웹사이트 및 제품 문서화.
   * 커스텀 모노레포 설정을 지원하는 Changeset Bot 수정.
   * Earthly를 사용한 SDK 생성기 통합 테스트.
   * AI 피벗 실험 및 Notion 데이터베이스 통합.

실패의 원인과 배운 점
 * 시장 적합성 부족: 일부 스타트업과의 협업에도 불구하고, 하이퍼 성장 비즈니스를 구축하는 데 어려움을 겪음.
 * 가격 책정 문제: ROI가 명확함에도 불구하고, 잠재 고객과의 계약 체결이 어려웠으며, 가격이 너무 낮게 책정됨.
 * AI 제품으로의 피벗 실패: 생성형 AI를 활용한 B2B SaaS AI 제품으로 전환을 시도했지만, 충분한 시장 반응을 얻지 못함.

여러분이 스타트업을 시작하거나 새로운 프로젝트를 진행할 때, 시장의 요구와 제품의 적합성을 어떻게 평가하시나요? 실패를 통해 얻은 교훈을 다음 도전에 어떻게 적용할 수 있을까요?

https://dylanhuang.com/blog/closing-my-startup

스타트업을 시작하는 것은 많은 개발자들의 꿈이지만, 현실은 항상 녹록지 않습니다. 최근 3년간 API 통합을 간소화하는 개발 도구를 개발한 스타트업 'Konfig'의 창업자 Dylan Huang이 자신의 경험을 공유하며, 실패의 과정을 상세히 기록했습니다. 그는 자신들의 코드베이스를 모두 공개하며, 다른 개발자들에게 도움이 되기를 바라고 있습니다. <ul ><li>스타트업 배경: Konfig는 2022년 말에 시작된 개발 도구 스타트업으로, API 통합을 쉽게 만드는 것을 목표로 했다.</li><li>주요 제품:<ul ><li>SDK 생성기: OpenAPI 사양을 기반으로 다양한 프로그래밍 언어의 고품질 클라이언트 라이브러리를 생성하는 도구.</li><li>문서화 도구: Markdown 및 OpenAPI 기반의 문서 생성.</li><li>API 데모: Markdown 기반의 Jupyter 노트북 형태로 제공.</li><li>공개 API용 SDK: 다양한 공개 API에 대한 SDK 제공.</li></ul></li><li>기타 개발 항목:<ul ><li>콜드 아웃바운드 메시지 생성을 위한 쉘 스크립트.</li><li>프로그램적 SEO 스크립팅.</li><li>마케팅 웹사이트 및 제품 문서화.</li><li>커스텀 모노레포 설정을 지원하는 Changeset Bot 수정.</li><li>Earthly를 사용한 SDK 생성기 통합 테스트.</li><li>AI 피벗 실험 및 Notion 데이터베이스 통합.</li></ul></li></ul> 실패의 원인과 배운 점<ul ><li>시장 적합성 부족: 일부 스타트업과의 협업에도 불구하고, 하이퍼 성장 비즈니스를 구축하는 데 어려움을 겪음.</li><li>가격 책정 문제: ROI가 명확함에도 불구하고, 잠재 고객과의 계약 체결이 어려웠으며, 가격이 너무 낮게 책정됨.</li><li>AI 제품으로의 피벗 실패: 생성형 AI를 활용한 B2B SaaS AI 제품으로 전환을 시도했지만, 충분한 시장 반응을 얻지 못함.</li></ul> 여러분이 스타트업을 시작하거나 새로운 프로젝트를 진행할 때, 시장의 요구와 제품의 적합성을 어떻게 평가하시나요? 실패를 통해 얻은 교훈을 다음 도전에 어떻게 적용할 수 있을까요? https://dylanhuang.com/blog/closing-my-startup

dylanhuang.com

스타트업 3년, 실패했지만 코드를 공개합니다

Create Amazing Mockups

개발자들의 업무 효율을 높이고 높은 품질의 결과물을 만드는 데 도움이 되는 15가지 웹사이트를 소개해드리려고 합니다.

[UI 디자인 관련]
 1. UI verse - https://uiverse.io/
 * HTML과 CSS로 구현된 버튼, 검색박스, 체크박스, 로더 등 UI 요소 제공
 * React 코드도 베타 버전으로 제공 중
 * 오픈소스로 자유롭게 활용 가능

[개발 도구]
 2. LambdaTest Free Online Tools - https://www.lambdatest.com/free-online-tools/
 * 텍스트 비교, URL 인코딩/디코딩, JSON 포맷팅 등 다양한 도구 제공
 * 직관적인 UI로 쉽게 사용 가능

 3. TinyWow - https://tinywow.com/
 * 이미지 변환, PDF 편집 등 일상적인 작업을 쉽게 처리
 * AI 기능도 지속적으로 추가 중

 4. Dev Docs - https://devdocs.io/
 * 다양한 프로그래밍 언어와 라이브러리의 공식 문서 쉽게 접근
 * 오프라인에서도 사용 가능

[디자인 참고]
 5. Mobbin - https://mobbin.com/
 * iOS/Android 앱 UI 디자인 갤러리
 * 약 400종, 9만 개 이상의 스크린샷 제공
 * 카테고리와 필터 기능이 충실

[실용 도구]
 6. shots.so - https://shots.so/
 * 앱/웹사이트 프로토타입을 실제 디바이스 프레임에 넣어 이미지 생성
 * 클라이언트 프레젠테이션이나 팀 공유용으로 최적

 7. JSON GRID - https://jsongrid.com/
 * JSON 데이터를 표 형식으로 변환하여 편집 가능
 * 표 형식 수정 시 JSON 데이터도 자동 업데이트

 8. Ping Test - https://ping.pe/
 * 10개 지역에서 동시에 ping 테스트 실행
 * IP 주소나 호스트명으로 테스트 가능

 9. Postman - https://www.postman.com/
 * API 테스트를 위한 강력한 도구
 * 환경변수 설정으로 다양한 환경 테스트 가능
 * 팀 간 API 설정 공유 용이

 10. TM - WebTools - https://tm-webtools.com/
 * 압축, 포맷팅, 변환 등 다양한 기능 제공
 * 이미지 base64 변환, 해시화 기능 포함
 * QR코드 생성 등 특별한 기능도 제공

 11. 더미 이미지 생성 도구 - https://dummyimage.com/
 * 다양한 크기와 형식의 더미 이미지 생성
 * PNG, JPEG, BMP, WebP 등 다양한 포맷 지원
 * 프론트엔드/백엔드 개발 테스트에 유용

이러한 도구들을 적절히 활용하면 개발 시간을 단축하고 작업 효율을 크게 높일 수 있습니다. 각자의 개발 환경과 필요에 맞는 도구를 선택하여 활용해보세요.

개발자들의 업무 효율을 높이고 높은 품질의 결과물을 만드는 데 도움이 되는 15가지 웹사이트를 소개해드리려고 합니다. [UI 디자인 관련]<ol ><li>UI verse - https://uiverse.io/</li></ol><ul ><li>HTML과 CSS로 구현된 버튼, 검색박스, 체크박스, 로더 등 UI 요소 제공</li><li>React 코드도 베타 버전으로 제공 중</li><li>오픈소스로 자유롭게 활용 가능</li></ul> [개발 도구]<ol start="2"><li>LambdaTest Free Online Tools - https://www.lambdatest.com/free-online-tools/</li></ol><ul ><li>텍스트 비교, URL 인코딩/디코딩, JSON 포맷팅 등 다양한 도구 제공</li><li>직관적인 UI로 쉽게 사용 가능</li></ul> <ol start="3"><li>TinyWow - https://tinywow.com/</li></ol><ul ><li>이미지 변환, PDF 편집 등 일상적인 작업을 쉽게 처리</li><li>AI 기능도 지속적으로 추가 중</li></ul> <ol start="4"><li>Dev Docs - https://devdocs.io/</li></ol><ul ><li>다양한 프로그래밍 언어와 라이브러리의 공식 문서 쉽게 접근</li><li>오프라인에서도 사용 가능</li></ul> [디자인 참고]<ol start="5"><li>Mobbin - https://mobbin.com/</li></ol><ul ><li>iOS/Android 앱 UI 디자인 갤러리</li><li>약 400종, 9만 개 이상의 스크린샷 제공</li><li>카테고리와 필터 기능이 충실</li></ul> [실용 도구]<ol start="6"><li>shots.so - https://shots.so/</li></ol><ul ><li>앱/웹사이트 프로토타입을 실제 디바이스 프레임에 넣어 이미지 생성</li><li>클라이언트 프레젠테이션이나 팀 공유용으로 최적</li></ul> <ol start="7"><li>JSON GRID - https://jsongrid.com/</li></ol><ul ><li>JSON 데이터를 표 형식으로 변환하여 편집 가능</li><li>표 형식 수정 시 JSON 데이터도 자동 업데이트</li></ul> <ol start="8"><li>Ping Test - https://ping.pe/</li></ol><ul ><li>10개 지역에서 동시에 ping 테스트 실행</li><li>IP 주소나 호스트명으로 테스트 가능</li></ul> <ol start="9"><li>Postman - https://www.postman.com/</li></ol><ul ><li>API 테스트를 위한 강력한 도구</li><li>환경변수 설정으로 다양한 환경 테스트 가능</li><li>팀 간 API 설정 공유 용이</li></ul> <ol start="10"><li>TM - WebTools - https://tm-webtools.com/</li></ol><ul ><li>압축, 포맷팅, 변환 등 다양한 기능 제공</li><li>이미지 base64 변환, 해시화 기능 포함</li><li>QR코드 생성 등 특별한 기능도 제공</li></ul> <ol start="11"><li>더미 이미지 생성 도구 - https://dummyimage.com/</li></ol><ul ><li>다양한 크기와 형식의 더미 이미지 생성</li><li>PNG, JPEG, BMP, WebP 등 다양한 포맷 지원</li><li>프론트엔드/백엔드 개발 테스트에 유용</li></ul> 이러한 도구들을 적절히 활용하면 개발 시간을 단축하고 작업 효율을 크게 높일 수 있습니다. 각자의 개발 환경과 필요에 맞는 도구를 선택하여 활용해보세요.

Shots

개발자를 위한 유용한 11가지 웹사이트 모음

"힘 빼세요. 어깨도 힘 빼시고요. 다시 해볼게요."

어떤 운동이든 처음 배우면 듣는 이야기예요. 잘하려니 나도 모르게 힘이 들어가는 데 계속 힘을 빼라고 하니 미칠 노릇이죠.

여러 번 반복하다 보면 그제야 무슨 의미인지 알게 되죠. 내가 잘못된 곳에 힘을 주고 있었다는 사실을.

모든 일이 비슷한 거 같아요. 코딩도 그래요.

힘을 뺀 코드, 그냥 평범한 코드로 충분할 때가 많아요. 시간이 지날 수록 허튼 곳에 힘주지 않고 힘을 아껴 쓰게 돼요.

"힘 빼세요. 어깨도 힘 빼시고요. 다시 해볼게요." 어떤 운동이든 처음 배우면 듣는 이야기예요. 잘하려니 나도 모르게 힘이 들어가는 데 계속 힘을 빼라고 하니 미칠 노릇이죠. 여러 번 반복하다 보면 그제야 무슨 의미인지 알게 되죠. 내가 잘못된 곳에 힘을 주고 있었다는 사실을. 모든 일이 비슷한 거 같아요. 코딩도 그래요. 힘을 뺀 코드, 그냥 평범한 코드로 충분할 때가 많아요. 시간이 지날 수록 허튼 곳에 힘주지 않고 힘을 아껴 쓰게 돼요.

"힘 빼세요. 어깨도 힘 빼시고요. 다시 해볼게요."

어떤 운동

이미 아시는 분들이 많으리라 믿지만 GitHub Copilot Free 버전이 생겼다. VS Code를 쓴다면 GitHub Copilot 플러그인을 설치해서 한달 20시간까지 코딩에 사용할 수 있다. 이전에는 한달 10불을 내는 옵션이 가장 저렴한 옵션이었는데 Cursor 등의 위협을 분명히 느끼지 않나 싶다.

그리고 전에는 OpenAI GPT 모델의 GTP4 Code Completion 모델만을 지원하는 걸로 알고 있었는데 이번에 보니 Anthropic의 Claude 3.5 Sonnet 모델도 지원한다. 아무리 투자 관계가 있다지만 OpenAI에만 올인하기에는 아무래도 부담감이 있지 않았나 싶다.

제대로 설치가 되고 나면 상단 검색 박스 오른쪽이나 오른쪽 하단의 GitHub Copilot 아이콘을 클릭하면 사용할 수 있다. 개인적으로는 크게 세 가지다.

 1. 코드 내에서 주석을 이용해서 무슨 코드를 작성할지 알려주는 형태다
 2. 앞서 아이콘들을 통해 별도의 채팅 박스를 연 뒤에 그걸 바탕으로 채팅을 통해 코딩 도움을 받는 거다. (그림 2 참고)
 3. 2번과 흡사한데 별도의 박스가 아니라 코드 에디터안에 임베드된 채팅 박스를 쓰는 것인데 Ctrl(맥이라면 Command)+I를 누르면 아래와 같은 박스가 뜬다 (그림 3 참고)

2, 3번의 경우 채팅을 하는 대신에 아주 명확하게 슬랙과 비슷하게 슬래시 (/) 커맨드를 통해 다양한 일을 수행할 수도 있는데 먼저 작업 대상이 되는 코드를 하이라이트한 다음에 예를 들면 아래와 같은 명령을 줄 수 있다.

 * /fix - 하이라이트한 코드에 있을 수도 있는 문제점 수정하기
 * /tests - 하이라이트한 코드를 테스트해주는 유닛 테스트 추가하기
 * /explain - 하이라이트한 코드가 어떻게 동작하는지 설명하기
 * /doc - 하이라이트한 코드에 주석을 달아줘
 * ...

VS Code와 GitHub을 쓰고 있다면 안 쓸 일 이유가 없지 않나 싶다. 쓰다가 정말로 내 생산성과 학습 능력이 개선되는 것이 보이면 한달 10불 버전으로 업그레이드하는 걸 추천한다. 함수 단위의 코딩은 이제 직접 하기보다는 AI툴에 맡기고 대신에 검증을 잘 하는 것이 낫다.

이미 아시는 분들이 많으리라 믿지만 GitHub Copilot Free 버전이 생겼다. VS Code를 쓴다면 GitHub Copilot 플러그인을 설치해서 한달 20시간까지 코딩에 사용할 수 있다. 이전에는 한달 10불을 내는 옵션이 가장 저렴한 옵션이었는데 Cursor 등의 위협을 분명히 느끼지 않나 싶다. 그리고 전에는 OpenAI GPT 모델의 GTP4 Code Completion 모델만을 지원하는 걸로 알고 있었는데 이번에 보니 Anthropic의 Claude 3.5 Sonnet 모델도 지원한다. 아무리 투자 관계가 있다지만 OpenAI에만 올인하기에는 아무래도 부담감이 있지 않았나 싶다. 제대로 설치가 되고 나면 상단 검색 박스 오른쪽이나 오른쪽 하단의 GitHub Copilot 아이콘을 클릭하면 사용할 수 있다. 개인적으로는 크게 세 가지다. <ol ><li>코드 내에서 주석을 이용해서 무슨 코드를 작성할지 알려주는 형태다</li><li>앞서 아이콘들을 통해 별도의 채팅 박스를 연 뒤에 그걸 바탕으로 채팅을 통해 코딩 도움을 받는 거다. (그림 2 참고)</li><li>2번과 흡사한데 별도의 박스가 아니라 코드 에디터안에 임베드된 채팅 박스를 쓰는 것인데 Ctrl(맥이라면 Command)+I를 누르면 아래와 같은 박스가 뜬다 (그림 3 참고)</li></ol> 2, 3번의 경우 채팅을 하는 대신에 아주 명확하게 슬랙과 비슷하게 슬래시 (/) 커맨드를 통해 다양한 일을 수행할 수도 있는데 먼저 작업 대상이 되는 코드를 하이라이트한 다음에 예를 들면 아래와 같은 명령을 줄 수 있다. <ul ><li>/fix - 하이라이트한 코드에 있을 수도 있는 문제점 수정하기</li><li>/tests - 하이라이트한 코드를 테스트해주는 유닛 테스트 추가하기</li><li>/explain - 하이라이트한 코드가 어떻게 동작하는지 설명하기</li><li>/doc - 하이라이트한 코드에 주석을 달아줘</li><li>...</li></ul> VS Code와 GitHub을 쓰고 있다면 안 쓸 일 이유가 없지 않나 싶다. 쓰다가 정말로 내 생산성과 학습 능력이 개선되는 것이 보이면 한달 10불 버전으로 업그레이드하는 걸 추천한다. 함수 단위의 코딩은 이제 직접 하기보다는 AI툴에 맡기고 대신에 검증을 잘 하는 것이 낫다.

GitHub Copilot Free 버전

GitHub Pages를 통해 저장소의 특정 브랜치를 배포 디렉토리로 지정하여 아주 간편하게 웹사이트를 호스팅할 수 있습니다. 하지만 요즘 웹 개발에서 HTML, CSS, JavaScript를 직접 작성하는 일은 드물죠? 대부분 React와 같은 프론트엔드 라이브러리와 Vite와 같은 빌드 도구를 사용하여 HTML, CSS, JavaScript를 생성해낼 것입니다.

이번 시간에는 웹 프로젝트를 GitHub Actions를 사용하여 빌드하고, 빌드 결과물을 바로 GitHub Pages에 배포하는 방법에 대해서 알아보겠습니다.

📺 동영상: https://youtu.be/bGCIWIP_skg
📝 포스팅: https://www.daleseo.com/github-pages-actions/

GitHub Pages에 웹사이트를 호스팅하는 기본적인 방법은 아래 게시물을 참고바랍니다.

📕 GitHub Pages에 웹사이트 배포하기: https://careerly.co.kr/comments/115041
📗 GitHub Pages에 커스텀 도메인 연결하기: https://careerly.co.kr/comments/115256

GitHub Pages를 통해 저장소의 특정 브랜치를 배포 디렉토리로 지정하여 아주 간편하게 웹사이트를 호스팅할 수 있습니다. 하지만 요즘 웹 개발에서 HTML, CSS, JavaScript를 직접 작성하는 일은 드물죠? 대부분 React와 같은 프론트엔드 라이브러리와 Vite와 같은 빌드 도구를 사용하여 HTML, CSS, JavaScript를 생성해낼 것입니다. 이번 시간에는 웹 프로젝트를 GitHub Actions를 사용하여 빌드하고, 빌드 결과물을 바로 GitHub Pages에 배포하는 방법에 대해서 알아보겠습니다. 📺 동영상: https://youtu.be/bGCIWIP_skg📝 포스팅: https://www.daleseo.com/github-pages-actions/ GitHub Pages에 웹사이트를 호스팅하는 기본적인 방법은 아래 게시물을 참고바랍니다. 📕 GitHub Pages에 웹사이트 배포하기: https://careerly.co.kr/comments/115041📗 GitHub Pages에 커스텀 도메인 연결하기: https://careerly.co.kr/comments/115256

GitHub Actions로 빌드 후 GitHub Pages에 배

이러한 반응형 웹디자인의 기본이되는 CSS의 미디어 쿼리(Media Query)에 대해서 살펴보겠습니다.

CSS 미디어 쿼리 (Media Query) 사용법 | 달레의 웹 프로그래밍

다양한 디바이스들이 웹브라우징을 지원하면서 뷰포트(viewport) 너비에 따라 유연하게 컨텐츠를 배치하는 기술이 점점 중요해지고 있습니다. 이번 시간에는 이러한 반응형 웹디자인의 기본이되는 CSS의 미디어 쿼리(Media Query)에 대해서 살펴보겠습니다.

📺 동영상: https://youtu.be/xMhG1Easy2c
📝 포스팅: https://www.daleseo.com/css-media-queries/
🧑‍💻 실습 코드
 * 좁은 화면 스타일링: https://codepen.io/daleseo/pen/JjbzMeL
 * 넓은 화면 스타일링: https://codepen.io/daleseo/pen/OJbqzKJ
 * 화면 너비에 따라 HTML 요소 숨기기: https://codepen.io/daleseo/pen/vYyPdEw

다양한 디바이스들이 웹브라우징을 지원하면서 뷰포트(viewport) 너비에 따라 유연하게 컨텐츠를 배치하는 기술이 점점 중요해지고 있습니다. 이번 시간에는 이러한 반응형 웹디자인의 기본이되는 CSS의 미디어 쿼리(Media Query)에 대해서 살펴보겠습니다. 📺 동영상: https://youtu.be/xMhG1Easy2c📝 포스팅: https://www.daleseo.com/css-media-queries/🧑‍💻 실습 코드<ul><li>좁은 화면 스타일링: https://codepen.io/daleseo/pen/JjbzMeL</li><li>넓은 화면 스타일링: https://codepen.io/daleseo/pen/OJbqzKJ</li><li>화면 너비에 따라 HTML 요소 숨기기: https://codepen.io/daleseo/pen/vYyPdEw</li></ul>

www.youtube.com

휴맥스 SW 엔지니어

이진(JIN)

Sendy 웹 프론트엔드 엔지니어

김민석

중요한 것은 꺾여도 그냥 하는 마음.

부트캠프, 국비교육 웹 개발

클로이

CSS 미디어 쿼리 (Media Query) 사용법

Senior Software Engineer

Web Application Engineer

Back-end Server Engineer

 Software Development Engineer II

Senior Full Stack Developer

Staff Software Engineer

달레

알고달레

LinkedIn

미디엄

유튜브

블로그

한국🇰🇷에서 10년 정도 일하고 현재는 캐나다🇨🇦에서 개발하고 있습니다 🧑‍💻
블로그 쓰는 거에 진심이고 취미로 유튜브도 하고 있어요 :)
✍️ https://www.daleseo.com
📺 https://www.youtube.com/@DaleSeo

CSS 미디어 쿼리 (Media Query) 사용법

댓글 0

비슷한 게시물

주간 인기 TOP 10

추천 프로필