레거시 PHP환경에 react 점진적 적용 개발 환경: React + Typescript, PHP - 점진적인 react 적용을 위해 현행 PHP의 안에서 빌드된 결과를 include하게 구성 - vite로 빌드된 파일을 PHP파일에서 include한 파일을 만들고, 심볼릭 링크와 react-route-dom을 조합하여 구성 호텔 상품 추가 신규 프로젝트 개발 환경: Next.js + Typescript - 민박/트립만 판매 하였으나, 호텔 상품도 같이 판매하게 됨으로써 신규 페이지 개발 - 호텔과 관련된 신규 API에 대한 연동 - 호텔 페이지들은 액세스 토큰으로 세션을 관리 하나, 레거시 PHP 환경간의 로그인 세션 유지를 위해 PHPSESSIONID를 리프레쉬 토큰의 용도로 사용하여 관리 - 민박/트립의 KCP 모듈 방식의 OS의 의존성이 생기는 낡은 모듈 방식 대신 API방식으로 변경한 결제 페이지 개발 숙소/트립 제공자 <-> 일반 사용자 간 채팅 서비스 추가 개발 환경: Typescript - klat 솔루션 사용. 솔루션에서 제공하는 JS SDK 래핑 하여 사내 API에 보내는 로직을 넣은 내용을 npm package로 관리 - 채팅 서비스에 대한 퍼블리싱, 해당 npm package를 통해 로직 구현

更多

개발 환경 개선 개발 환경: React + S3 정적 웹 호스팅 - main브랜치만 사용하고 있는 환경을 개선하기 위해 git-flow 도입 - Github Actions를 이용하여 S3 정적 웹사이트 호스팅이 적용된 S3에 배포 CI/CD 구축 - TypeScript, styled-component 점진적 도입 PHP 환경 회사 소개 홈페이지 i18n 개선 개발 환경: PHP - 사내 내부 어드민 페이지에서 번역자가 직접 추가하는 기존 방식이 불편하여 개선 제안 - 번역자는 Google Sheets에서 번역 작업-≫Google Sheets API 이용하여 가져온 데이터와 DB에 있는 번역 데이터 비교하여 추가/수정되는 데이터 표시하는 페이지 개발-≫해당 페이지에서 번역자가 확인/반영할 수 있게 개발 React 환경 광고주/대행사 페이지 i18n 개선 개발 환경: React, Node.js - json파일에 번역 내용을 개발자가 일일이 입력해야 하는 방식이었기 때문에 개선 제안 - Google Sheets API 통하여 가져온 데이터로 json 파일 생성하는 스크립트 Node.js로 작성 - CI/CD 파이프라인에 해당 스크립트 workflow 추가하여 배포 시 생성되게 추가

更多

자사 공구 쇼핑몰 고도화 개발 환경: Next.js + TypeScript API request에 대한 개선 - 많은 양의 중복 request로 인한 문제가 있었고, 기획 측의 스크롤 위치 복구에 대한 요청이 강하게 있었기 때문에 이를 해소하고자 SWR 도입 - 전체 페이지에서 필요한 백 오피스에 대한 정보를 가져오는 API는 context API를 이용하여 공유 - 코드 관리를 용이하게 하기 위해 중복되는 request 코드에 대해 custom hooks로 분리 * 중복 API개선으로 인하여 Time to Interactive 시간 단축 CSS module 도입 - 스타일링 작업 시 복잡하고 방대한 양으로 인하여 개선하고자 도입 - 스타일링 작업은 주로 사내의 퍼블리셔가 맡고 있었으므로, 퍼블리셔 입장에서 어떤 기술이 편할지 상의하여 기존 프로젝트 방식과 가장 유사하게 사용 가능한 CSS module을 선택

更多

인플루언서 마케팅 플랫폼 개발 개발 환경: Vue.js + TypeScript(front), PHP(backend) 초기 프로젝트 설정 - eslint및 prettier를 설정하여 포맷을 맞추고, git hook pre-commit 으로 강제하여 통일된 환경 설정 로그인 페이지 개발 - 제플린 참고하여 퍼블리싱 - backend단에서 JWT를 가진 httponly, secure 쿠키 발급 개발 젠틀몬스터 스토어 개발 개발 환경: PHP(CodeIgniter) 로컬 개발 환경 docker로 구성 - 인력이 자주 변경되는 환경에서 개발 환경에 대한 정확한 매뉴얼이 없고, VM에 프로젝트에 사용하는 기술 스택의 설치 및 설정을 처음부터 전부 하는 시간소비가 큰 방식으로 구성되어 있어 이를 개선 및 개발환경 통일을 위해 개발 * 개발환경의 통일로 인해 개발자간의 이슈 재현이 쉬워지고, 신규 입사자에 대한 개발 환경 설정에 대한 인수인계 소비 시간 감소 주문 페이지 개발 - 주문 페이지 결제모듈(iamport) 연동 - 첫 주문 회원에 대하여 본인인증 모듈(NICE)연동 - 결제 시 백 오피스 API를 통해 연동

更多

상품 광고를 위한 상품 수집 스크립트 개발 환경: JavaScript 구글 제품 feed csv 생성 - 사용자의 쇼핑몰에 스크립트를 삽입하여 사용자가 상품 상세 페이지로 들어왔을 때 상품 정보 수집, 쌓은 정보를 통해 구글 제품 feed csv 생성 * 사용자가 상품을 직접 올리지 않아도 자동으로 feed에 올라가 상품 광고 가능한 편의성 제공

更多