본문 바로가기

분류 전체보기45

Sass 유지보수 하기 쉽게 관리하기 (feat. sass-guidelines) 여담 이지만 이 글을 작성하게 된 이유는 현재 테오의 스프린트로 맺은 연으로 1차 스프린트를 끝낸 뒤 현재는 2차 사이클에 들어갔고 회의 끝에 디자이너가 다음 작업을 끝 마치기 전에 프론트엔드는 1차 스프린트 때 완성을 위해서 빠르게 작업하여 통일 되지 못했던 부분들의 아쉬움이나 유지보수 성을 높이기 위해 각자 맡은 부분에 따라 좋은 유지보수 방법을 조사하게 되었으며 나는 Sass 우아하게 관리하는 방법의 조사를 맡아서 정리 및 공유를 위해서 이 글을 작성했다. Sass 가이드라인의 말 을 조금 인용하며 시작하고자한다. There is a major difference between making it work, and making it good. 동작하게 만드는 것과 잘 만드는 것에는 큰 차이가 있다. .. 2023. 7. 15.
리액트의 작동 원리 와 최적화 정리 최적화 실패시 시나리오 # 리액트 랜더링 작동원리? 리액트에서 스냅샷으로 가상돔 비교 => 다른게 있다면 랜더링 실제 돔은 리액트가 구성한 이전 상태와 차이점을 기반으로 변경이 필요할때만 업데이트 되기때문에 필요한 경우에만 변경이 된다. 이는 성능 측면에서 아주 중요한데, 이전과 현재 상태를 가상으로 비교한다는것은 메모리안에서만 발생하기때문에 간편하고 자원도 적게 든다. # 리액트 컴포넌트 작동원리 ? state 나 props 가 변경 될때마다 함수 전체가 재생성됨. 기본적으로 리액트 컴포넌트는 함수로 생성되는 형태이기때문에 마찬가지로 안에서 선언된 모든 함수와 자식 컴포넌트도 재평가 재실행된다. (물론 클래스도 되지만 이 글에선 함수형 을 전제로 함) # 리랜더링 !== 재평가 공부하다가 새롭게 알게 .. 2023. 7. 11.
~ 7 /8 까지 의 회고 개인적으로 느끼기에 참 많은 활동과 배움이 있었다.. 근데 7월에는 더많이 배우고 적용하며 움직일 생각이다.  #CS50 수료  참 재미있고 만족스러웠다. 역시 명강이라 불리우는 강의는 남다르다는 것을 느꼈다. 일정 수준에 이르기까지는 현학적인 표현이 자기의 권위를 내세워준다면 이미 권위가 있고 증명할 필요가 없는 사람들이 '누구나 쉽게 알아볼 수 있도록' 만든 강의란 정말 귀한것이라고 생각한다.  근데 개인적으로 개관만 보고 만 느낌이 들어서 한편으로 아쉽다고 느꼈다. 그래서 부스트캠프에 있는 것 말고도 edwidth 라는 곳에서 내용은 좀 겹쳐보였지만 좀 부스트 코스보다 더 넓게 다루는 듯 해보이는 cs50을 또 수강신청했다.     #알고있는 것에 대한 의심  cs50 교육을 들으면서 그런 생각이 .. 2023. 7. 8.
반응형 웹 viewport 메타 태그에 대해서(하드웨어,소프트웨어 픽셀) #웹을 반응형으로 만드는 방법 웹을 반응형 으로 만드는 방법에는 뭐가 있을까? 나는 미디어 쿼리 하나 뿐이라고 생각했으나 다른 디바이스에서 반응형을 사용할려면 미디어 쿼리 이전에 메타 태그가 선행되어야 되는 것이라는 것을 깨달았고 이 태그에 웹 접근성 까지 내포한 개념 이 있었기에 공부한 김에 한번 정리 목적으로 글을 작성했다 하드웨어 픽셀과 소프트웨어 픽셀 메타 태그를 이해 하기전에 하드웨어 픽셀과 소프트웨어 픽셀에 대해서 짚고 넘어가야된다. 안 그러면 밑에 나올 태그에 대해 그냥 저건 반응형에 쓰이는 메타 태그입니다 ^^ 하고 별로 특별히 정리할것이 없다. 하드웨어 픽셀은 기기(디바이스)의 픽셀 이라고 이해하면 되고 소프트웨어 픽셀은 css 픽셀이라고 이해하면된다. 하드웨어 소프트웨어 픽셀 개념의 차.. 2023. 7. 5.

티스토리툴바