해당 글은 썸네일이 없습니다.
소개
배운 모든 것을 기록하고 정리하는 블로그입니다.
경력
이프커뮤니티 | 웹 퍼블리셔
2020.11.02 ~ 현재 (산업기능요원 2021.08.25 ~ 2024.06.25)
담당 업무
- HTML5, SCSS, JavaScript (jQuery), Gulp.js 를 이용한 웹 퍼블리싱
- 웹 표준과 접근성, 호환성을 준수한 마크업 및 시멘틱 마크업
- 소개 / 대민 페이지 또는 GIS (지리정보시스템) 페이지 퍼블리싱
학력
- 서울아이티고등학교 스마트 웹 콘텐츠과 졸업 (2021)
- 산업체 복무 완료 후 사이버대학교 컴공 진학 예정
기술
HTML5
- 시멘틱 마크업
- 웹 표준 / 접근성 / 호환성 준수 및 WAI-ARIA 활용
- meta 태그 및 Open Graph 활용
CSS3
- id 대신 class 활용
!important
는 최대한 지양- 사이즈 적용 시 고정값
(px)
대신%
,rem
등의 상대값 사용 - 컬러 값 적용 시 컬러 이름 (red,white) 대신 명확한
rgb
/hex code
를 사용 - 중복되는 코드는 css 변수로 관리 하거나 SCSS Mixin으로 관리
- 셀렉터 단순화 (셀렉터가 길어지지 않도록 작성)
- 셀렉터 선택 시 태그 이름 보단 class 이름으로 선택
:first-child
,:last-child
등의 가상 클래스 대신 class를 활용- Flex / Grid 활용
- 미디어쿼리를 이용한 반응형 구현
SCSS
- 부모 선택자 (&) 활용
- mixin, function, variable 활용
JavaScript
- getElementById, getElementsByClassName, querySelector 등의 DOM API 활용
- Event Listener 활용
- ES6 문법 (const / let, 템플릿 리터럴, 구조분해할당, Rest 파라미터, 스프레드, 화살표 함수 등)
- forEach, map, filter 등 배열 메서드 활용
- 접근성 키보드 이벤트 제어
- 로컬스토리지를 활용한 다크테마 작업
jQuery
- 노드를 찾을 수 있는 메서드 활용 (parent, parents, children, find, closest, siblings, next, prev, nextUntil, prevUntil)
- 요소를 제어하는 메서드를 활용 (append, prepend, after, before, html, text) 하여 CRUD 가능
- 요소의 속성을 제어하는 메서드 활용 (attr, removeAttr, prop, removeProp, val)
- 요소의 클래스를 제어하는 메서드 활용 (addClass, removeClass, toggleClass, hasClass)
- 요소의 순서를 제어하는 메서드 활용 (index, eq, not)
React
- useState, useEffect, useRef 등의 훅 활용
- 중복되는 코드는 커스텀 훅으로 관리
- Styled-components, react-spring, Axios, loadsh, react-responsive, Redux Toolkit 등의 라이브러리 활용
- 로컬스토리지를 활용한 기초 CRUD
Next
- 기존 리액트 프로젝트에서 SEO 이슈가 있어서 Next13 으로 마이그레이션
Vue (vue3 script setup)
- 이벤트핸들러, 라이프사이클, 라우터 활용
- computed & watch, ref & reactive 차이점 숙지
v-for
,v-if
,v-show
,props
,slot
,emit
등의 vue 문법 숙지
Astro (v4)
- 상태관리가 딱히 필요없는 정적 웹사이트 (블로그) 를 만들기 위한 도구로 활용
Gulp
- 코드를 일일이 하드코딩 하지않고, gulp로 작업물을 자동화 (공통파일 관리, scss 컴파일, css prefix, browser-sync 등)
Git
- Git으로 버전관리 및 협업
- commit, push, pull, merge, webhook 활용
Figma
- 정적 페이지 디자인
- 컴포넌트 기능 활용
프로젝트
기여도
- 최상: 단독으로 프로젝트 진행
- 상: 페이지 가이드 작업 / 레이아웃 설계 및 퍼블리싱
- 중: 페이지에서 필요한 컴포넌트 추가 작업 및 퍼블리싱
- 하: 기존 컴포넌트 가지고 페이지만 퍼블리싱
- 최하: 일부 페이지만 퍼블리싱
이프커뮤니티
펼쳐보기
SGIS 자연재해지도 서비스 / 관리자
- 프로젝트 기간 : 2023.11 ~ 2024.01 (2개월)
- 주요업무 : 서비스 및 관리자 지도 화면 퍼블리싱, 유지보수
- 기여도 : 최상
- 타입 : 반응형
- 라이브러리 : Swiper
맵픽 간편지도
- 프로젝트 기간 : 2023.10
- 주요업무 : 지도화면 퍼블리싱
- 기여도 : 최상
- 타입 : 데스크탑
- 라이브러리 : Swiper
주소정보관리시스템 (KAIS)
- 프로젝트 기간 : 2023.09
- 주요업무 : 프로젝트 세팅 / Vue 컴포넌트 작업 / 내부 관리자 페이지 퍼블리싱
- 기여도 : 상
- 타입 : 데스크탑
- 주요기술 : Vue3 (Script setup), Vite
맵픽 (Mappick)
- 프로젝트 기간 : 2023.04 ~ 2023.06 (2개월)
- 주요업무 : 스타일가이드 / 메인 / 서브페이지 퍼블리싱
- 기여도 : 최상
- 타입 : 반응형
- 라이브러리 : Swiper, Aos.js,
부산도시공사 청약센터
- 프로젝트 기간 : 2023.03 ~ 2023.04 (1개월)
- 주요업무 : 서브페이지 퍼블리싱
- 기여도 : 중
- 타입 : 데스크탑
- 라이브러리 : jquery datepicker
LX Bizland 공간정보 사업존
- 프로젝트 기간 : 2022.12 ~ 2022.02 (2개월)
- 주요업무 : 해외 사업존에 있던 컴포넌트로 페이지 퍼블리싱
- 기여도 : 상
- 타입 : 일부 반응형 (1280px 까지 대응)
- 라이브러리 : highlight.js, jquery datepicker
LX Bizland 해외 사업존
- 프로젝트 기간 : 2022.12 ~ 2022.02 (2개월)
- 주요업무 : 메인 및 서브 페이지 퍼블리싱 및 유지보수
- 기여도 : 상
- 타입 : 일부 반응형 (1280px 까지 대응)
- 라이브러리 : highlight.js, jquery datepicker
똑똑청년농부
- 프로젝트 기간 : 2022.11 ~ 2022.12 (1개월)
- 주요업무 : 서브 페이지 레이아웃 설계 및 퍼블리싱
- 기여도 : 상
- 타입 : 반응형
- 라이브러리 : Swiper
부동산공시가격산정시스템 지도 (REPIS GIS)
- 프로젝트 기간 : 2022.09 ~ 2023.02 (5개월)
- 주요업무 : 지도 화면 및 팝업 퍼블리싱, 유지보수
- 기여도 : 최상
- 타입 : 데스크탑
- 라이브러리 : jquery-ui, jquery sortable & multisortable, jquery splitter, eyecon colorpicker, realgrid 2.6.0
K-GEO 지자체활용서비스 적지분석
- 프로젝트 기간 : 2022.08 ~ 2022.10 (2개월)
- 주요업무 : 지도 화면 및 팝업 퍼블리싱, 유지보수
- 기여도 : 최상
- 타입 : 데스크탑
- 라이브러리 : jquery-ui, jquery sortable
K-GEO 지자체활용서비스 부동산정보종합조회
- 프로젝트 기간 : 2022.08 ~ 2022.10 (2개월)
- 주요업무 : 지도 화면 및 팝업 퍼블리싱, 유지보수
- 기여도 : 최상
- 타입 : 데스크탑
- 라이브러리 : jquery-ui, jquery sortable
KLIS (한국토지정보시스템)
- 프로젝트 기간 : 2022.07 ~ 2022.09 (2개월)
- 주요업무 : 내부 관리자 페이지 퍼블리싱
- 기여도 : 상
- 타입 : 데스크탑
EGIS NEWLAYER
- 프로젝트 기간 : 2022.05
- 주요업무 : 기업 소개 페이지 퍼블리싱
- 기여도 : 최상
- 타입 : 반응형
- 라이브러리 : Swiper
충청북도 도민생활 지도 서비스
- 프로젝트 기간 : 2021.12
- 주요업무 : 메인 지도 화면 퍼블리싱
- 기여도 : 최상
- 타입 : 반응형
- 라이브러리 : jquery-ui
LX 지적측량업무지원 시스템
- 프로젝트 기간 : 2021.11 ~ 2022.02 (3개월)
- 주요업무 : 내부 관리자 페이지 및 서브메인 퍼블리싱, 유지보수
- 기여도 : 상
- 타입 : 데스크탑
- 라이브러리 : jquery datepicker
이북5도위원회
- 프로젝트 기간 : 2021.12 ~ 2022.03 (4개월)
- 주요업무 : 서브페이지 퍼블리싱 및 웹 접근성 마크 획득 작업,유지보수
- 기여도 : 중
- 타입 : 반응형
가뭄지원센터
- 프로젝트 기간 : 2021.11
- 주요업무 : 메인 페이지 및 서브 페이지 각각 1개씩 퍼블리싱
- 기여도 : 최상
- 타입 : 반응형
국토교통부 공간정보 플랫폼 (K-Geo) 행정업무지원
- 프로젝트 기간 : 2021.10 ~ 2021.12 (2개월)
- 주요업무 : 내부 관리자 페이지 퍼블리싱 및 유지보수
- 기여도 : 중
- 타입 : 데스크탑
LX 국토정보 플랫폼 관리자
- 프로젝트 기간 : 2021.06 ~ 2021.11 (5개월)
- 주요업무 : 내부 관리자 페이지 퍼블리싱 및 유지보수
- 기여도 : 상
- 타입 : 데스크탑
공간정보산업협회
- 프로젝트 기간 : 2021.06 ~ 2021.07 (1개월)
- 주요업무 : 내부 게시판 페이지 퍼블리싱 및 유지보수
- 기여도 : 최하
- 타입 : 반응형
KTL 한국산업기술시험원
- 프로젝트 기간 : 2020.12 ~ 2021.04 (5개월)
- 주요업무 : 서브페이지 반복 퍼블리싱
- 기여도 : 최하
- 타입 : 반응형
개인 프로젝트
펼쳐보기
자격증
- 정보처리기능사 (2021.05 취득)
- 웹 디자인기능사 (2021.09 취득)
최근 공부하는 것들
- 동기/비동기 프로그래밍, 블로킹/논블로킹
- 자바스크립트 Promise
- 자바스크립트 Async & Await
- 자바스크립트 Prototype / Proto
- 브라우저의 동작과정
- 프론트엔드 필수 지식 (CSR, SSR, MVP, MVC, CORS 등)
- 프로그래머스 문제 풀기