파이어폭스에서 바로 아두이노 코딩하기, WebSerial이 바꾼 하드웨어 개발

브라우저에서 마이크로컨트롤러를 다룬다고?

Mozilla가 Adafruit과 손잡고 흥미로운 협업을 발표했어요. 이제 파이어폭스 브라우저에서 별도 프로그램 설치 없이 Adafruit의 하드웨어 보드를 바로 프로그래밍할 수 있게 된 거예요. 회로 조립하고, 코드 짜고, 펌웨어 업로드하고, 시리얼 모니터로 디버깅까지 전부 브라우저 탭 하나에서 끝나요. 아두이노 IDE 같은 무거운 개발 환경을 깔지 않아도 된다는 거죠.

Adafruit는 미국의 유명한 메이커 기업이에요. Limor Fried(Ladyada)라는 분이 창업한 회사인데, Circuit Playground, Feather, Trinket 같은 입문자용 마이크로컨트롤러 보드를 만들고 있어요. 교육용으로 정말 인기가 많고, 라즈베리 파이만큼 메이커 씬에서 영향력이 큰 회사예요. 이번에 파이어폭스와 협업해서 만든 게 바로 "Code with Mu"와 "CircuitPython Editor"의 웹 통합이에요.

WebSerial과 WebUSB, 이게 마법의 비결

어떻게 브라우저에서 USB로 연결된 보드를 직접 제어할 수 있을까요? 비밀은 WebSerial API와 WebUSB API에 있어요. 원래 브라우저는 보안상 시스템의 하드웨어에 직접 접근할 수 없게 막혀 있었어요. 그런데 최근 몇 년 사이에 "사용자가 명시적으로 허용한 장치에 한해서"는 접근할 수 있도록 새로운 API들이 도입됐어요.

WebSerial API는 시리얼 포트로 연결된 장치와 양방향 통신을 가능하게 해줘요. navigator.serial.requestPort()를 호출하면 사용자에게 "어떤 시리얼 장치를 허용할까요?" 팝업이 뜨고, 선택하면 해당 포트로 데이터를 읽고 쓸 수 있어요. WebUSB는 좀 더 저수준이에요. USB 디바이스의 endpoint에 직접 데이터를 보낼 수 있어서 펌웨어 업로드 같은 작업도 가능해요. CircuitPython 보드는 USB Mass Storage로 인식돼서 파일 복사만으로 코드 업데이트가 되는 구조인데, 이걸 WebUSB로 자동화한 거죠.

CircuitPython이 뭐길래 이게 가능한가

CircuitPython은 Adafruit가 만든 임베디드용 파이썬이에요. MicroPython에서 포크해서 입문자 친화적으로 개조한 버전이고요. 보드를 USB로 꽂으면 USB 드라이브처럼 인식되고, 그 안에 code.py 파일만 있으면 자동으로 실행돼요. 컴파일이고 뭐고 없이 그냥 파이썬 파일 저장하면 바로 동작해요. 시리얼 콘솔을 열면 print() 결과가 그대로 나오고, REPL로 라이브 코딩도 가능해요.

이런 구조 덕분에 브라우저에서 코드 짜고 → WebUSB로 파일 전송 → WebSerial로 실행 결과 확인이라는 완전한 워크플로우가 만들어졌어요. 아두이노가 C++ 컴파일이라는 무거운 단계를 거쳐야 했던 것과 비교하면 정말 가볍죠. 게다가 파이썬이니까 코딩 배운 적 없는 학생도 30분이면 LED를 깜빡일 수 있어요.

크롬은 되는데 파이어폭스는 왜 늦었나

사실 WebSerial과 WebUSB는 크롬과 엣지에서는 몇 년 전부터 지원하던 기능이에요. 그런데 모질라는 이 API들의 보안 모델에 우려를 표하면서 지원을 미뤄왔어요. 임의의 웹사이트가 USB 장치에 접근할 수 있다는 게 잠재적으로 위험할 수 있거든요. 악성 사이트가 키보드를 가장한 USB 장치에 명령을 주입하거나, 펌웨어를 무단 변경할 가능성도 있고요.

이번에 파이어폭스가 지원을 시작한 건 Adafruit 도메인 같은 신뢰할 수 있는 사이트에 한정해서 점진적으로 여는 방식이에요. 사용자가 매번 명시적으로 허용해야 하고, 세션이 끝나면 권한이 사라지고요. 이런 방식 덕분에 보안과 편의성 사이의 균형을 맞추려고 한 거죠. 장기적으로는 더 많은 사이트에서 쓸 수 있게 확대될 거고요.

비슷한 시도들과 업계 흐름

브라우저에서 하드웨어를 다루는 시도는 점점 늘어나고 있어요. Microsoft의 MakeCode는 micro:bit를 브라우저에서 시각적으로 프로그래밍하게 해주고요. Espressif의 ESP Web Tools는 ESP32 보드 펌웨어를 브라우저에서 바로 플래시하게 해줘요. TinyGo Playground는 Go로 짠 임베디드 코드를 웹에서 시뮬레이션하고요. 공통점은 "개발 환경 설치라는 진입 장벽을 없애자"는 거예요.

특히 STEM 교육 분야에서 이런 흐름이 빨라요. 학교에서 학생들 노트북마다 IDE 깔고 드라이버 설치하는 게 보통 일이 아니거든요. 브라우저만 열면 되면 수업 준비가 훨씬 간단해지고, 학생이 집에서도 같은 환경으로 작업할 수 있어요. ChromeBook이 깔린 미국 학교 환경에서는 특히 잘 맞고요.

한국 개발자와 메이커에게

한국의 메이커 씬과 코딩 교육 시장에서도 이건 좋은 소식이에요. 학원이나 학교에서 아두이노 수업할 때 매번 드라이버 깔고 IDE 설정하느라 한 시간씩 날리는 경험, 다들 있으시잖아요. 브라우저 기반으로 가면 그런 번거로움이 사라져요. 또 IoT 프로토타이핑이나 사내 해커톤에서도 빠르게 아이디어를 검증할 수 있고요.

실무 개발자분들도 WebSerial/WebUSB는 알아두면 좋아요. 자체 하드웨어 제품을 만드는 회사라면, 펌웨어 업데이트 도구를 굳이 설치형으로 만들 필요가 없어져요. 웹페이지 하나로 고객이 자기 디바이스를 업데이트할 수 있게 만들 수 있거든요. 실제로 Logitech, Razer 같은 회사들도 이런 방향으로 가고 있어요.

마무리

하드웨어 개발의 진입 장벽이 또 한 번 낮아졌어요. 브라우저가 점점 운영체제처럼 변해가는 흐름이 임베디드 분야까지 닿은 거죠. 여러분은 브라우저에서 하드웨어를 직접 다루는 게 편리하다고 느끼시나요, 아니면 보안이 걱정되시나요?