커넥to 강사님이 궁금하세요?

제로베이스 커넥to 강사가 ‘좋은 개발자’ 키우는 법
| HTML/CSS 김데레사 강사님 인터뷰

| part 1. HTML/CSS, 제대로 알고 있나요?

안녕하세요 강사님, 자기소개 부탁드립니다.

안녕하세요. 김데레사입니다. 저는 제로베이스 커넥to(구 패스트캠퍼스 네카라쿠배)을 비롯해 멀티캠퍼스, 한국생산성본부 등 다양한 기업과 공공기관에서 HTML/CSS 및 웹접근성 관련 강의를 하고 있습니다.

인터뷰에 앞서 프론트엔드 기술을 간단히 설명해주세요.

프론트엔드 기술인 HTML/CSS와 JavaScript를 잠시 소개해드릴게요. 해당 기술을 인간에 비유해서 설명드리자면, HTML은 인간을 구성하는 하드웨어, 즉 ‘몸’이라고 할 수 있고, CSS는 입을 수 있는 옷과 같은 ‘패션’에 해당해요. 그리고 JavaScript는 ‘뇌’라고 볼 수 있죠. 이 세 가지가 모두 프론트엔드 개발에서 중요한 영역임에도 HTML/CSS를 가볍게만 취급하는 경향이 있어요. 웹접근성 측면에서 절대로 소홀히해선 안되는 분야임에도 말이죠. 그래서 HTML/CSS를 좀 더 깊이있게 배우고 활용하실 수 있도록 강의할 계획이에요.

웹표준, 웹접근성에 대한 설명을 들려주세요. HTML에서 빼놓을 수 없는 개념인 것 같습니다.

웹표준은 웹에서 표준적으로 사용, 권고되는 기술을 말해요. 그리고 웹접근성은 모든 사람이 동등하게 접근할 수 있도록 보장하는 것이라 할 수 있죠. 흔히 디자인이나 개발을 할 때 사용성이나 심미성, 가독성 등을 고려하지만 상대적으로 ‘접근성’에 대해서는 그만큼 노력을 기울이지 않는 것 같아요. 단순히 동작하도록만 만들면 되는 게 아니라 여러 환경을 고민할 수 있어야 한다는 것이죠.

​예를 들어, 마우스가 없는 환경에서는 키보드로 사용할 수 있도록 다른 대체 수단을 함께 제공한다든지, 이미지를 볼 수 없는 환경이나 사람도 이미지의 정보를 동등하게 이해할 수 있도록 이미지의 대체 텍스트를 제공하는 것 등을 들 수 있죠.

​커넥to의 다른 강의와 비교했을 때, HTML/CSS 수업 특징이나 특이점이 있을까요?

HTML, CSS가 가장 쉽다고 생각해서인지 본인이 꽤 잘한다고 생각하는 경우를 많이 보게 돼요. 현업 개발자 분들도 이 부분은 중요하게 생각하지 않기도 하고요. 그러나 첫날 수업을 들으면 많이 혼란스러울 거예요. 좌절할지도 모르죠. 그러나 수업을 듣다보면 제대로 안다는 것이 무엇인지 느끼게 되고 성장했다는 걸 깨닫게 될 겁니다. 짧은 시간 안에 올바른 방향으로 이끌어드릴테니 강사를 믿고 따라오시길 바라요.

| part 2. 제로베이스 커넥to에선 이렇게 배웁니다

HTML/CSS의 주차별 수업 과정에 대해 간단히 들려주세요.​

본격적인 수업 시작 전에, 수강생분들께 제로베이스 프론트엔드 스쿨으로 영상 이론 학습을 하고 오시라고 말씀드려요. 바로 실습을 들어가려면 이론 학습이 필요하기 때문이에요. ​1주 차에는 영상 강의로 학습한 내용을 바탕으로 고정형 레이아웃 예제를 구현해 보면서 HTML을 활용한 구조 설계와 CSS 활용법을 배우게 되는데 이때 이론을 어떻게 활용해서 UI를 제작하는지, 웹접근성 관점에서 좋은 UI란 무엇인지를 깨닫게 될 거예요.

