브라우저에서 바로 돌아가는 클래식 Visual Basic VB6 IDE

요약

클래식 VB6 개발 환경을 브라우저에서 그대로 재현한 IDE가 나왔고, 만든 앱은 HTML 파일 하나로 내보냅니다.

개발자 비에스와프 솔테스가 만든 오픈소스 프로젝트 'VB6 Studio Web'입니다. 마이크로소프트 Visual Basic 6의 폼 디자이너, 속성 창, 디버거를 HTML·CSS·JavaScript만으로 다시 만들었고, 페이지를 열면 설치나 계정 없이 바로 쓸 수 있습니다.

왜 중요한가

컨트롤을 끌어다 놓고 더블클릭해 이벤트 코드를 쓰는 VB6식 개발 방식을 설치 없이 다시 써 볼 수 있습니다.
내보낸 앱은 실행 엔진을 품은 HTML 파일 하나라서 IDE 없이도 브라우저에서 돌아갑니다.

핵심 내용

코드를 JavaScript로 바꾸지 않고, 자체 명령 체계를 갖춘 가상 머신에서 VB 방식대로 실행합니다.
도구 상자에는 기본 컨트롤부터 TreeView, ListView, 차트까지 37종의 컨트롤이 들어 있습니다.
한 줄씩 실행, 중단점, 조사식 같은 디버거 기능과 IntelliSense(코드 자동 완성)를 갖췄습니다.
오픈AI·앤트로픽·구글 모델을 붙이는 AI 코딩 에이전트 창과 MCP 서버 기능도 들어 있습니다.
작성자는 COM·OCX 컨트롤과 윈도 API 호출은 지원하지 않아 원본 VB6를 완전히 대체하지는 않는다고 밝혔습니다.

HN 반응

모든 속성과 이벤트가 눈앞에 보이던 VB6를 그리워하는 댓글이 많았지만, 폼 디자이너는 창 크기가 바뀌는 화면에 맞지 않는다는 반론도 나왔습니다.
기능은 좋다는 평과 함께 창 모양이 어색하고 키 입력 이벤트가 없다는 버그 제보가 나왔고, 작성자는 계속 고치는 중이라고 답했습니다.

30개 표시 · 전체 129개

franga20004일 전 HN

요즘 플랫폼의 개발 도구가 이 정도 탐색성(discoverability)과 개발자 친화성에 한참 못 미친다는 게 더 황당하게 느껴집니다.

적절한 용어인지는 모르겠지만, 제가 말하는 탐색성은 팔레트, 속성 편집기, 비주얼 빌더, 코드 생성 같은 걸 갖췄다는 뜻입니다. 위젯 팔레트를 보고, 버튼을 화면에 끌어다 놓고, 클릭해서 버튼의 모든 속성을 확인하고 풍부하게 편집하고, 버튼에서 가능한 어떤 이벤트든 클릭 한 번으로 이벤트 핸들러 코드를 생성하는 겁니다. 문서를 뒤질 필요도, 속성이나 이벤트 이름을 짐작할 필요도 없이 모든 게 바로 눈앞에 있었죠. VB에서 제일 그리운 부분입니다.
booty4일 전 HN
VB6가 보기엔 좋아 보이지만, 단순한 GUI 앱을 넘어서면 정말 적대적인 난장판이었다고 장담합니다.

