1. 사용언어
HTML, CSS, JavaScript
HTML : 웹사이트 형식 구성 (뼈대 담당)
CSS : to-do list 디자인 담당 (미모 담당)
JavaScript : 작동 기능 담당 (내용물 담당)
2. 웹사이트 기능요약
스파르타코딩클럽에서 '설 맞이 덕담 공유 코딩 패키지'를 일정기간동안 무료로 수강하는 이벤트를 진행했다.
사실, 이건 프로젝트라기보다는 강의후기에 가깝다.
그래서 글의 관점이 다르다.
스파르타코딩클럽의 코드스니펫 기능으로 웹사이트의 핵심기능인 js는 강사진이 미리 작성한 외부자바스크립트를 이용한다.
강의 자체도 1시간 분량이라 강의종료 후에 웹사이트 하나를 얻는 것에 초점이 맞춰져있다.
결국 외부 도움이 8할이지만, 하나의 웹사이트를 만들어본 경험이 재미있었고 나중에는 직접 완성해보고 싶어서 기록한다.
이곳 강의가 궁금해서 한 번 신청해봤는데, 결과물이 너무 귀여워서 업로드한다.
이 웹사이트는 생각보다 엄청 간단해서 CSS가 인라인, 내부스타일시트 방식으로 작성됐다.
1) 주요 기능
ㆍ소원을 입력하면 바구니 영역에 랜덤으로 아이콘이 추가된다.
ㆍ아이콘 종류와 위치, 크기는 랜덤이다.
ㆍ덕담은 5글자 이상 입력해야한다.
ㆍ5글자 미만 입력시 "5글자 이상 입력하세요!"라는 경고창이 생성된다.
ㆍ아이콘 5개 이상부터는 랜덤으로 호랑이 이미지가 바뀐다.
3. 시연
HI.J님의 소원 듣는 호랑이
소원 한 가지 적고 가세요!
deokdam.spartacodingclub.kr
아마도 서버는 이벤트 기간동안만 유지될 것 같다. 그래서 웹페이지 작동 모습도 함께 첨부했다.
한가지 아쉬운점은 이 패키지의 js가 덕담공유로 설정되어있어서 입력창 안내문구가 "덕담을 입력하세요."다. html을 소봐도 js 파일이 없어서 수정이 불가했다. 더 공부해서 다음에는 이런 종류의 사이트를 혼자 만들어보면 재미있을 것 같다.
'프로젝트 > 완료' 카테고리의 다른 글
타이핑 게임 웹사이트 만들기 (0) | 2022.02.06 |
---|---|
To-Do List 웹사이트 만들기 (0) | 2022.01.31 |