HA젠옹의 프리랜서의 일상

예전과 달라진 구글 앱 출시 관련하여 출시 방법이 변경이 되어 어떤 식으로 변경이 되었는지 가져왔습니다. 우선, 이전에는 구글과 애플 앱 등록 자체에서 애플 심사가 매우 까다롭다 보니 구글만 등록하시는 사람들이 많았습니다.당연하게도 애플과 달리 구글은 복잡한 심사도 없으며, 누구든지 자신만의 어플리케이션만 존재하였다면 쉽고 빠르게 앱을 등록할 수 있었기 때문이죠. 하지만, 구글 또한 이제 애플처럼 다양한 방법으로 앱 출시 관련하여 심사 정책들이 하나 둘씩 생기고 있습니다. 특히 작년 11월부터 새로 생긴 Play 정책으로 앱 정식 출시전 비공개 테스트 (베타 테스트) 14일을 완료해야 프로덕션 (정식 출시)이 가능해졌습니다. 이제 구글 또한 이전만큼 결코 누구나 앱을 등록할 수 있게 된 것은 아니게 되었..

이번에 지인한테 소개 받은 라이브러리 중 JWT 관련하여 유용한 패키지 라이브러리가 있다고 하여 알아보았습니다. 사용자 인증과 세션 관리를 위해 JSON Web Tokens(JWT)가 널리 사용되고 있습니다. JWT는 사용자의 인증 정보를 안전하게 전송하고 저장할 수 있는 방법을 제공합니다. 그러나 JWT는 Base64로 인코딩되어 있어, 그 내용을 이해하려면 디코딩 과정이 필요합니다. 이때 유용한 라이브러리가 바로 jwt-decode입니다. 이번 글에서는 jwt-decode 라이브러리에 대해 자세히 알아보고, 실제로 어떻게 사용하는지, 그리고 그 장단점에 대해 살펴보겠습니다.jwt-decode 라이브러리란 무엇인가?jwt-decode는 JWT를 디코딩하여 그 안에 담긴 정보를 쉽게 추출할 수 있게 해주..

최근 웹 개발에서 보안이 중요한 이슈로 대두되면서, 많은 개발자들이 JWT(Json Web Token)를 활용하여 클라이언트와 서버 간의 안전한 인증을 구현하고 있습니다. 그런데 여기서 흥미로운 점은, 개발자들이 JWT 토큰을 클라이언트에 전달할 때 responsebody가 아닌 responseheader를 통해 전달한다는 것입니다. 왜 그런 걸까요?1. 보안 향상CSRF 보호JWT를 responsebody로 전달하면, 클라이언트는 이를 로컬 스토리지나 세션 스토리지에 저장하게 됩니다. 그러나 이러한 저장 방식은 CSRF(Cross-Site Request Forgery) 공격에 취약할 수 있습니다. JWT를 responseheader로 전달하면 클라이언트는 이를 쿠키에 저장할 수 있고, 쿠키에 SameS..

소개GPT-4o의 출시는 AI 언어 모델 개발에 중요한 이정표를 세웠습니다. 이전 제품의 성공을 바탕으로 GPT-4o는 다양한 애플리케이션에서 유용성, 성능 및 적응성을 향상시키는 새로운 기능과 개선 사항을 도입했습니다. GPT-4o를 독특하게 만드는 요소를 살펴보고 새로운 기능, 개선 사항 및 잠재적인 단점을 한번 알아볼까 합니다.GPT-4o의 주요 특징향상된 상황별 이해확장된 토큰 한도: GPT-4o는 토큰 한도가 100,000개로 증가하여 상당히 긴 텍스트를 처리하고 생성할 수 있습니다. 이는 토큰 제한이 32,768개였던 GPT-4에 비해 크게 개선된 것입니다. 이 향상된 기능을 통해 특히 복잡하고 긴 대화에서 더욱 포괄적이고 일관된 응답이 가능해졌습니다.향상된 컨텍스트 유지: 오랜 상호 작용에 ..

친구들이랑 디스코드를 할 때마다 노트북 자체 마이크를 사용하다보니 듣기 거북하다고 하여 이번에 마이크를 구매하였습니다.  사실상 제일 저렴한 다이소 마이크도 고민을 해봤는데요.그래도 한번 구매하는거 다이소 마이크 보단 조금이라도 성능 괜찮은걸 사보자는 마음에 검색을 하다보니조이트론 마이크에 대해 알게 되어 이번에 구매하게 되었습니다.가성비 좋은 조이트론의 마이크조이트론 GM35U이라는 콘덴서형 핀마이크인데 가격 대비 성능이 좋다고 하며, 각종 리뷰 영상을 보니 나쁘지 않다고 하여 선택을 하게 되었는데요. 제품 구성품으로는 본체랑 윈드실드, 설명서 들어있어요.생각보다 무게감도 가벼운 편이며, 사이즈도 크지도 않아 배치하는 부분에서도 나쁘지 않더라고요.간편한 설치 및 사용 방법설치 및 사용 방법도 매우 간단..

