
미리보기
- 직업
- Front-End Developer
- 이름
- 임민규
- 이메일
- ddj03104@gmail.com
- 간단소개
- 사용자의 불편을 해소하는 데서 서비스 개발이 시작된다고 믿습니다. 웹 프론트엔드에서의 첫인상을 책임지는 UI/UX 설계를 통해, 사용자에게 가치 있는 경험을 전달하는 개발자를 지향하고 있습니다. 팀을 위해 스스로 해야 할 일을 찾아 실행하고, 팀원과의 원활한 소통을 통해 실질적인 도움을 주었을 때 보람을 느끼며, 함께 목표를 달성했을 때 가장 큰 성취감을 느낍니다. Next.js, React 기반 교육 수료 및 프로젝트를 수행한 경험이 있습니다. 협업을 위한 역할 이해를 하기 위해서, Figma를 활용한 화면 설계 및 디자인과 Express 기반 서버 개발·배포한 경험이 있습니다.

기술 스택
- 기술 스택
- JavaScript
- HTML/CSS
- React
- TypeScript
- Express
- Next.js
- TailwindCSS
- styled-components
- zustand
- Figma
프로젝트
- 프로젝트명
- CoinBrief
- 소속/기관명
- 개인
- 프로젝트 기간
- 2025.01. - 2025.01.
- (1개월)
- 프로젝트 설명
서비스: 실시간 코인 가격 및 정보 조회 플랫폼
담당: FE, 기획, 디자인
사용 기술 :
NextJS
TypeScript
Zustand
Tailwind CSS
Firebase
Socket.io
ExpressJS
Nodemailer
ApexCharts
Figma
회원가입 과정에서 이메일로 OTP를 전송하고, 입력값 검증을 통해 본인 인증 기능을 구현
비로그인 회원의 서비스 이용 방지
=> 로그인 시 토큰을 발급하고, 토큰이 없는 경우 서비스 접근을 제한하여 비로그인 사용자의 이용을 방지회원가입 시 잘못된 입력값 방지
=>useForm
을 활용해 유효성 검사 및 에러 핸들링을 구현하여 잘못된 입력을 사전 차단Socket.io를 이용하여 업비트 웹소켓을 연동하여, 사용자가 지정한 코인의 실시간 가격을 확인할 수 있는 기능을 구현
Vercel 배포 시, 서버리스 함수의 한계로 인해 WebSocket 연결 유지 불가
=> ExpressJS를 사용해 WebSocket 서버를 별도로 구현하고, 독립적으로 배포하여 실시간 통신 문제를 해결업비트 API를 활용해 코인 정보를 가져오고, 가격 변화율을 차트로 시각화하여 제공
업비트 코인 리스트 API를 이용해 필터링할 경우, 자동완성 드롭다운 메뉴의 응답 속도가 느림
=> 코인 이름과 심볼을 DB에 미리 저장하고 매핑하여 검색 속도 개선
프로젝트 요약
실시간 코인 시세 조회 및 환율 변환 기능을 제공하는 웹 애플리케이션으로, 웹소켓과 Upbit API를 활용하여 실시간 데이터를 반영하고 ApexChart를 통해 시각적으로 분석할 수 있도록 구현하였습니다.
구현 내용
회원 가입/ 로그인
실시간 코인 가격
코인 리스트 및 상세 정보
- 프로젝트명
- Aight Now
- 소속/기관명
- 스나이퍼 팩토리
- 프로젝트 기간
- 2024.06. - 2024.08.
- (3개월)
- 프로젝트 설명
서비스: AI기반 주식분석플랫폼
담당: 로그인/회원가입, 뉴스 기사 번역, 본인 인증
사용 기술 :
NextJS
TypeScript
Zustand
Tailwind CSS
Firebase
Tavily
DeepL
회원가입 시, 이메일로 본인 인증 링크(리다이렉트 URL)를 발송하여 인증 절차를 구현
Firebase는 이메일 인증 시 하나의 리다이렉트 페이지만 설정 가능하여, 회원가입과 비밀번호 찾기 등 각각의 본인 인증에 대응하기 어려웠음
=> param 값을 기반으로 목적에 따라 분기되는 공통 redirect 페이지를 제작하여, 각각의 인증 서비스에 대응사용자가 원하는 언어로 기사 번역 기능 구현
다국어 지원을 위해 HTML 내 텍스트를 정확히 분리하고 번역 처리하는 로직 필요
=>JSdom으로 태그 내 텍스트만 추출하여 번역 후, 번역된 문자를 적용한 HTML을 반환하는 기능 구현Firebase setPersistence메소드를 이용한 자동 로그인 구현
프로젝트 요약
* Tavily AI와 배포 기간이 만료되어 현재 배포 페이지를 운영중이지 않습니다.
"스나이퍼 팩토리 - 프로젝트 캠프:Next.js" 라는 Next.js 교육 프로그램을 통해 제작하였습니다. "스팩 스페이스" 라는 기업을 통해 "AI기반 주식분석플랫폼" 이라는 과제를 받고 6개의 기업 주식을, AI를 통해 분석하고 보여주는, 기업 분석 리포트 사이트를 제작하였습니다.
구현 내용
회원 가입/ 로그인
뉴스 기사 번역
자동 로그인
- 프로젝트명
- My_Todo_Calender
- 소속/기관명
- 개인
- 프로젝트 기간
- 2024.02. - 2024.03.
- (2개월)
- 프로젝트 설명
서비스: 시간·월별로 관리하는 Todo 리스트
담당: FE, 기획, 디자인
사용 기술 :
ReactJS
TypeScript
Redux-Toolkit
styled-components
MongoDB
ExpressJS
Figma
React, Express, MongoDB를 이용한 일정 CRUD
Redux-Toolkit을 이용하여 태그 별로 일정 필터링 기능 추가
=> 원하는 태그들을 선택하여 태그에 속한 일정만 확인 가능대체 공휴일 제도로 인해 단순 공휴일 날짜 지정 방식으로는 공휴일 처리가 정확하지 않음
=> 공공데이터포털의 공휴일 OPEN API를 이용하여 대체공휴일 및 공휴일 지정한 태그의 모든 일정이 삭제되었을 때, 태그가 아직 남는 버그 현상
=> 태그 자체에 일정 count 객체를 추가하여 count가 0이 되면 자동 태그 삭제
프로젝트 요약
일정과 태그를 생성·관리하고, 검색 기능을 통해 원하는 일정을 쉽게 찾을 수 있도록 했으며, 시간/월 단위로 일정을 시각화하여 직관적인 관리가 가능하도록 구현했습니다.
구현 내용
일정 및 태그 관리
공휴일 처리
일정 및 태그 검색 기능
포트폴리오
교육
- 소속/기관
- 스나이퍼팩토리
- 종류 | 전공명/전공계열
- 사설 교육 | 프로젝트 캠프: Next.js
- 재학 기간 (재학 상태)
- 2024.06. - 2024.08. (수료)
- 소속/기관
- 코드스테이츠
- 종류 | 전공명/전공계열
- 사설 교육 | 프론트엔드 과정 (React)
- 재학 기간 (재학 상태)
- 2022.12. - 2023.05. (수료)
- 소속/기관
- 한남대학교
- 종류 | 전공명/전공계열
- 대학교(학사) | 컴퓨터통신무인기술학과
- 재학 기간 (재학 상태)
- 2015.03. - 2022.08. (졸업)