​2주 차에는 반응형 레이아웃 예제를 실습​하게 되는데 이 실습을 통해 다양한 디바이스에서 유연한 UI를 구현하기 위해 어떻게 대응해야 하는지를 배울 수 있어요.

​마지막 ​3주 차에서는 CSS를 좀 더 효율적으로 사용할 수 있도록 Sass를 추가로 배우게 되고 PostCSS, Tailwind CSS도 함께 살펴보면서 왜 이러한 기술들이 나타났고 어떻게 사용해야 하는지를 살펴볼 예정이에요.

이론 학습, 실습, 프로젝트라는 3단계에서 가장 강조하시는 부분은 무엇인가요?

​‘실습’을 가장 중요하게 생각해요. UI 제작 실습으로 어떤 원리를 통해 결과가 나오는지 이해하고, 응용할 수 있도록 하고 있어요. 또한 본인이 만든 UI가 다양한 환경 및 사용자에게 어떤 사용성(UX)을 제공하는지 고민하게 하고, 웹접근성이 높은 UI를 구현하는 방법에 대해 생각해보게 하죠. 3주 강의 후 마지막 1주는 팀 프로젝트를 통해 커뮤니케이션 방식을 익히고 있어요.

가장 중요하다고 말씀하신 ‘실습’에 대해 좀 더 구체적으로 들려주세요.

앞서 말씀드린 웹표준 관점에서 문법 오류는 없는지, 시맨틱 마크업이 적절하게 사용되었는지, 코드는 수정 및 재사용이 가능하도록 유연하게 작성했는지 그리고 웹접근성 관점에서 문제는 없는지 고민해보고 스스로 코드를 짜보도록 하고 있어요.​ 그 후 제가 구현한 코드를 설명하면서 각자의 코드와 비교해 문제점을 찾게 하죠. 이 단계에서 토론을 많이 하는데요, 저 역시 교육생들에게 인사이트를 얻을 때가 있어요.

​실습 단계에서 토론을 진행한다고 말씀드렸는데, 처음에는 많이 어색해하시지만 점점 적응하시더라고요. 정답을 알려주는 것보다는 스스로 공부할 수 있는 분위기나 방법론을 심어주는 게 중요한 것 같아요. 자신만의 사고를 하고, 다른 개발자를 설득하는 과정도 필요하니까요.

저희 수강생 분들과의 에피소드 중 기억에 남은 일화가 있나요?

​위 멘트는 멀리서 올라온 프론트엔드 스쿨 수강생이 백엔드 스쿨과 협업 프로젝트를 위해 본인을 소개하는 PT에서 했던 말이라고 전해들었어요. 다들 그 발표에 ‘빵’ 터졌다며 제게 전해주더라구요. 졸지에 장성한 아들을 두게 된거죠. (웃음) 사실 이밖에도 정말 많은 사례가 있어요.

저희 수강생 분들은 눈을 반짝이면서 강의를 들어주세요. 열의가 대단하시거든요.​ 그러다보니 기대와 믿음에 보답하기 위해 저 역시 진심을 다해 강의하게 되는 것 같아요.

| part 3. 예비 개발자에게 필요한 한마디

현업 프론트엔드 개발자, 혹은 예비 개발자가 HTML/CSS의 측면에서 간과하는 것이 있을까요?

제가 만난 대다수의 개발자분들이 가장 제대로 사용하지 못하는 것이 바로 HTML이었어요. K사 강의 때의 경험을 말씀드리자면, 강의 전 K사 서비스를 분석하기 위해 웹사이트를 살펴보았는데 메인 내비게이션의 HTML 명령어가 모두 〈div〉요소로만 구성되어 있는 걸 발견했어요. 심지어 메뉴에 〈a〉요소를 사용하여 구현해야할 하이퍼링크 기능까지도 〈div〉요소를 사용했더라구요. 이 방식의 문제는 해당 기능이 마우스로만 동작한다는 점인데요, 키보드 같은 입력장치로는 접근도 제어도 할 수 없다는 점이죠.

