들어가며 프론트 작업을 하다 보면 사용자에 대한 정보를 이용한 작업이나 확인 여부를 가지고 작업을 하는 경우가 필요한데 클라이언트가 서버를 통해 인증을 확인받는 방법들과 JSON Web Token(이하 JWT) 토큰 인증에 대해서 알아보려 합니다. 인증과 인가 인증과 인가는 각각 인증(Authentication) - 사용자의 신원을 검증하는 행위 ( 비밀번호, 일회용 핀, 인증 앱, 생체인식 등) 인가(Authorization) - 사용자에게 특정 리소스나 기능에 액세스할 수 있는 권한을 부여하는 프로세스 이며, 둘을 간단히 비교하면 다음과 같습니다. 비교인증(Authentication)인가(Authorization) 기능 자격 증명 확인 권한 허가/여부 진행방식 비밀번호, 생체인식, 핀, 앱 보안팀에서..

pxd talks는 여러 분야의 연사님을 초빙해 인사이트를 나누는 시간입니다. pxd 구성원들이 더 넓은 시야로 무언가를 새롭게 발견하거나 자신을 성장시킬 수 있는 기회를 얻을 수 있도록 말이죠. 그리고 그 경험은 [pxd talks] 아티클로 기록합니다. pxd 구성원들이 함께 보고 듣고 느끼고 배운 것들이 사라지지 않고 pxd story에 남아 더 넓은 세상으로 뻗어갈 수 있기를 바랍니다. 들어가며, 인간은 사회적 동물입니다. 가족, 친구, 동료 등 다양한 집단에서 여러 사람과 부딪히며 살아가죠. 그러나 다른 사람과 관계를 맺는 것이 모두에게 순탄한 일은 아닙니다. 갈등, 불화 등으로 힘겨워하는 사람들도 많죠. 그렇다고 해서 세상과 단절된 채로 살아갈 수는 없습니다. 어떠한 지점에서, 찰나일지라도 타..

들어가며 더운 여름이 가고 가을이 오는게 느껴지는 요즘, pxd 구성원들은 여전히 위믹스 생태계의 다양한 프로덕트들을 만들어가느라 바쁜 나날을 보내고 있습니다. 그와 더불어 직접 만든 위믹스 프로덕트를 사용자 입장에서 이용해보자는 취지에서 시작된 ‘내돈내테 프로젝트'도 여전히 순항 중이죠. WEMIX PLAY에 이어 세 번째 ‘내돈내테’ 주제는 바로 월렛이었습니다. 월렛은 블록체인 세계 진입을 위한 가장 첫 번째 관문인데요, 리서치 및 월렛 디자인을 위해 여러 월렛을 직접 다운로드 받아보고 둘러보긴 했지만 암호화폐 투자자가 되어 월렛을 사용해본 적은 없었습니다. 이번 기회를 통해 정말 내 돈을 가지고 월렛을 이용했을 때 발견할 수 있는 인사이트들이 있을 것이라 생각했습니다. 어떤 월렛을 어떻게 봤을까? ..

들어가며 위믹스 생태계의 다양한 프로젝트를 디자인하는 pxd의 구성원들이 자신들이 만든 서비스를 직접 사용자의 입장에서 사용해 보는 ‘내돈내테’의 두 번째 테스트는 위믹스 플레이 (WEMIX PLAY)입니다. 위믹스 플레이는 위믹스 블록체인 생태계 중 PnE(Play and Earn)의 중요한 역할을 담당하는 GameFi(Finance) 플랫폼입니다. 게임 플레이어들은 위믹스 플레이를 통해 게임을 하고 얻은 토큰 보상으로 Pool이나 Staking에 예치하여 추가적인 이익을 얻거나, 다른 토큰으로 교환을 하는 등의 GameFi를 제공하고 있습니다. 초기 위믹스 플레이 3.0 사이트 개발에 참여했던 분을 포함한 디자이너 3명과 UX리서처 1명, 그리고 위믹스 플레이를 처음 접해보는 블록체인 유경험자 1명을..

