본문 바로가기

우아한테크코스/레벨 회고

우아한테크코스 3/4 메타인지 말하기 활동

브라운이 주도하는 메타인지 말하기 활동이 오늘 처음 시작했다.

매 미션이 완료되는 주의 월요일에 활동을 진행하는데 미션을 하면서 배운 점에 대해서 생각을 정리해서 말하는 것이 주 목적이다.

 

메타인지 활동에 적혀있는 목적은 이렇게

  • 내가 알고 있는 지식을 상대방에게 이야기 하면서 내가 잘 알고 있었던게 맞는지 확인(메타인지)
  • 상대방에게 전달하는 과정에서 제대로 전달되었는지에 대해 피드백을 받기 위함
  • 내가 보는 나와 남이 보는 나의 차이에 대해서 인지하기

페어는 랜덤으로 정해지는데 E인 나로써는 새로운 사람들과 얘기할 수 있다는 것이 일단 좋다ㅋㅋㅋ

시간은 돌아가면서 2분 30초 말하고, 질문 5분의 시간을 갖는다.

 

메타인지 말하기 활동에서 주고받은 내용

이번에 낙타와 페어가 되었고 주로 로또 미션에서 배운 점을 주고 받았다.

우선 내가 먼저 말하기를 했는데 크게 3가지를 중점으로 이야기했다.

 

1. ux 증대를 통한 사용자 편의 증가

2. 시멘틱 태그 이용으로 ux와 dx증가 (개발자의 코드 가독성)

3. rem 초기 셋팅 꿀팁

 

1. ux 증대를 통한 사용자 편의 증가

개발자가 수고로우면 사용자가 편하고 개발자가 편하면 사용자가 수고스럽다라는 우테코 벽의 말처럼 코드가 복잡하고 보기 좋지 않더라도 ux를 챙기는 방향이 좋다는 것을 배웠습니다. 보기 좋지 않다면 함수로 분리해서 가독성을 챙기는 방법도 좋다고 배웠습니다.

 

2. 시멘틱 태그 이용으로 ux와 dx증가 (개발자의 코드 가독성)

시멘틱 태그를 잘 사용하면 웹 페이지의 접근성이 향상된다고 합니다! 검색 엔진 최적화(SEO)에도 긍정적인 영향을 미친다고 하더라구요. 
또한, 코드의 가독성이 높아져 다른 개발자가 코드를 이해하기 쉬워집니다. html 코드만 보더라도 내가 이 구역은 어떤 의미로 구성을 했는지 div로 보여준다면 이해가 잘 안될 수도 있는데, 시멘틱 태그로 구성하면 아 이 구역은 사용자가 입력하는 폼이구나, 필드들이 모여있는 필드셋이구나라는 것을 더 명확하게 전달할 수 있다는 것을 배웠습니다.

 

3. rem 초기 셋팅 꿀팁

이 부분은 시간이 부족해서 rem을 쓸 때 html 태그에 font-size: 62.5%를 설정해주면 px을 1/10한 값을 쓰면 된다는 꿀팁을 전수하고 말하기를 마쳤다.

 

질의응답 시간에는 주로 내가 로또 미션에서 ux를 어떻게 적용했는지와 시멘틱 태그에 대해서 주로 얘기했던 것 같다.

 

다음 낙타의 말하기 시간

낙타는 id와 class를 어느 상황에서 써야하는지에 대한 한 가지 주제로 말하기 준비를 해왔다.


본인이 생각했을 때 class는 비슷한 태그를 묶어서 스타일이나 js로 태그에 접근할 때 사용했고, id는 독보적으로 한 개만 존재하기 때문에 스타일에 적용해도 되지 않을까해서 두 개를 혼용해서 사용했다고 한다.

이에 대해서 질문을 했고 리뷰를 받았는데

id는 하나의 값 -> 하나에 지정을 해서 클래스를 추가, 삭제, 이벤트 부여 관점에서 좋다고 했다. 그런 부분에선 id를 쓰는것이 좋고 class를 사용하게 되면 같은 클래스를 가진 여러 태그가 선택되기 때문에 여러 태그가 들어와서 의존성이 높아진다. 그래서 class는 js로 조작하기에는 좋지 않고, 주로 css를 수정할 때 사용하며 한 꺼번에 여러 개의 값을 가져올 때 js에서 접근하면 된다는 피드백을 받았다고 한다.

 

여기서 나는 낙타에게 질문 시간에 css에서의 선택자에 대해서 질문을 했는데

나는 css 선택자로 태그 이름을 많이 사용했다. 이것이 가독성이 더 좋다고 생각했으며 접근하기에도 이것이 더 편하다고 생각했는데, 낙타는 어떻게 생각하는지에 대해서 물었는데, 낙타도 이것에 대해서 리뷰어에게 질문을 했고 피드백을 받았다고 한다. 내용은 현재 프로그램이 완벽한 버전이고 추가될 상황이 전혀 없다면 상관없지만, 확장될 가능성이 있고, 추가될 가능성이 있는 페이지에서 태그 이름으로 접근하는 것은 좋지 않다는 리뷰를 받았다고 한다. 내용이 추가되었을 때 다른 디자인으로 추가되어야 할 것이 추가됐는데 css 선택자가 태그 이름이라면 그렇게 할 수 없어서 좋지 않다고 합니다.

 

덕분에 css 선택자를 어떤 것을 사용해야하는지에 대해 생각을 해보게 된 계기가 됐던 것 같다.

메타인지 말하기 활동을 하면서 내 생각을 정리하는 것도 좋았지만 내가 생각해보지 못한 관점들을 들을 수 있다는 점도 좋았다. (물론 그냥 말하는 것도 좋았지만ㅋㅋ)

 

메타인지 말하기 활동 굳굳!