이런 코드를 구현한 이유는 HTML이 어떤 역할의 언어인지, 어떻게 사용해야 제대로 된 사용자 경험을 제공할 수 있는지에 대해 고민을 하지 않은 것이고, 웹접근성과 웹표준 기술을 제대로 알지 못하기 때문이라고 생각해요. 디자인 관점에서만 HTML을 바라봤기 때문에 제대로 된 개발을 하지 못한 것이죠.

​​앞으로 예비 개발자가 신경쓸 것 중, ‘웹시장의 변화’라는 측면에서 들려주실 말씀이 있을까요?

​우리나라는 CSS를 굉장히 보수적인 관점으로만 사용하고 있는 것 같아요. 그 이유는 Internet Explorer(IE) 지원 때문이기도 하죠. 그러나 마이크로소프트에서 IE 11버전에 대한 지원도 2022년 6월까지라고 발표했으니 우리도 모던 브라우저 환경에 맞출 수 있도록 최대한 변화의 흐름을 따라가야 해요. 추가적으로는 Atomic CSS, Utility First, PostCSS 등에도 관심을 가지면 좋을것 같아요.

신입 개발자가 갖춰야 할 HTML/CSS 능력은 어느 정도일까요?

​신입이 갖춰야 할 능력의 기준은 정답이 없어요. 기업이 원하는 개발자의 기준은 다를 수 있기 때문이죠. 다만 커넥to 과정을 듣는 분들은 분명히 다른 프론트엔드 개발자와 차별화 된 경쟁력을 갖게 될 거라 생각해요. 다들 JavaScript나 Framework에만 집중할 때, 커넥to 과정을 이수한 분들은 JavaScript나 Framework 실력은 물론이고 HTML/CSS, 웹접근성도 제대로 할 수 있기 때문이죠.

​패스트캠퍼스 프론트엔드 스쿨을 수료하고 현재 프론트엔드 개발자로 일하는 수료생이 이런 피드백을 주셨어요. “신입으로서 ‘어디서 배웠는지 깊이 있게 배웠구나’라는 평을 들은 것은 데레사 강사님 덕분인 것 같다”라고요. 여러분도 커넥to 과정을 이수하고 나면, HTML/CSS를 누구보다 깊이있게 알게 될 거예요.

​강사님께서 생각하시는 ‘좋은 개발자’란 어떤 사람인가요?
혹은 ‘주니어 개발자가 갖춰야 할 마인드’에 대해 들려주셔도 좋겠습니다.

오류 없이 정해진 시간 안에 개발을 끝낼 수 있는 개발자를 실력 있는 좋은 개발자라고 생각할 수 있지만, 저는 실력을 떠나서 ‘개발을 즐기고 성장을 위해 노력하는 사람’이 좋은 개발자라고 생각해요. 매일 조금씩이라도 성장하려고 노력하고, 성취감을 느끼는 사람이어야 개발을 오래 할 수 있거든요. 그렇게 하다보면 어느새 ‘좋은 개발자’가 되어 있으리라 생각해요.

​두 번째로 ‘혼자가 아닌, 함께하는 개발자’예요. 함께 더 나은 가치를 만들어나가기 위해 노력해야 해요.

마지막은 ‘사용자를 생각하는 개발자’예요. 개발은 결국 누군가를 위한 서비스를 만드는 직업이잖아요. 그것이 모두를 위한 것이라면 이 역시 ‘좋은 개발자’라고 볼 수 있을 것 같습니다.

제로베이스와 함께한 이야기가 더 궁금하다면,