Ajax를 활용하여 데이터를 가져올 때 흔히 사용하는 방법은 res를 호출하여 responseBody 값을 가져와서 사용을 합니다.하지만 보안을 위해 jwt 토큰 경우 responseBody가 아닌 responseHeader에 담아서 전달하는 경우가 많은데 저도 주 포지션이 백엔드가 아닌 프론트 개발자라 언제나 백엔드분께서 전달해주는 방법에 따라 작업을 진행하여 Header로 전달받은 적은 이번이 처음이라 해당 글을 작성하게 되었네요. AJAX 응답 이해하기비동기 JavaScript 및 XML의 약어인 AJAX를 사용하면 웹 페이지가 전체 페이지를 다시 로드하지 않고도 서버와 통신할 수 있습니다. 이 기능은 원활하고 역동적인 사용자 경험을 만드는 데 기초가 될 수 있죠. 그러나 실제 문제는 서버에서 반환..

협업의 중요성은 역시 팀워크와 커뮤니케이션이 아닐까 싶었는데... 이 또한 결국 실력이 뒷받쳐줘야 가능하지 않나 요즘 생각이 들고 있네요. 저 또한 실력이 뛰어난 편이 아니라 협업자가 진행하는 방식에 대해 뭐라 할 수 없는 부분이라 불편함을 겪고 있는데이럴 경우 느끼는 부분이 새로운 도전을 할 경우 해당 부분에 대한 지식을 나 또한 공부를 해야하는구나 라고 느끼고 있습니다. 전혀 모르니 그저 상대방을 믿고 기다릴 수 밖에 없다는 자신을 돌아보며 한탄만 하는 신세가 되고이미 진행 중인 프로젝트는 현재로써 포기한 상태로 추후 포트폴리오로 사용해야겠다 생각하고무기간 연장으로 봐야할 것 같아요... 또 한번 자신을 돌아보는 계기가 되어 좋은 경험이였습니다.

CORS는 웹 페이지에서 문서가 생성된 도메인과 다른 도메인의 리소스에 대한 액세스를 제어하기 위해 웹 브라우저에서 구현하는 보안 메커니즘입니다. CORS의 목적은 브라우저가 서버에서 명시적으로 허용하지 않는 한 웹 애플리케이션이 도메인 간 요청을 수행하지 못하도록 제한하는 정책을 시행하여 CSRF(교차 사이트 요청 위조) 및 데이터 도난과 같은 공격으로부터 사용자 데이터를 보호하는 것입니다.CORS 작동 방식CORS는 브라우저와 서버 간의 HTTP 헤더 교환을 통해 작동합니다. 단계별 프로세스는 다음과 같습니다.1. 브라우저가 교차 출처 요청을 합니다 브라우저에서 실행 중인 JavaScript가 원본 도메인과 다른 도메인에 요청을 시도하는 경우(예: API 리소스를 가져오는 경우) 브라우저는 요청에 '..

웹 디자인의 역동적인 세계에서 부드러운 스크롤링은 단순한 기능 그 이상입니다. 이는 사용자 경험을 향상시키는 대화형 미학의 필수적인 부분입니다. 스크롤 애니메이션은 사용자에게 콘텐츠를 쉽고 스타일 있게 안내하는데 도움이 됩니다. 스크롤 애니메이션의 개념, jQuery를 사용하여 효과적으로 구현하는 방법, 성능과 접근성을 최적화하기 위한 몇 가지 모범 사례에 대해 이야기를 해보겠습니다. 스크롤 애니메이션이 중요한 이유스크롤 애니메이션은 웹사이트 탐색을 직관적일 뿐만 아니라 매력적으로 만듭니다. 웹페이지 섹션 간 전환에 애니메이션을 적용하면 무언가 변경되고 있다는 시각적 신호를 제공하여 사용자의 관심을 유지하고 콘텐츠 간 갑작스러운 이동을 줄이는 데 도움이 될 수 있습니다. 스크롤 애니메이션의 기본스크롤 애..

비동기 프로그래밍이란 무엇인가? 비동기 프로그래밍은 애플리케이션 내에서 비차단 작업을 용이하게 하는 방법이며, 작업이 차례로 완료되는 동기 또는 순차 프로그래밍과 달리 비동기 프로그래밍을 사용하면 작업이 기본 애플리케이션 스레드와 별도로 실행될 수 있습니다. 이는 프로그램이 시간이 많이 걸리는 작업을 시작하고 작업이 완료될 때까지 기다리지 않고 다른 작업을 계속 실행할 수 있게 합니다. 비동기 프로그래밍을 배워야 하는 이유? 효율성 및 성능 비동기 프로그래밍을 사용하면 여러 작업을 동시에 처리할 수 있으며, 이는 작업을 완료하는 데 시간이 걸리고 그렇지 않으면 다른 작업의 실행을 차단하는 I/O 바인딩 및 네트워크 바인딩 애플리케이션에 특히 유용합니다. 확장성 비동기식으로 설계된 애플리케이션은 더 적은 ..