FrontEnd Developer 💻

안녕하세요! 1년차 프론트엔드 개발자 나덕경입니다.

개발자는 개발을 구현해내는 것 뿐만이 아니라, 비즈니스 가치를 만드는 것이 중요하다고 생각합니다. 좋은 코드를 만드는 것을 중요시 여기며, 새로 알게 된 내용을 공유하는 것을 좋아합니다.

🧑🏻‍💻 Work Experience

엘알에이치알

누적 사용자 15만명 이상의 Pre-A 투자 유치 명품 수선 중계 플랫폼 fapis 서비스 스타트업

Frontend Developer 인턴

2022.08. 22 ~ 11. 22

fapis 페이지 유지보수 및 기능구현

도구 및 기술: React, Typescript, Next 12, Context-API, Tanstack-query, Styled-components [https://fapis.io]
1. 유저 페이지와 사장님 페이지 Javascript Typescript 마이그레이션
2. 사이트 맵 개발을 통한 SEO 최적화
  
  사이트 맵을 통해서 SEO 컨텐츠 키워드를 구글에 검색했을 때 최상단에 뜨도록 했습니다.
3. 사용자 편의성 증가
  
  사용자의 웹사이트 경험 개선을 목표로 레이아웃 쉬프트 최소화 및 로딩 스피너 구현을 통한 로딩 경험 개선 작업을 수행했습니다.
4. 아토믹 디자인 패턴 적용
  
  Styled-Components를 사용하여 컴포넌트의 스타일링을 캡슐화함으로써 스타일의 일관성을 유지했고 재사용성을 높여 개발속도 상승 및 불필요한 코드를 줄였습니다.
5. React-Native 웹 뷰 라우팅 작업
  
  React Navigation과 웹 뷰의 postMessage 및 onMessage 통신 기능을 결합하여, 웹 컨텐츠와 네이티브 앱 간에 원활한 내비게이션 상태 정보를 교환할 수 있는 시스템을 구축했습니다.
  
  웹 뷰 내부에서 발생하는 페이지 이동 이벤트를 감지하여 React Navigation 스택에 이력을 저장하고, 네이티브 뒤로 가기 액션에 반응하여 적절한 웹 페이지로 라우팅할 수 있도록 로직을 설계했습니다.
  
  사용자가 웹 뷰 내에서 뒤로 가기 버튼을 누를 때, JavaScript를 통해 현재 웹 뷰의 내비게이션 스택을 확인하고, 필요한 경우 네이티브 앱 레벨로 이벤트를 전파하여 네이티브 뒤로 가기 동작을 트리거했습니다.
6. Jenkins, GitHub Actions, 및 AWS를 활용한 CI/CD 파이프 라인 구축
  
  Jenkins와 GitHub Actions를 결합하여 AWS 환경에서의 자동화된 CI/CD 파이프라인을 구축하고 관리했습니다. 이를 통해 개발 및 프로덕션 서버의 배포 프로세스를 자동화했습니다.
  
  GitHub의 develop와 main 브랜치에 코드가 푸시될 때마다 Jenkins를 통해 자동 빌드 및 테스트를 실행하고, 성공적으로 완료되면 개발 서버와 프로덕션 서버에 각각 자동으로 배포되도록 GitHub Actions와 AWS 서비스를 활용했습니다.
  
  이를 통해 실시간으로 코드 변경 사항을 개발 서버에 반영할 수 있게 되었으며, 프로덕션 배포 프로세스의 신뢰성과 효율성이 크게 향상되었습니다. 배포 시간이 기존 대비 약 *30% 단축되었고, 배포 관련 오류는 약 *40% 감소했습니다.
사내 SEO 최적화 CMS 개발 및 배포

도구 및 기술: React, Javascript, axios,Styled-components, react-quill

이전에는 마케팅 팀이 생성한 SEO 컨텐츠를 개발 팀이 수동으로 md파일로 변환하여 사이트에 반영하는 번거로운 프로세스를 따랐습니다. 이 접근 방식은 시간 소모적이며, 실시간 컨텐츠 업데이트에 제한이 많았습니다.

마케팅 팀이 직접 SEO 컨텐츠를 생성, 수정, 삭제할 수 있는 CMS를 개발하여 내부 프로세스를 자동화하고 효율성을 극대화했습니다.

SEO 최적화를 위해 컨텐츠에 메타 태그, JSON-LD 등을 쉽게 추가할 수 있는 기능을 구현했습니다. 이를 통해 구글 검색 엔진 최적화(SEO)에 중요한 메타데이터 관리가 간소화되었습니다.

Google Lighthouse를 이용하여 사이트의 SEO 점수를 모니터링하고, 기술적 SEO 문제를 식별 및 해결하여 최종적으로 74점에서 93점으로 SEO 점수를 향상시켰습니다.

CMS 도입으로 마케팅 팀은 컨텐츠 업데이트를 실시간으로 자체적으로 수행할 수 있게 되었으며, 이는 컨텐츠 배포 시간을 기존 대비 80% 단축시켰습니다. 또한, SEO 최적화를 통해 웹사이트의 가시성과 트래픽이 향상되었습니다.

원펫

반려동물 영양제 커머스 케어펫과 펫 바이오 시장 "투트랙 비즈니스"를 펼치고 있는 원펫