I CREATE
WEB
FOR THE PERFECT
EXPERIENCE
FRONT-END
WHO
AM
I?
안녕하세요. 저의 포트폴리오 사이트에 방문해 주셔서 감사합니다.
새로운 변화가
끊임없이 일어나는 웹 환경에서 최신 트렌드에 뒤처지지 않기 위해
스터디 모임과
세미나에 참여하고 꾸준히 부족한 부분과 유행하는 기술들을 공부
하여 자기개발에
힘쓰고있습니다.
FRONT-END FRAMEWORK에 관심이 많으며 최신 JavaScript, REACT,
TypeScript를
공부중입니다. 최신기술과 크리에이티브한 아이디어로 끊임없이
소통하고 함께
고민하며 나날이 성장 하는 FRONT-END 개발자가 되기위해
노력하겠습니다.
- enthusiastic열정적인
- always Trying항상 노력하는
- ambitious큰 꿈을 가진
- faithful성실한
- positive긍정적인
LAST
PROJECTS04
WEBSTANDARD01/04
WEBSTANDARD
웹 표준 지침서를 준수하여 코딩한 웹표준
사이트 입니다. 또한 모든 사용자가 이용에
불편이 없도록 대체 텍스트로 웹 접근성을
고려하였습니다. slick을 이용한 배너와
라이트박스 생성 플러그인을 사용하여 배너와
이미지에 동적인 부분을 더했습니다.
RESPONSIVE02/04
RESPONSIVE
미디어 쿼리를 통해 다양한 사이즈의 기기에
맞게 화면이 변경되는 사이트 입니다.
슬라이드, 탭, 동영상, 마우스오버 등 동적인
효과를 주었습니다.
MEGABOX03/04
MEGABOX
메가박스 사이트입니다. 이미지 슬라이더,
탭메뉴, 모달 등 다양한 스크립트 요소를
활용하여 반응형 작업을 진행한 사이트
입니다. Swiper플러그인을 이용해서
CSS효과를 주었습니다. 크로스 브라우징은
익스플로러 8버전부터 지원합니다.
MIERO FIBER04/04
MIERO FIBER
미에로 화이바 사이트 입니다. 아코디언메뉴,
이미지 슬라이더 등 다양한 스크립트 요소를
활용하여 반응형 작업을 진행한 사이트
입니다.
ANIMATION
TAIL ANIMATION
transform: translate를 이용하여 부모는 좌우로 자식인 원은 상하로 딜레이를 가지고 움직여서 대각선으로 왕복하는 효과를 주는 애니메이션 입니다.
CUBE ANIMATION
최상위 클래스에 perspective 값을 주어 원근감을 주고 바로자식 클래스에 transform-style: preserve-3d로 입체감을 주고 그 자식 클래스인 면에 rotate와 translatez값을 주었습니다.
Sonteve
left
bottom
right
front
back
WAVE ANIMATION
내부에 10개의 원을 가진 태그를 10개 생성하여 각 태그안의 원의 transform-origin을 top left로 설정하고 점차 딜레이를 크게주어 wave 효과를 주었습니다.
BAR ANIMATION
막대에 animation으로 transform rotate와 scale값을 조절하여 회전및 크기가 증가 감소하는 효과를 주고 animation direction을 alternative 주었습니다.
CSS ANIMATION
SKILL
80%
HTML80%
CSS85%
JAVASCRIPT85%
JQUERY70%
GIT75%
PHOTOSHOP
ISAY
진심으로 하고 싶은 일을 위해 열정과 노력을 쏟아부은
것은 처음입니다.
하고 싶고 좋아하는 일인 만큼 뒤쳐지지 않기 위해 항상 즐겁게
공부하고 있습니다.
긴 시간은 아니지만 제가 익힌 것들로 회사 내에서 맡은바에
최선을 다하고
항상 노력하는 팀원이 되고 싶습니다.
CONTACT ME *
CONTACT ME *
CONTACT ME *