그리고 믿어 주세요, 지금 여러분이 보고 있을 널찍한 화면과 달리 비좁은 800x600이나 1024x1768 모니터에서 보는 VB6 인터페이스는 느낌이 상당히 다릅니다(그러니까 더 별로라는 얘기입니다). =)
```
    Makes it that much more absurd that tooling on modern 
    platforms isn't anywhere near this level of discoverability 
    and developer-friendliness.
```
여기에는 제가 떠올릴 수 있는 구체적인 이유가 몇 가지 있습니다.
1. VB6의 UI 요소 팔레트가 잘 동작한 이유는 아이콘과 캔버스에 놓았을 때 만들어지는 것이 사실상 1:1로 대응하기 때문입니다. 시각적인 요소에는 잘 맞지만, 시각적으로 대응되는 모양이 없는 것에는 잘 맞지 않습니다.
2. 툴바나 팔레트는 항목이 수십 개를 넘어가면 확장성이 떨어집니다. 반면 VSCode 스타일의 명령 팔레트나 텍스트 명령 자동 완성은 거의 무한히 확장됩니다.
3. HTML이 동작하는 방식은 VB6의 고정된 격자와는 완전히 다른 패러다임입니다. 이 데모가 보여주듯 HTML로도 그렇게 할 수는 있지만, 그러려면 VB6 앱처럼 어찌어찌 돌아가는 물건을 내놓을 각오가 필요합니다.
distantsounds4일 전 HN

기본적인 데스크톱 애플리케이션에 필요한 게 얼마나 적은지, 그리고 그중 얼마나 많은 부분을 Visual Basic이 기본으로 제공하는지 알면 놀라실 겁니다.

그리고 VB를 써 보시기는 했나요? 실행 중에는 보이지 않는 Timer 아이콘이 폼 여기저기에 널려 있는 건 흔한 일이었습니다.
pcdoodle14일 전 HN

"보이지 않는" 타이머를 그것과 함께 쓰는 컨트롤 옆에 놓아두는 것도 재미였습니다. 시리얼 포트 목록으로 리스트박스를 갱신하는 타이머요? 리스트박스 옆에 있죠. 그 타이머의 코드는 어디 있냐고요? 타이머에 있습니다. 더블클릭하면 됩니다!
danielheath4일 전 HN

언어로서의 VB6는 적대적인 난장판이었습니다. 폼 빌더 방식은 Delphi에도 있었고, Delphi에서도 똑같이 훌륭했는데 뒷받침하는 언어는 훨씬 나았죠.

폼 빌더는 반응형 디자인에 맞지 않습니다. 그게 전부이고, 업계에서 폼 빌더가 밀려난 이유의 전부입니다.
laumars4일 전 HN

VB6가 나올 무렵에 800x600을 쓰는 사람은 거의 없었습니다. 1024x768을 쓰는 사람조차 많지 않았을 겁니다.

그때 저는 17인치 CRT에서 1280x1024를 쓰고 있었는데, 그것도 당시로서는 평범한 수준이었습니다.

저는 VB6와 Delphi를 그 시대 IDE의 정점으로 봅니다. 80년대에는 Turbo Vision이 있었고요.
ndiddy4일 전 HN

드래그 앤 드롭 비주얼 디자인은 창 크기를 조절할 수 있어야 한다는 조건이 붙기 전까지는 가장 좋은 방식입니다. 그 조건이 붙는 순간 위젯마다 앵커링과 크기 조절 설정을 끝없이 만지게 되고, 위젯을 추가하거나 빼거나 폼 레이아웃을 바꿀 때마다 전부 다시 손봐야 합니다. 제가 해 본 UI 개발 중 가장 좋았던 경험은 Palm OS였는데, 모든 기기가 똑같은 160x160 논리 해상도를 쓰고 모든 소프트웨어가 전체 화면으로 실행되기 때문입니다. 크기 조절을 신경 쓸 일이 전혀 없으니, 모든 걸 절대 좌표에 배치하는 드래그 앤 드롭 디자인이 실용적이 됩니다.
genghisjahn4일 전 HN

컨트롤을 폼에 끌어다 놓고 더블클릭해서 이벤트 코드로 바로 들어가는 건 정말 마법 같았습니다. 그 시절에는 문서를 찾아보기 전에 몇 시간씩 이것저것 클릭하며 뭔가를 만들었던 기억이 선명합니다.
screamingninja4일 전 HN

제가 말하는 탐색성은 ...같은 걸 갖췄다는 뜻입니다

직관성 아닌가요?
gwbas1c4일 전 HN

