본문 바로가기

Programmer

(33)
Google 소셜 로그인 JavaScript 방식 변경(apIs → accounts.google.com) 기존에 사용하던 Google 소셜 로그인 방식은 `apis.google.com` 기반의 `gapi.auth2` 라이브러리를 사용하고 있었다. 하지만 해당 방식은 현재 Google에서 더 이상 권장하지 않으며, Google Identity Services(GIS) 기반의 accounts.google.com 방식으로 전환이 진행되고 있다. 이에 따라 기존 로그인 로직을 신규 방식으로 변경하는 작업을 진행했다. 이 글은 기존에 gapi.auth2 기반 Google 로그인을 사용 중인 서비스에서 deprecated 된 방식에서 Google Identity Services(GIS) 기반 방식으로 전환이 필요한 개발자를 대상으로 한다.기존 방식기존에는 다음과 같은 방식으로 Google 로그인을 처리했다.gapi.l..
사내에 정리된 게시판이 없어서 직접 만들어본 내부 게시판 회사에서 업무를 하다 보니의외로 정리된 사내 게시판이 없다는 점이 계속 불편하게 느껴졌다. 운영 관련 메모, 서버 작업 기록,나중에 다시 봐야 할 설정 방법들이메신저나 개인 메모, 아주 딥딥한 폴더들 속에 흩어져 있었다. “그거 전에 누가 정리해둔 거 없었나?”라는 말을 반복하게 되면서,아예 한곳에 모아볼 수 있는 게시판을 만들어보자고 생각했다.게시판을 만들면서 기준으로 잡은 것들처음부터 복잡한 협업 툴을 만들 생각은 없었다.카테고리별로 정리될 것제목만 봐도 어떤 내용인지 알 수 있을 것다시 찾아보기 쉬울 것그래서 화면은왼쪽에는 목차 형태의 목록,오른쪽에는 게시글 내용이 펼쳐지는 구조로 구성했다. 왼쪽 목차에서 항목을 클릭하면오른쪽 영역이 해당 게시글 페이지로 이동하면서선택한 글이 바로 펼쳐지도록 했다...
Pretendard 폰트 로딩이 느린 이유 (ttf → woff2 변경으로 해결) 웹 페이지에서 Pretendard 폰트를 사용하고 있는데 로딩이 유독 느리게 느껴진다면,폰트 파일 형식과 @font-face 설정을 먼저 의심해볼 필요가 있다. 이 글에서는 실제로Pretendard-Regular.ttf 를 사용하던 환경에서woff2 포맷으로 변경하여 폰트 로딩 속도를 개선한 방법을 정리한다.문제 상황: Pretendard 폰트 로딩 지연다음과 같이 @font-face를 설정한 상태였다.@font-face { font-family: 'Pretendard'; src: url('../fonts/Pretendard-Regular.ttf') format('woff'); font-weight: 400; font-style: normal;} 페이지 최초 로딩 시 텍스트가 늦게 표시됨Chrom..
소규모 회사에서 일정 캘린더를 직접 만들어본 이유 회사 규모가 크지 않다 보니의외로 모든 사람이 한눈에 볼 수 있는 전체 일정표가 없었다. 각자 개인 캘린더는 사용하고 있었지만,회의나 행사 일정은 메신저나 구두로 공유되는 경우가 많았고시간이 지나면 다시 확인하기가 쉽지 않았다. 그러다 보니“오늘 무슨 일정이 있었지?”“이 날짜에 뭐가 있었던 것 같은데…”같은 상황이 종종 생겼다. 이런 불편함 때문에아주 거창한 시스템이 아니라월 단위로 전체 일정을 한 번에 볼 수 있는 화면을 직접 만들어보게 되었다.화면을 만들면서 기준으로 잡은 것들처음부터 복잡한 기능을 넣을 생각은 없었다.이번 달 전체 일정이 한눈에 보일 것날짜별로 일정이 바로 확인될 것특정 날짜를 클릭하면 해당 일정만 정리해서 볼 수 있을 것그래서 화면은좌측에는 월간 달력,우측에는 선택한 날짜의 일정..