본문 바로가기

분류 전체보기

(14)
상태 관리 라이브러리 (Jotai vs Zustand) 프로젝트를 진행하기 전에, 상태 관리 라이브러리를 선택하기 위해 작성하게 된 아티클입니다.비교적 최신 라이브러리를 사용해보고 싶었고, 처음에는 Recoil도 언급되었으나 Recoil은 메타에서 개발했음에도 불구하고 업데이트가 많지 않아 장기적으로 가져갈 프로젝트에서는 부적합하다는 판정을 내렸습니다.따라서 저는 Jotai와 Zustand 중 어느 라이브러리를 도입할 지 고민했습니다. (둘다 타입스크립트를 기반으로 제작되었습니다.)npm trendsRedux는 2015년에 개발된 라이브러리 답게 여전히 많은 사용률을 자랑하네요.Zustand는 2019년에 출시된 라이브러리이고, Jotai는 2020년에 출시된 라이브러리입니다.Zustand 가 더 빨리 출시된 것이 이유인지, Jotai보다는 약 3배 가량 더..
못말리는 Input 달래주기 2편 (이모지 입력) 안녕하세요 WEB 김채현입니다! BEAT는 대학생 공연 동아리들이 타겟층이기 때문에 공연명, 소개, 유의사항 등에 이모지가 들어갈 수 있다고 생각했습니다.그런데 이모지를 입력하면 이슈가 발생했는데요...🥹🥹 ⚠️ 이모지는 한 글자가 아니다. 글자수가 5로 되어야 하는데 이상하게 이모지마다 글자수가 다르고 심지어 이모지 하나에 11을 차지하기도 했습니다. 이유가 무엇일까요?이모지는 유니코드에 포함되어 있습니다. 유니코드 평면 중 다국어 보충 평면(SMP)에 포함되어 있는데이 평면에서 U+1F000 ~ U+1F9FF 영역에 이모지가 위치해있습니다.하지만 모든 이모지가 이 유니코드 평면에 존재하지는 않습니다.이모지에는 여러 유니코드 문자가 결합되어 하나의 이모지를 표현하는 이모지 시퀀스 (Emoji Seq..
비트에서의 React-query 사용해보기! 안녕하세요! WEB 정도영입니다.저는 '간편하게 소규모 공연을 등록하고, 관리할 수 있는 티켓 예매 플랫폼'인 비트를 개발하고 있습니다!  저는 비트라는 서비스를 통해서 일상 생활 속의 불편함을 해결하고, 더 나아가 많은 문제들을 해결하고 싶습니다. 또한, 이 서비스를 통해서 사용자를 만나고, 불편함을 개선하는 과정을 기록하려고 합니다! 저는 이번 프로젝트를 통해서 React-query 의 캐싱에 대해서 많이 배우게 되었는데요! 예전에 velog에 React-Query와 관련된 아티클을 쓸 때에는 조금 이론적으로 많이 알게 되고, 간단한 실습도 진행하였는데, 프로젝트를 통해서 실제로 사용하는 경험은 저도 처음이었습니다! 그리고, 저는 리액트 쿼리를 정말 이해하는데 많은 시간이 걸렸는데요,,, 처음에는 왜..
못말리는 Input 달래주기 1편 (숫자 입력) 안녕하세요! WEB 김채현입니다.BEAT는 공연 정보, 공연진 정보, 예매 정보 등 다양한 정보를 입력해야 하기 때문에 Input 컴포넌트가 많이 쓰이는 서비스이고, Input 공통 컴포넌트 제작을 맡게 되었습니다. 입력하는 항목들이 가격, 수량, 이름 등 다양한 종류가 있어서 `filter`를 `prop`으로 주어서 각 항목에 맞게 필터링을 하도록 구현했습니다. // 값 입력될 때  const handleOnInput = (e: ChangeEventHTMLInputElement>) => {    const inputName = e.target.name;    let inputValue = e.target.value;    if (filter) {      inputValue = filter(inputV..
React 카카오 로그인 준비 갈 완료! BEAT가 카카오 로그인을 선택한 이유BEAT는 사용자의 >>편리함비회원 로그인, 카카오 로그인 두 가지 방법으로 유저를 관리하기로 결정하였습니다!! 예매자는 빠른 예매를 위해 비회원 로그인도 가능하지만, 공연을 등록하는 사람인 호스트는 꼬옥 로그인이 필요하다고 판단함과 동시에 빠르고 간편한 로그인을 위해 카카오 로그인을 선택하게 되었습니다!그그그리고,,, 비회원 예매 조회 및 회원 예매 조회... 그리고 메인 페이지를 맡게 된 제가 카카오 로그인을 담당하게 되었습니다.저는감자라서카카오로그인처럼중요한내용을맡게되었다는사실이너무너무떨렸지만제가 어떠한 과정으로 진행하였는지 조금이나마 공유해보도록 하겠습니다 🩷저는 로그인 버튼을 선택하면 위와 같은 카카오 로그인 페이지로 이동하고, 로그인이 완료되면 플로우에 ..
모두를 위한, 그래서 대학생을 위한 예매 플랫폼 BEAT 🎇 첫 글 찜꽁... 나중에 수정하겠습니다,,,  왜 팀블로그를 선택했고, 팀원은 어떻게 구성되어 있는지 등 소개할 예정이에요!! ✌️