어... C#으로 Visual Studio를 써 보셨나요? 이게 바로 직계 후손입니다.

Winforms는 조금 낡았지만 제 생각에는 VB6와 훨씬, 훨씬 가깝습니다. Xaml은 더 예쁜 UI를 만들어 주지만, 드래그 앤 드롭과 HTML을 어설프게 섞은 잡종입니다.

Blazor에 와서는 MS가 드래그 앤 드롭 UI를 그냥 포기했죠.
badsectoracula4일 전 HN
기능 면에서는 괜찮아 보입니다. 앱을 HTML 파일로 "컴파일"할 수도 있고요. 이런 건 정확히 이렇게 동작해야죠 :-).

하지만 외관은 잡음이 많고 일그러져 보이는 데다, 삐뚤어진 요소(특히 창 버튼)와 빠진 시각 요소(주로 베벨 가장자리)가 있습니다. 이에 대해 코멘트를 단 스크린샷을 만들어 봤습니다[0].

AI로 만든 것 같은데, AI는 참고 이미지를 확인하고 게다가 픽셀 단위로 정확하게 하라고 명시적으로 시키지 않으면 픽셀 수준 작업을 그다지 잘하지 못합니다. 그러니 클래식 테마를 켠 윈도 XP VM(더 좋은 건 윈도 95나 98을 돌리는 86Box)을 띄워서 스크린샷을 잔뜩 뜨시길 권합니다.

버그도 몇 개 찾았습니다.
1. 비시각 컨트롤(또는 비활성화된 컨트롤)은 클릭해서 선택할 수 없습니다(예: 타이머). 사각형 선택으로는 여전히 선택할 수 있고 핸들로 크기를 조절해 끌고 다닐 수도 있지만, 그 컨트롤을 클릭하면 폼이 선택됩니다.
2. 컨트롤을 추가해도 편집기의 컨트롤 목록이 갱신되지 않습니다. 핸들러가 없는 대상(즉 Form_Load 핸들러를 지운 폼)을 더블클릭할 때만 갱신됩니다. 목록이 갱신된 뒤에도 이벤트 목록에 이벤트가 하나뿐이면 그걸 선택해서 편집기에 핸들러를 추가할 수 없습니다(이미 선택된 항목이라 선택 이벤트가 오지 않아서겠죠).
간단한 퐁 게임을 만들어 보려 했는데 키 이벤트와 마우스 이동 이벤트가 아직 구현되지 않은 것 같아서, 결국 튕겨 다니는 OptionButton만 만들었습니다 :-P.

[0] http://runtimeterror.com/pages/iv/images/5ffbf1494821c77a3fed6ecd5ef38223.png
giancarlostoro4일 전 HN

AI로 만든 것 같은데

저도 AI로 제 나름의 것을 만들고 있습니다(이 프로젝트와는 별개이고 무관합니다). 천천히 진행 중인데, 소스 호환 컴파일러를 만들고 싶습니다. 지금까지는 폼과 소스 코드를 열 수 있는 정도이고(전부 IDE 전용입니다), 실제 컴파일러와 디버거를 만들기 전까지는 귀엽기만 할 뿐 갈 길이 멉니다. 쓸 만한 게 나오면 아마 GitHub에 올릴 겁니다.

저는 스크린샷을 활용하고 있는데, 정품 라이선스가 설치된 옛 노트북도 찾았습니다(대학 시절에 DreamSpark와 MSDN을 쓸 수 있었거든요).
gwbas1c4일 전 HN

소스 호환 컴파일러

앱이 더 저수준의 윈도 API를 호출하면 어떻게 되나요? (오래전 일이라 그 기술의 이름이 기억나지 않네요.)
wiso4일 전 HN

재미로 만든 프로젝트라 아직 버그가 많고, 기대하시는 수준으로 완전히 돌아가게 하려면 손볼 게 많습니다. 계속 지켜봐 주세요. 지금 새 기능과 수정을 많이 넣고 있습니다. 피드백 감사합니다.
HackerThemAll4일 전 HN

