오픈소스10 오픈소스 디자인 시스템 만들기 -2- 웹프론트 개발에서 스토리북은 매우 유용하다. 웹페이지를 개발을 할때 기능 단위, 그리고 좀 더 세분화 하면 컴포넌트 단위로 개발을 진행하게 되는데 웹프론트의 경우 UI를 개발하다보니 로직에 대한 테스트를 jest나 테스트 도구로 자동화 테스트를 진행한다고 해도 사실 실제로 보이는 부분(굳이 구분 하면 퍼블리싱)이 어떤지 컴포넌트와 각 조합마다 확인을 해야하는 상황이 생긴다. 마크업이라는게 수치적으로 자동화하는 것으로 끝나는게 아니라서 그런거 같다. 어쨌든 그런 경우 결국 E2E방식으로 확인을 해야하는데 스토리북이 없다면 기존의 개발중인 웹어플리케이션에 지금 개발하는 부분들을 연결해서 실행시키고 테스트를 돌려야 하는 등 여러 귀찮은 과정이 필요하다. 물론 스토리북도 스토리 코드를 작성해야하는 귀찮음이 존재.. 2022. 11. 11. 오픈소스 디자인시스템 만들기 -1- 디자인 토큰에 대한 기본적인 작업이 끝나고 (공간에 대한 부분 정의할 필요성 느낌) 디자인 시스템에 대한 기본적인 문서를 만들면서 이론적인 부분이 실제와 어느 정도 간격이 있는지 확인 해본 결과 색배합 적인 측면에서는 이론과 실제가 그럭저럭 괜찮은거 같다는 느낌을 받았다. 디테일한 부분들은 지속적으로 개선해나가기로 하고 일단 뼈대들을 차근차근 만들어가고 있는 중. 다음 단계로 리액트 컴포넌트를 설계하고 개발 한후 정리한 후 프로젝트를 공개해봐야겠다. 2022. 10. 14. [오픈소스][React] react-custom-swipe 모바일 앱을 그대로 웹으로 옮기면서 좌우 스와이프를 통한 인피니티 스크롤을 구현해야했다. 관련해서 여러 제약 조건들을 충족 시켜주는 오픈소스 라이브러리를 찾을 수 없어서 스와이프 기능을 분석하고 하드코딩으로 개발을 하였는데 해당 기능에 흥미를 느껴서 오픈소스로 개발해서 정리를 해보고 싶은 생각으로 개발 해보았다. 개인적으로 찾아본 결과로는 기존 웹사이트나 관련 오픈소스의 경우 스와이프에서 레이지로딩이나 페이지네이션을 지원하는 케이스를 발견하지 못했다.(핀터레스트 등) 보통 스와이프 기능이라고 부르는 스와이프 모션과 플립 모션을 감지하여서 데스크탑과 모바일에서 스와이프 기능을 제공해준다. 또 내부 아이템들이 페이지네이션처럼 비동기적으로 추가되어도 index 쿼리스트링을 통해서 데이터(item)의 index.. 2022. 8. 3. [오픈소스][socket.io]react-tomato-talk 개인적으로 채팅 프로그램을 혼자 개발해보고 싶은 마음으로 시작한 사이드 프로젝트이다. 채팅을 개발해보고 싶었으나 효율적인 측면에서 단기간에 혼자서 서비스급의 규모를 개발하고 디자인하고 싶지는 않았고, 그렇다고 사이드 프로젝트로 그저 별 의미도 없는 보여주기 위한 것을 개발할 바에는 다른 부분을 공부하는 게 더 효율적이라 생각하던 차에 적당히 시작해서 결과물을 내보자는 생각으로 만든 프로젝트이다. 채팅을 개발하는 것 자체는 사실 그렇게 어렵지 않다. 그러나, 고도화하고 잘 개발하는 것은 어렵다. 그런점에서 볼 때 유의미한 결과물을 만들기 위해서는 기존의 사용자들이 가진 요구와 나의 욕구를 적절히 충족시킬 방법을 고려해볼 필요가 있었다. 어차피 공개적으로 오픈소스로 개발할 것이라면 특정한 프로젝트에 종속적인.. 2021. 12. 14. 이전 1 2 3 다음
