우테코 생활, 두 번째 기록

안녕하세요 메이토입니다 ! 

이번주 선릉 캠은 아주 콜록 소리로 가득한데요 ,, 이유를 아시나요? 바로 감기 때문입니다..

제가 불과 일요일,, 그러니까 23일쯔음 부터 약간의 목 따가움 증상을 경험을 하고 있었는데 아니 글쎄,,

월요일 되자마자 목이 좀 붓더라구요? 그래서 병원을 갔습니다

영롱한 엽떡의 자태 ,, 이 한강이슈로 결국 데일리조 절반 넘게 감기걸림

이때 주사를 맞았어야 했는데 ,,

주사를 맞지 않고,, 약만 받고 그날 저녁에 데일리 조와 함께 한강을 놀러갔다가 결국 감기가 극심해져 화- 수간의 기억이 거의 전무한 상태입니다 ㅎㅎ 

화요일은 캠퍼스에 나왔지만 거의 열이 올라오고 목소리가 안나와서 병든 닭처럼 다녔구,, 수요일은 결국 병결을 냈습니다 😅

그 이후 보니까 다른 크루들도 감기의 영향을 많이 받았는지 병결로 못나오거나, 코로나를 걸리게 된 크루도 있더라구요,,

이렇게 아프고 나니 한 주가 금방 갔지만, 그래도 이번주 회고를 통해 그 시간동안 어떤걸 배웠는지 더 샅샅이 파헤쳐 보겠습니다

 

< 마인드 셋 >

미션을 할 때 여러분들은 AI를 얼마나 사용하시나요? 당연히 미션의 난이도에 따라 다르겠지만, 최대한 미션 진행할 땐 써보지 말자,, 라는 마음을 가지고 있었습니다 (물론 뜻대로 되지 않더군요 ㅎ.ㅎ) 그러다 보니 AI를 쓰기만해도 괜히 눈치가 보이고,, 쓰면 뭔가 잘못하는 것 같고,,, 금기의 무언가를 하는 느낌이 들더라구요?

 

사실 생각해보면 AI는 잘 이용만 한다면 굉장한 학습 도구가 될 수 있다고 생각합니다. 제가 주로 사용하는 방법은 거창하지는 않지만 크게 두 가지에요 !

1. 상황에 대해 설명하고 '코드는 주지말고 힌트부터 줘' 라는 말을 덧붙여서 코드에 대한 정답을 보기 전 힌트를 보기

 

-> 요 방법을 사용했을 때 꽤 도움이 되었던 이유는 저 말로 설명된 부분만 보고 제가 구체적인 로직을 고민해볼 수 있다는 점이었어요! gpt 와 페어 프로그래밍을 하듯이 하는거죠 ! 이해될 때 까지 무제한 질문을 해볼 수 있는 아주 좋은 페어입니다 ㅎㅎ 

 

2. AI가 답해준 부분에 대해 이해될 때 까지 꼬리질문하기

1번의 연장선입니다! 위에서 AI가 준 힌트를 보고 어떤 로직으로 짤지 머릿속으로 대강 설계를 하고 AI에게 되물으면서 이해한게 맞는지 계속 질문하는거죠

" 그러니까 너의 말은 이렇게 이렇게 하라는거 맞지? "

 

그렇게 반복하다 보면 하나의 방법을 제 스스로 체화할 수 있게 됩니다. 보통 이렇게 진행한 개발은 기억에 잘 남더라구요 😀

저는 AI를 개발에 쓰는 것에 있어 꽤나 긍정적인 입장입니다 제가 AI로 미션의 모든 것을 해결하려고 하지 않고 있고, 저의 학습 의지와 함께 

< 건강 >

건강 중요합니다.. 그리고 결국 이 건강이 제 태도가 되는 것 같기도 하더라구요. 이번주 이상하게 제 스스로 왜이렇게 사람 자체가 회의적이 되었나,, 생각해보니 건강이 안좋아서 였습니다. 제 몸 하나 간수하기 힘들어 지니 다른 사람에게 말을 할 때 조금 덜 정제된 상태로 나아가기도 하고, 예민해지는 것 같다는 느낌을 받았습니다. 그래서 하루가 끝날 때 침대에 누워서 '오늘은 내가 어떤 말을 했는가' 를 종종 돌아보곤 하는데 조금 더 잘 표현할걸 이라는 생각을 이번주 유독 많이했습니다 (혹시라도 제 말로 인해 무언가 마음에 불편함을 느끼시게 되었다면 이 글을 보시고 꼭,, 꼭 알려주세요)

 

아 그리고,, 저는 천성 E라 그런지 사람들이랑 같이 있는 환경에 있어야 즐겁던데 쉬면서 집에만 있으니까 몸도 근질거리구 빨리 캠퍼스 가고 싶더라구요 ㅎㅎ ,, 건강 절대 잃으면 안되겠다는 생각입니다 :)

 

< 개발 >

이번 영화 리뷰 미션에서 step 2에서는 더보기 버튼 대신 무한 스크롤로 구현하였는데 이 과정에서 스크롤 이벤트와 intersection observer API를 비교하고, 그 과정에서 더 성능적으로 좋다라고 판단되는 방법을 선택하였습니다.!

 

무한 스크롤 구현

 

1. scroll 이벤트

• window.addEventListener("scroll", callback)을 사용하면 사용자가 스크롤할 때마다 매우 자주 이벤트가 실행됨
• scrollTop, clientHeight 같은 속성을 계속 읽고 변경해야 해서 Repaint & Reflow 비용 증가\
• 특히 DOM이 복잡해질수록 브라우저가 레이아웃을 다시 계산해야 해서 성능 저하 발생

 

2. Intersection Observer API

•  불필요한 scroll 이벤트 감지 X → Reflow 비용 절감
•  특정 요소(loadMoreTrigger)가 화면에 들어올 때만 실행
•  효율적인 방식으로 브라우저에서 최적화됨

 😖 고민

이전 페이지의 데이터를 계속 유지한 채 새로운 데이터를 추가하면, DOM이 점점 커지면서 성능 문제가 발생할 수 있다고 생각한다 특히, 무한 스크롤이 계속되면 불러온 데이터가 쌓이면서 메모리 사용량 증가로 인해 렌더링 성능이 저하될 위험이 있는 것 같은데 게속 쌓아나가는 구조가 괜찮은건지 ,,?

 

요즘 저희 프론트의 삶,, 화이트보드에 잔뜩 행성이 그리기

위 고민은 해결되지 않았지만 ,, 

 

어찌 되었든 이번주는 레벨 인터뷰를 앞두고 레벨 1을 마무리하는 과정이라서 바쁜듯 안바쁜듯 하지만 또 한 주도 즐겁게 보내고 방학을 맞이 하면서 마저 해결해봐야겠어요 ~!