Community

개발자 99% 커뮤니티에서 수다 떨어요!

← Go back
[프론트엔드]svelte로 만들어본 포트폴리오 사이트
#portfolio
3년 전
10,442
8

URL: https://www.devground.co.kr/dist/ 

undefined

undefined

undefined

자기소개:

안녕하세요 프론트개발자로 일하고있는 개발자입니다. 노마드코더를 즐겨보면서 많이 배우고 있습니다. 포폴 정리하다가 우연히 이번 이벤트를 발견하고 급하게 마무리를 해서 올려봅니다.

서비스소개:

우주에 있는 개발자의 놀이공간?(dev + playground = devground) 를 표현하고 싶었습니다. 급하게 만들어서 최적화에 신경을 거의 못써서 사양에 따라 버벅거릴수 있을듯하네요

개발과정:

평소 토이 프로젝트에 즐겨사용하는 svelte로 만들어 봤으며 평소 좋아하는 메터리얼 디자인을 적용하기 위해 svelte Materialify를 사용해서 UI를 구성했습니다.

우주를 표현하는데는 pixijs를 이용했습니다. 개인적으로 스타워즈를 좋아해서 인트로에서 버튼을 눌러 진입할때 하이퍼스페이스 효과를 넣어봤습니다.

카테고리는 STATUS / CODE STYLE / PROJECTS 3가지로 심플하게 구성했습니다.

STATUS 항목은 프로젝트에 사용했던 스킬들, 현재 공부하고 있는 스킬들을 그래프로 표현했습니다.

CODE STYLE 항목은 ToDo List를 ES6로 만들어보는 과정을 개발환경 세팅부터 코딩, 실행까지 정리한 페이지입니다.

PROJECTS 항목은 회사 프로젝트 및 토이프로젝트를 간단하게 소개하는 페이지입니다.

앞으로 계획:

devground.co.kr를 포폴사이트로만 사용하는걸 넘어서서 개인 블로그 혹은 다양한 실험 등을 할 수 있는 공간으로 만들어 볼 계획입니다.

감사합니다.

8 comments