pxd talks는 여러 분야의 연사님을 초빙해 인사이트를 나누는 시간입니다. pxd 구성원들이 더 넓은 시야로 무언가를 새롭게 발견하거나 자신을 성장시킬 수 있는 기회를 얻을 수 있도록 말이죠. 그리고 그 경험은 [pxd talks] 아티클로 기록합니다. pxd 구성원들이 함께 보고 듣고 느끼고 배운 것들이 사라지지 않고 pxd story에 남아 더 넓은 세상으로 뻗어갈 수 있기를 바랍니다. 지난번 강의 [pxd talks] WEB3 시대에서 정체성 표현과 소통의 방식이 어떻게 ‘통합’되고 있을까?가 WEB3 씬의 다양한 사용모습에 초점을 맞추었다면, 이번 108회 pxd talks에서는 WEB3가 가지는 의미와, 사용자 유입을 높이기 위한 전략에 초점을 맞추어 배워볼 수 있었습니다. WEB3가 뭐죠?..

들어가며 타이포그래피를 더욱 풍부하게 해주는 font-feature-settings 속성에 대해서 알아보겠습니다. font-feature-settings 이 속성은 오픈 타입 글꼴의 고급 설정을 제어합니다. 기본적으로 font-variant의 속성과 값을 축약 형태로 연결하여 중첩 선언하여 사용할 수 있는 형태입니다. 자세한 내용은 font-variant 속성과 함께 알아보겠습니다. 참고로 당연한 얘기지만 각 속성들은 해당 글꼴에서 지원해야 사용할 수 있습니다. font-variant-ligatures ligature라는 글꼴 속성을 제어합니다. ligature란 합자 기능으로 두 개의 글자를 하나로 합쳐서 간결하게 표현하는 것을 말합니다. 문자를 이용하여 화살표를 표현할 때 ”-” 와 ”>“를 연달아 ..

'지름길'은 목적지까지 빠르게 갈 수 있는, 빙 둘러 가지 않고 질러가는 길이에요. 지름길이 어떻게 생겼는지를 짐작해 보자면, 최초의 누군가가 평소 다니던 길 밖으로 나왔을 거고 용기를 내 담벼락을 뛰어넘거나 개구멍을 발견할 때까지 주변을 살폈을 테죠. 풀숲을 헤치거나 자갈들을 발로 밀어내며 길을 다졌을지도 몰라요. 그렇게 생긴 길은 다른 행인이 목적지에 더 일찍, 편안히 도착할 수 있도록 돕죠. 대뜸 왜 지름길이냐고요? 오늘 [pxd people] 주인공을 보며 딱 그런 생각이 떠올랐거든요. 과정은 절대 간편하지 않고 꽤나 수고롭지만, 그럼에도 새로운 길을 찾아 나서는, PD 2팀의 프로덕트 디자이너 진의준 님의 이야기를 소개할게요. Q. 주니어(주임) 인터뷰이는 처음이에요! 자기소개를 부탁드려요. p..

들어가며 요즘 서비스를 만들 때 SEO도 당연히 생각하고 만들다 보니 robot, sitemap 파일 등록이 필수가 되었습니다. 그룹 내에서도 해당 부분 프로젝트 구축 시 누락되지 않게 체크할 수 있는 체크 리스트와 가이드를 만들어 놓고 작업을 하고 있는데요, 이번에 Next.js에서 자동으로 sitemap을 생성해 주는 패키지가 업데이트되었다고 해서 현재 운영 중인 사이트에 적용해 보는 겸 가이드를 정리해 보았습니다. sitemap이 필요한가요? 구글에서는 아래와 같이 사이트맵의 필요성을 정의하고 있습니다. 사이트맵은 사이트에 있는 페이지, 동영상 및 기타 파일과 그 관계에 관한 정보를 제공하는 파일입니다. Google과 같은 검색엔진은 이 파일을 읽고 사이트를 더 효율적으로 크롤링합니다. 사이트맵은 ..

