[멋사12기] HTML, CSS | 1주차 세션 및 과제 제출

1주차 세션

 

 

아기사자가 된 후,

본격적으로 1주차 세션이 진행됐다.

 

 

HTML, CSS에 대해 배웠고, vscode와 github를 연결해 코드를 작성했다.

 

 

HTML과 CSS를 연습하기 위해 간단한 자기소개 페이지를 만드는 실습도 진행했다.

나는 display:flex, justify-content:space-between, list, align-items 등을 이용해 자기 소개 페이지를 구성했다.

 

 

결과물 사진을 첨부하겠다.

코드는 생각보다 길어서 깃허브를 참고하는 것이 더 좋을 것 같다.

자기소개 페이지

 

 

---

 

 

다음으로 자바스크립트에 대해서도 짧게 배울 수 있었다.

변수를 설정하고, 배열을 설정하고, 값을 콘솔창에 출력해보는 연습을 할 수 있었다.

 

 

마지막으로 조건문 if, switch문까지 배웠다.

 

 

세션이 끝난 후 1주차 과제로 자기소개 페이지를 꾸며보는 것과 주어진 레이아웃을 구성하는 것이 주어졌다.

 

 

과제를 진행하면서 느꼈던 것은 생각보다 구조를 구성하기가 쉽지않았다는 점이었다.

좀더 코드를 간단하고 효율적으로 구성하고 싶었고, 시맨틱 태그도 이용하고 싶었으나, css가 생각처럼 잘 적용되지 않아 일단 div로 구성했고, css도 세세하게 적용할 수 밖에 없었다.

 

 

이후에 시맨틱태그와 비율 css를 적용해서 좀 더 효율적인 코드를 작성해보려 한다.

레이아웃을 구성할 때 큰 요소부터 그룹을 구별하는 습관도 길러보려 한다.

 

 

코드는 깃허브를 참고하는 것이 좋겠고, 결과물은 올려두도록 하겠다.

 

자기소개 페이지 꾸미기 과제

 

 

레이아웃 구성 과제

 

 

 

 

멋쟁이 사자처럼 12기 활동 코드를 올리는 깃허브 주소 링크를 올리고 글을 마치도록 하겠다.
https://github.com/BB545/likelion

 

 

728x90