들어가며오픈소스 소프트웨어는 개발자와, 개발 커뮤니티, 여러 기업들에게 수많은 이점을 제공하고 있습니다.오픈소스 소프트웨어는 이미 구현된 다양한 기능을 무료로 사용할 수 있을 뿐만 아니라, 개발 코드의 투명성과 손쉽게 커스터마이징도 할 수 있습니다.하지만 이렇게 많은 이점을 제공하는 오픈소스 라이브러리도 사용할 때 반드시 이해해야 할 중요한 요소가 있는데요. 바로 라이센스 입니다.이 글에서는 지난번 제가 작성한 글에 이어 오픈소스 라이브러리와 주요 라이센스 유형과 그 특성에 대해서 알아보도록 하겠습니다.  오픈소스 라이센스의 분류오픈소스의 라이센스는 배포 시 소스 코드의 제공 의무(Copyleft)에 따라 크게Reciprocal(소스코드 제공 의무)와 Permissive(소스코드 제공 의무 없음)로 분류..

들어가며저는 프런트엔드 개발을 하며 종종 mock 데이터가 필요해 손쉽게 mock 데이터를 만들어주는 faker.js라는 오픈소스 라이브러리를 즐겨 사용합니다.이 faker.js를 사용하면 각종 프로젝트를 진행하면서 필요한 이름, 이메일, 회사명, 주소, 랜덤 한 이미지 등 원하는 형태의 데이터를 손쉽게 생성할 수 있었기에 Api가 준비되지 않은 상태에서도 개발과, 테스트를 진행할 수 있고, 최근에도 종종 요긴하게 잘 사용하고 있습니다. 그런데 이 faker.js라는 라이브러리로 인해 수많은 기업들과 인터넷 커뮤니티가 난리가 났던 적이 있습니다. 바로 2021년 말 발생한 faker.js와 colors.js 사태인데요.이 사태를 통해 당시 해당 라이브러리를 사용하던 여러 기업들과 사용자들은 큰 혼란에 빠..

들어가며올해 그룹에서 Web 3에 대한 내부 프로젝트를 시작하게 되면서, 내부 환경 세팅 및 관련 라이브러리 사용에 대해 고민하던 중, WAGMI.sh라는 라이브러리를 우연히 알게 되었습니다. 비록 실제 프로젝트에 투입되지는 않았고 해당 라이브러리를 사용하지는 않았지만, 공부를 통해 WAGMI.sh의 내부 동작 방식을 이해하고 분석하는 좋은 기회를 얻게 되어 학습 경험을 공유하고자 합니다.WAGMI.sh란,블록체인 기술과 상호작용을 하는 애플리케이션을 위해 설계된 유틸리티 라이브러리입니다.여기서 WAGMI 는 “We’re All Gonna Make It”의 약자로 암호화폐와 web 3 커뮤니티에서 자주 사용되는 표현인데,이더리움 개발과 일반적인 작업을 단순화하는 훅을 제공합니다.Wagmi.sh에서 제공하..

들어가며블록체인의 컨트랙트에서 전송을 감지하고, 어떻게 처리하는지 알아보자.처음의 궁금증은 지갑에서 보이는 기본 토큰의 보유 수량을 어떻게 업데이트하는지에 대한 고민부터 시작되었다.다른 사람이 내 지갑으로 토큰을 전송한 걸 감지해서 보여줄까? 에 대한 고민이었는데, 어떻게 하면 더 효율적으로 보유 수량을 업데이트할 수 있는지 알아보고, 찾아낸 방법을 소개하고자 한다. 단순한 해결 법최초 고민 시에 내가 아는 지식은 블록체인 내에서 내가 가진 토큰의 수량을 조회하고 보여주는 게 끝이었다.이런 지식 속에서 처음 생각난 해결법은 주기적으로 내가 가진 토큰의 수량을 조회하여 보여주는 방식이 생각났지만 동시에 너무나도 비효율적인 방법이라는 생각이 듦과 동시에 누가 생각하더라도 이런 비효율적인 방법보다 더욱 효율적..