WEMIX.Fi의 WONDER Staking은 이용자의 ‘선택’이 중요한 상품입니다. 우선, 이용자는 예치자이자 WEMIX 커뮤니티의 일원으로서 WEMIX 3.0의 NCP(Node Council Partner)인 40 WONDERS 중 어느 WONDER에 코인을 스테이킹할지 골라야 하죠. 리워드를 어떻게 운용할 것인지, 스테이킹이 끝난 뒤 코인을 어디로 보낼 것인지 등을 결정하는 일도 이용자의 몫입니다. 때문에 WEMIX.Fi는 다양한 장치를 제공해 이용자가 마주하는 선택의 순간마다 최선의 결정을 내릴 수 있도록 돕습니다. “어떤 WONDER에 WEMIX를 맡길까?” WONDER Staking의 사용자 경험(UX)은 WEMIX를 예치할 WONDER를 정하는 것에서부터 시작합니다. 40 WONDERS는 지..

WEMIX 3.0 메인넷이 안정적 출범 이후 Phase 2에 들어서면서, WEMIX.Fi 또한 새로운 국면을 맞이했습니다. 노드 카운슬 파트너(Node Council Partner, NCP)가 더욱 적극적으로 생태계에 기여할 수 있도록, NCP 간 경쟁을 유도하는 스테이킹을 출시했죠. 한 단계 더 나아간 WEMIX 생태계에서는 어떤 변화가 생겨날까요? WEMIX.Fi의 새로운 스테이킹, WONDER Staking과 함께 알아보겠습니다. 스테이킹으로 참여하는 WEMIX 3.0 거버넌스 WONDER Staking은 이용자가 선택한 WONDER에 WEMIX를 예치해 리워드를 얻는 DeFi 상품입니다. 여기서 WONDER란, WEMIX 생태계에 안정성을 제공하고 WEMIX 커뮤니티를 대표하는 40개 NCP(40..

들어가며 운영 중인 서비스 NILE은 오픈한 이래로 NFT 출시와 DAO 출범 등 활발한 활동이 이어지고 있습니다. 사용자가 점차 늘어가면서 이에 따른 성능 개선 작업의 중요성 또한 커지게 되었습니다. NFT 상품 이미지의 경우 크기 규격이 화면에 노출되는 디자인 대비 크며, 이미지 하나당 용량이 1MB~4MB 입니다. 요청 이미지 수만 300개가 넘는 메인 페이지의 초기 로딩 시간이 상당히 소요되었습니다. 지난 1달 동안 이미지 성능 개선을 위해 수정한 내용을 소개합니다. 이미지 전략 이미지 유형에 따라 적절한 이미지 포맷을 이용하기 정적인 이미지이자 픽셀 베이스의 그래픽이나 이미지 포맷 형식 중 흔히 사용하는 것은 jpg, png입니다. 흔히 퍼블리싱 작업 시 투명한 배경 사용 여부에 따라서 jpg,..

pxd talks는 여러 분야의 연사님을 초빙해 인사이트를 나누는 시간입니다. pxd 구성원들이 더 넓은 시야로 무언가를 새롭게 발견하거나 자신을 성장시킬 수 있는 기회를 얻을 수 있도록 말이죠. 그리고 그 경험은 [pxd talks] 아티클로 기록합니다. pxd 구성원들이 함께 보고 듣고 느끼고 배운 것들이 사라지지 않고 pxd story에 남아 더 넓은 세상으로 뻗어갈 수 있기를 바랍니다. 들어가며, 지난 5월 pxd에서는 WEB3 영역의 새로운 흐름을 주제로 pxd talks를 진행하였습니다. 특히, Web3의 코어, 게임, 디파이 그리고 라이프를 주제로 이전과 달리 어떤 변화들이 일어나고 있는지 알아보았는데요. 본 글에서는 pxd talks의 강연 내용 중에서도 분산화를 통해 우리가 경험하는 정체..