wecode 사전스터디 1주차(7/13) 로그

위코드 개강(8/17) D-33

 

1. 배운 것/개발한 것

1) 위코드 사전스터디(프론트엔드)를 위한 자기소개 웹페이지 제작https://youngkwon315.github.io/wecode_prestudy_week1/

사전스터디1_권영빈과제

2) 웹사이트 header의 상단 고정 : position = fixed

• 모든 html 태그들은 초기에는 static 상태로, 차례대로 왼쪽에서 오른쪽, 위에서 아래로 쌓인다. 
• position을 relative로 설정했을 경우 static 상태에서 태그의 위치를 기준으로 새로운 포지션을 설정한다.
• position을 absolute로 설정했을 경우 태그의 원래 위치와 상관없이 새로운 포지션을 설정한다. (가장 가까운 상위요소의 위치에 의해 포지션이 결정난다.)
• position을 fixed로 설정하여 화면이 바뀌더라도 태그의 고유한 위치를 설정할 수 있다.

3) 태그의 transform css (참조 : https://developer.mozilla.org/en-US/docs/Web/CSS/transform)

해당 태그의 상태를 변경할 수 있다. (scale : 요소 확대, rotate : 요소 회전 등)

위 css를 이용하여 페이지 내 이미지들에 마우스 오버했을 경우 크기가 커지게 설정하였다. (transform : scale(1.1))

 

4) github-pages를 통한 웹사이트 deploy (참조 : https://opentutorials.org/course/3084/18891)

신규 repository 생성 -> 파일 업로드 -> repository settings에서 github-pages : master branch로 설정하기

2. 개발할 것

 1) 노마드코더 JS 강의 재수강

 2) codewars javascript 문제 풀기

 3) freecodecamp 'applied accesibility' 강의 시작

 

3. 회고

자기소개 페이지를 처음부터 만들어보면서, 알고 있다고 생각했던 html, css 태그들에 대해 사실은 잘 알고 있지 못하다는걸 알게되었다. 개념을 아는 것과 그것을 실제 페이지에 적용하는 것은 다르다는 것을 다시 한번 느꼈고, 그동안 들었던 강의에서 배운 개념들을 사전 스터디 기간 동안 자기소개 페이지에 적용하면서 테스트해봐겠다고 느꼈다.