외관은 잡음이 많고 일그러져 보이는 데다, 삐뚤어진 요소(특히 창 버튼)와 빠진 시각 요소(주로 베벨 가장자리)가 있습니다.

사소한 트집이네요. 곰곰이 생각해 보니, runtimeterror.com은 무료로 쓸 수 있는 https도 없어서 들어가지 않겠습니다.
swiftcoder4일 전 HN

runtimeterror.com은 무료로 쓸 수 있는 https도 없어서 들어가지 않겠습니다

위협 모델을 좀 손봐야 할 것 같네요. jpeg 한 장을 내려받는데 https가 정확히 뭘 막아 주나요? 중간에서 누가 다른 jpeg로 바꿔치기하는 걸요?

모르는 도메인에서 https로 뭔가를 내려받아도 사이트 자체가 악성코드를 뿌릴 위험은 그대로 있습니다.
4gotunameagain4일 전 HN

어쩌면 로컬 네트워크의 장악된 기기가 중간자 공격으로 JavaScript 페이로드를 끼워 넣고, 그게 HackerThemAll의 브라우저 스택에서 제로데이 세 개를 터뜨려 컴퓨터를 장악한 끝에, 그의 초고도 지능형 지속 공격자들이 그의 초중요 데이터를 빼내 갈 수도 있겠죠.

그런데 그 모든 게 뭘 위해서일까요? 극비 업무를 미루는 와중에 HN 댓글 스레드에 달린 VB6 스크린샷 하나 때문에요?

아뇨, 그럴 가치는 없죠.
badsectoracula4일 전 HN

runtimeterror.com은 무료로 쓸 수 있는 https도 없어서 들어가지 않겠습니다.

이미지 직접 링크라서 비밀번호를 묻지 않습니다.

그리고 돈을 받지 않는 해법이 일부 있다고 해서 https가 무료로 제공되는 건 아닙니다. 이 경우 사이트는 공유 호스팅에 있어서 유일한 선택지는 호스트가 파는 유료 옵션이고, 대안은 VPS를 쓰면서 let's encrypt 같은 걸 설치하는 건데, 그러면 공유 호스팅보다 더 비싸고 제가 직접 시스템 관리자 노릇까지 해야 합니다. 그러니 돈이 안 든다는 의미에서도 공짜가 아니고, 시간이 안 든다는 의미에서도 공짜가 아닙니다.
HanClinto4일 전 HN

제가 그 버그 리포트를 작성자의 GitHub 프로젝트[0]에 미러링해 뒀으니, 도움이 된다면 거기서 스크린샷을 보실 수 있습니다.

[0] - https://github.com/wieslawsoltes/VB6/issues/39
waldrews4일 전 HN

프로퍼티 그리드 컨트롤은 지금도 역대 최고의 범용 UI입니다. 클래스를 정의하면서 속성(attribute)을 몇 개 붙이기만 하면 그냥 동작했죠. 그 뒤로는 웹과 모바일을 거치며 내리막길이었습니다.
wiso4일 전 HN

우리가 어쩌다 도구와 IDE에서 그렇게 많은 쓸모 있는 개념을 잃어버렸는지 늘 궁금합니다.
HackerThemAll4일 전 HN

이유는 2000년 이후, 길게는 2010년까지 취업 시장에 들어온 코더들의 마음가짐 때문이었습니다. 코딩을 할 수 있다는 것(프로그래밍 언어를 쓸 줄 안다는 것)이 호모 사피엔스 진화의 최종 단계라고 여겼죠. 이제 그 문제를 AI가 해결했으니, 로코드와 노코드, 속성 시트, 드래그 앤 드롭 사용자 인터페이스 같은 단순하고 건전한 개념으로 마음 놓고 돌아갈 수 있습니다.
pjmlp4일 전 HN