들어가며구글에는 수많은 서비스가 있습니다. 검색, 유튜브, 메일... 전부 기억하기 힘들 만큼이나 많습니다. 하지만 여러분들은 구글 서비스를 이용하며 로그인을 해본 기억이 그리 많지는 않을 것입니다. 과연 구글은 어떻게 사용자가 로그인을 하지 않고도 서로 다른 도메인 간 로그인을 유지시킬 수 있었을까요? 이번 포스트를 통해 이에 대하여 추측해 보겠습니다.본론우선 공식 문서를 통해 힌트를 얻어 보겠습니다. 기본적으로 저희는 구글에서 계속 로그인 상태를 유지하고 싶습니다. 하지만 그렇지 못하는 경우에 대해 구글은 '쿠키' 사용 설정을 확인해 보라 알려줍니다. 이를 통해 구글은 로그인 유지에 '쿠키'를 활용한다는 것을 알 수 있습니다. 스택오버플로우의 글에서는 아래와 같이 도메인 단위의 쿠키 저장이 가능함을 ..

들어가며WebGL 기반의 자바스크립트 라이브러리 three.js를 react에서 손쉽게 사용할 수 있도록 도와주는 라이브러리인 react-three-fiber(이하 RTF)에 대해 간단하게 알아봅니다. 특징컴포넌트 기반3D 장면을 웹상에서 구현하기 위해서는 수반되어야 하는 많은 지식이 있습니다. 카메라, 조명, 텍스처, scene 등을 하나하나 구현해나가야 하는데 three.js를 사용해 본 사람은 알겠지만 단순한 mesh 하나를 만드는데도 많은 양의 코드가 필요합니다. 복잡한 내용일수록 코드 가독성은 떨어지고 피로감은 올라가죠.RTF는 react 개발자라면 익숙한 커스텀 태그와 컴포넌트 형식으로 각종 API를 제공합니다. 또한 react 훅과도 잘 맞고 useFrame, useLoader 같은 다양한 ..

들어가며최근 운영 프로젝트 업무 내용 확인하다 보니 구축 시에는 칸반 보드를 생성하였으나 운영 모드에서는 사용하지 않아 파악이 어려웠던 경험이 있었고, 앞으로 진행하는 프로젝트는 깃헙 칸반 보드를 적극 사용했으면 하는 마음에 얘기를 해보고 싶어 졌습니다.칸반보드를 도입하게 된 배경기존에는 맥북의 그룹 메모, 슬랙 메신저로 정보를 취득하는 환경이다 보니 시간별로 데이터를 쌓는 구조여서 정보가 쌓을수록 데이터 구분이 되지 않았고, 산발적으로 쏟아지는 업무와 다수 작업자의 업무 및 진행사항은 프로젝트 그룹원 모두 파악하기 어려워 기억에 의존하거나 PL이 개인적으로 기록하고 있는 환경이었습니다. ⇒ 작업자별 각자 업무를 파악하고, 여러 작업의 진척 상황을 한눈에 구분할 수 있고, 특정 업무별 히스토리를 기록할 ..

들어가며현재 진행하고 있는 프로젝트는 Github을 이용해 형상 관리 중입니다.프로젝트에서 작업한 브랜치는 PR(Pull Request)을 통해 팀원들에게 코드 리뷰를 받고, 이후에 master 브랜치에 합치는 방식으로 진행하고 있습니다. 여기서 내가 PR의 코드 리뷰어로 선정되었는지 알 수 있는 방법은 회사 메신저인 Slack의 Github 봇을 통해 알림을 받을 수 있었습니다.하지만 PR의 코드 리뷰어로 선정되었다는 정보 말고 PR 관련 모든 정보가 함께 와서 필요 없는 정보로 Slack 채널의 오염도가 높아지는 걸 느꼈습니다.원하지 않는 pr 내용까지 보여주고 있다.심지어 Slack을 창 모드로 작게 사용하면 단 2개의 알림으로도 채팅창이 꽉 차는 걸 볼 수 있습니다.함께 보는 팀 채널에 올라온다면..

