react.js 라이브러리를 이용한 웹 프론트엔드 개발을 공부하고, 관련 프로젝트를 진행하며 결과물을 만들어낼 때 가장 고민했던 부분 중 하나는 CSS와 디자인을 적용하는 방식이었다. 기존에 적용하던 방식인 index.css를 이용하던 방식이나 .css 파일을 import하는 방식은 많은 문제점을 발생시켰다. 우선, css내용이 방대해질수록 코드 관리가 어려워지는 문제점이 있었다. 하나의 css파일에 매우 많은 css코드가 들어가는 만큼, 원하는 css부분을 수정할때, 이와 관련된 내용을 찾고 수정하는 데에 많은 시간이 소요되었다. 또한 프로그램의 구조가 복잡해질수록, 더 많은 classname과 id를 사용하게 되었고 이는 자연스럽게 코드 유지보수에 악영향을 초래하였다. 마지막으로, 상태값에 따른 동적 css를 적용할 때, 관련 코드를 작성하는 데에 많은 어려움이 있었다. 하지만, styled-components 라는 라이브러리를 react 프로젝트에 적용한 후 위의 문제가 상당 부분 개선되었다. styled-components 라이브러리는 자바스크립트 코드 안에 css 코드를 삽입함으로써 코드 가독성을 향상시켰다. 또한, classname과 id를 자동으로 설정해주어 이를 설정하고 관리하는데 필요한 시간을 줄여주었고, 전처리기와 props를 통한 스타일링으로 동적 스타일링을 획기적으로 이용할 수 있도록 도움을 주었다. 이와 같은 많은 장점에도 불구하고, 내 주변 프론트엔드 개발을 공부하는 학우들은 styled-components 라이브러리를 거의 사용하지 않았고, 관련 내용을 잘 모르고 있었다. 따라서, 이 라이브러리의 장점을 소개하고 관련 내용을 보여주고자 동영상을 제작하게 되었다.
# 개발하면서 발생했던 문제점
styled-components 라이브러리 자체는 평소에 자주 사용하던 것이었고, 관련 장점과 단점도 자주 체감되던 것이었으므로 내용 작성에 대해 큰 어려움은 없었다. 하지만, 동영상을 녹화하는 것은 처음하던 작업이었기 때문에 여러 문제가 발생했다. 먼저, 마이크 녹화에서 잡음이 많이 들어가 녹화 음질이 많이 떨어졌다. 또한, 마이크 소리는 잘 녹화되는데 반해 컴퓨터 오디오는 녹화가 안되기도 하고, 녹화 소리 볼륨도 별로였다. 위와 같은 문제점을 해결하기 위해 OBS studio라는 무료 녹화 프로그램을 사용하였다. 문제점 해결과정에서 여러 애로사항이 있었으나 구글 검색을 통해 해결할 수 있었다. 그러나, 녹화를 시작하고 ppt를 열어 발표를 시작할때까지의 텀과, 발표를 마치고 녹화프로그램에서 녹화종료 버튼을 누르기까지의 필요없는 녹화 구간이 생겨나게 되었다. 위의 문제는 오픈소스 동영상 자르기 프로그램을 통해 해결할 수 있었다. 결국에는 발표 컨텐츠 작성에 비해 녹화 환경 셋팅에서 많은 어려움을 겪은 것 같다.
# 감상
내가 지식으로 가지고 있는 것과, 내가 아는 지식을 다른사람이 이해하기 쉽게 설명하는 것은 다른 문제라는 말을 많이 들어보았다. 하지만, 이를 절실하게 체감하게 된 것은 이번 프로젝트가 처음인 것 같다. styled-components라는 라이브러리는 내가 평소 자주 사용하던 라이브러리였고, 관련된 지식은 가지고 있었다. 그러나 다른 사람이 나의 설명에 공감하고 styled-components를 사용하게끔 유도하는 것에서는 많은 고민을 필요로 하였다. 내가 평소에 css를 프로젝트에 적용하며 느낀 문제점과, 이를 styled-components를 통해 어떻게 해결할 수 있고, 코드 작성과 프로젝트 관리에 이 라이브러리가 어떤 도움을 줄 수 있는지 설명하려고 노력하였다. 위의 활동을 하며 라이브러리에 대한 나의 이해가 한층 깊어진 것을 체감할 수 있었다.
이와 별개로 왜 내 주변 학우들이 styled-components를 사용하지 않았던 이유에도 고민을 해보게 되었다. styled-components 자체는 오픈 소스이고, 사용하는데 별도의 자원 즉 금액을 필요로 하지 않는다. 그런데 왜 내 주변 학우들은 왜 이 라이브러리를 사용하지 않았을까? 내가 내린 결론은 이 오픈소스에 대한 정보를 많이 접하지 못했다는 것이다. 오픈 소스에 대한 개념이 대중화되면서 다양한 오픈소스들이 매일 출시되고 있다. 오픈소스가 많이 출시되고 있는 만큼, 오픈소스를 사용자에게 인식시키고 장점을 어필하여 사용량을 늘리는것 또한 중요한 점이 되는 것이다. 결국에는 수업 후반부 중 교수님께서 말씀하신 대로 좋은 소프트웨어 개발이 중요하지만, 소프트웨어를 이용한 비즈니스 또한 이에 못지않게 중요하다는 점을 프로젝트를 진행하며 깨달을 수 있었다.