2000년대 초의 스크립트 키디들은 vi와 emacs밖에 모르고, 우리 중 많은 사람이 90년대 초까지 그랬던 것처럼 컴퓨터를 쓰던 시절에 대한 향수를 품고 있었기 때문입니다.
anakaine4일 전 HN

저는 이걸로 배웠기 때문에 다른 모든 걸 배우기가 그만큼 더 어려웠습니다. 다른 방식으로 하는 이유는 충분히 이해하지만, 지금도 이만큼 기능적이고 기본에 충실하고 직관적인 게 있었으면 좋겠습니다.
jit_tech4일 전 HN

VB6는 소프트웨어 개발 루프의 많은 부분을 하나의 환경에 압축했습니다. 컨트롤의 속성을 바꾸고, 동작을 붙이고, 실행하는 식으로요.

새로운 모습의 코딩 에이전트가 그걸 되살릴 수 있을지 궁금합니다. 이유는 두 가지입니다. 1) 코드 생성이 점점 빨라지고 있고, 2) 코드가 점점 "알아서 돌아가야 하는 세부 사항"이 되어 가고 있습니다.

VB6 같은 경험을 주면서, 추상화가 깨질 때는 (에이전트가 생성한) 진짜 코드로 파고들 수 있는 RAD를 상상해 보세요.
kkukshtel4일 전 HN

MS가 최근 PowerFX 언어로 비슷한 아이디어를 추진하고 있습니다.

https://github.com/microsoft/Power-Fx

사람들의 레이더에는 잘 안 잡히지만 꽤 흥미로워 보이고, HN을 보지 않는 많은 사람이 이 언어가 지원하는 앱을 통해 매일 쓰고 있을 거라고 생각합니다.
slfnflctd4일 전 HN

네, 제발요.

저는 MS Access로 꽤 오래 실력을 쌓았고, VB6가 그렇게 빨리 지원 중단되지만 않았다면 VB6로 훨씬 더 많은 걸 했을 겁니다. 계속 이어지고 발전하리라 기대했던 매끄러운 생태계 전체가 증발해 버린 기분입니다. 그 자리를 훨씬 까다롭거나 훨씬 비싼 것들(운이 정말 나쁘면 둘 다)이 차지했고요.

이 분야가 돌아오는 걸 보고 싶습니다. 현대적인 보안 기능과 확장 시의 병목을 줄인 모습으로요.
rapnie4일 전 HN

Visual Studio에서 한 줄에 중단점을 걸고, 실행 커서를 단계별로 따라가면서 범위 안의 모든 변수 값이 실시간으로 바뀌는 걸 보던 기억이 납니다. 그러다가 커서를 중단점보다 앞쪽 어딘가로 끌어다 놓고 아무 값이나 고쳐서, 다시 단계 실행하면 결과가 더 나아지는지 확인할 수 있었죠. 꽤 강력하고 즐거운 기능이었습니다.
slfnflctd4일 전 HN

그게 그렇게 훌륭했던 이유 중 하나입니다. 초보 개발자가 진행하면서 배우고 세밀한 피드백을 얻을 수 있는 방법이 여러 가지였는데, 숙련된 사용자의 작업 흐름은 전혀 방해하지 않았거든요.

저는 그게 당연하다고 여겼고 늘 있을 줄 알았습니다. 요즘 주니어들에게 알려 줄 비슷한 게 있었으면 좋겠습니다.
avallach4일 전 HN

같은 작성자의 다른 작품으로, 최신 Visual Studio에서 영감을 받은 C# 브라우저 IDE가 있습니다. https://github.com/wieslawsoltes/SharpForge

이 사람은 오픈 소스 저장소를 500개 넘게 갖고 있고, GPU 기반 GUI 프레임워크와 게임 엔진 구성 요소 같은 매우 고급 프로젝트도 있습니다( https://wieslawsoltes.github.io/Home ). 최신 AI 에이전트의 도움을 받았더라도 한 사람이 이걸 다 만들었다는 게 인상적이고 거의 믿기지 않습니다.

Hacker News에서 보기 ↗