들어가며 지난 2023년 12월, 업무상 Ethereum(이더리움) 네트워크에서 사용할 수 있는 월렛을 만들어야 했다. Web3와 블록체인에 관한 지식이 없어 우선, 월렛의 가장 기본적인 기능인 토큰 전송 및 관리가 가능한 단계부터 시작하기로 했다. Ganache-cli를 사용해 로컬 환경에서 토큰 조회, 전송, 트랜잭션 조회 등 이런저런 테스트를 하다가 실제 네트워크에서도 월렛이 제대로 작동할지 궁금해져 Ethereum 테스트넷을 알아봤다.  테스트넷 정하기처음에는 Web3나 블록체인에 관한 지식이 없는 나도 한 번쯤은 들어봤던 Goerli(고얼리)를 사용하려고 했다. 그러다 Goerli보다 나중에 나온 Sepolia(세폴리아)를 알게 됐고, '기왕 사용해 보는 거, 최근에 나온 테스트넷을 써보는 게 ..

들어가며 the-zero 백엔드를 담당하면서 작성하게 된 테스트 코드에 대해 공유하는 시간을 가져보려 합니다. 테스트 코드를 작성하게 된 이유 테스트 코드를 작성하게 된 이유는 아래 두 가지 때문입니다. 1. the-zero 애플리케이션의 신뢰성 2. 이 코드를 보게 될 미래의 그룹원과 미래의 나를 위해서 신뢰성 - 잘 동작하는 애플리케이션을 만들었다. - 일정에 쫓기느라 마음에 들지 않는 코드를 수정하고 싶지만 잘 동작하는 애플리케이션이 고장날까 걱정하며 리팩터링을 미룬다. - 급하게 다음 버전 기능 추가, 수정을 위해 코드를 추가한다. - 기존 코드와 새로운 기능을 하는 코드가 얽히고설키며 복잡해진다. - 기존 기능과 새로운 기능이 잘 동작하는지 테스트한다. - 기존 기능에서 오류가 발생한다. 새로운..

들어가며 스마트 컨트랙트 코드 작성법에 관해 공부하던 중 로컬 테스트를 할 수 있는 Ganache(가나슈)를 알게 됐습니다. Ganache는 Solidity(솔리디티)와 더불어 로컬 블록체인 네트워크에서 스마트 컨트랙트와 dApp(Decentralized applications)을 테스트하고 배포할 수 있는 툴인데요. 예전에 팀장님께서도 Ganache를 언급했던 기억이 나, 간략한 사용법을 공유합니다. New Workspace 개발 환경 설정하기 Ganache를 실행하면 나오는 첫 화면입니다. Quickstart와 New Workspace 중 하나를 선택합니다. 두 작업 환경 모두 Ethereum(이더리움)과 Filecoin(파일코인) 네트워크를 지원하니 원하는 메인넷을 선택한 뒤 설정 여부를 확인하고 ..

들어가며 프론트엔드 개발을 할 때 빠질 수 없는 라이브러리가 바로 Date 라이브러리인데요. Date 라이브러리는 다양한 종류가 있고, 또 각각의 장단점도 있습니다. 이번 포스팅에서는 Date 라이브러리의 대표 3대장인 Moment.js, Day.js, date-fns의 장점과 단점을 살펴보며 각 라이브러리의 차이점을 알아보겠습니다. Moment.js - 장점 기능의 풍부함 : Moment.js는 날짜 파싱, 유효성 검사, 조작, 포맷팅 및 국제화 등 날짜와 시간을 다루는 데 필요한 다양하고 풍부한 기능을 제공합니다. 이를 통해 복잡한 날짜 관련 작업을 쉽게 처리할 수 있게 도와줍니다. 사용의 용이성 : Moment.js의 API는 매우 직관적이고 사용하기 쉽습니다. 때문에 개발자들은 빠르게 학습하고 효..