조각 테크 공유
1.크로스 브라우징이란?(아니 로컬에선 분명 잘 나왔다니까요!?)
intro개발을 할 때 보통 크롬을 사용해 작업을 하게 됩니다. 그때는 아무 문제가 없었던 기능 혹 css가 사파리나 다른 브라우저에서는 깨지는 경우가 생기곤 합니다. 따라서 해당 개념과 연관 지어 크로스 브라우징에 대해 글을 작성해 보았습니다!크로스 브라우징이란?다양
2.Currying이란?
코드 리뷰로 다른 동료분께 커링을 사용하는 것도 좋아 보이네요!라는 이야기를 들었습니다. 부끄럽지만 그때는 커링이 무엇인지 몰랐었습니다. 커링에 대해 찾아보니 함수형 프로그래밍에 있어 보다 함수의 재사용성을 높일 수 있는 방법이라는 것을 알게 되어 이번 기회로 공유를
3.Query Key 효율적으로 관리하기
협업을 하면 무엇이 떠오르시나요? 다양한 것이 있겠지만 저는 코드 컨벤션과 같은 것이 우선적으로 생각이 났습니다.
4.컴포넌트를 책으로? StoryBook
컴포넌트 주도 개발을 할 때 보통 결과물을 실시간으로 확인해가며 컴포넌트를 구현합니다. 실시간으로 결과물을 보며 상황에 따른 조건들과 해당 결과를 만들어가는 것은 꽤나 번거롭습니다.초대 코드를 통해 상대를 초대하고 뜨는 모달창포인트 사용 이력 등그러나 이런 상황에서 독
5.사용자 친화적인 에러 처리하기
에러가 났을 때의 적절한 사이트의 대응에 따라 사용자 경험의 차이가 있을 것입니다. 또한 이것은 사이트의 완성도에도 영향을 미칠 것이라 생각합니다.
6.리액트 리렌더링 최소화 하기
react developer tool이라는 크롬 확장 프로그램을 아시나요?해당 확장자는 리액트로 만들어진 페이지의 렌더링을 직접 눈에 보이게 표시해 주는 프로그램입니다.해당 프로그램을 다운 받고 작업하던 페이지의 렌더링 과정을 살펴보니 불필요한 렌더링이 너무 많이 일어
7.Heap 메모리와 GC 알고리즘
Heap. 자료구조, 알고리즘 적으로는 꽤나 익숙하실 것입니다. 그러나 이번 주제로는 힙 메모리라는 영역과 그를 관리하는 가비지 컬릭터에 대해서 이야기해 보려 합니다.힙 메모리란 자바스크립트에서 참조 타입(객체 등) 데이터를 저장하기 위한, 메모리 할당을 하는 영역으로
8.CSS 전처리기 및 라이브러리
들어가는 말)개발을 하며 다양한 css 전처리기 및 라이브러리를 사용한 경험이 있습니다. 그러나 각각의 특징에 대해서는 깊게 생각해 본 적이 없었습니다. 이번 글에서는 대표적인 CSS 방식인 Sass, SCSS, 그리고 CSS-in-JS에 대해 설명하고, 각 방식에 해
9.웹 성능 최적화가 필요한가요?
웹 성능 최적화라는 말은 많이 들어보셨을 것입니다. 최적화를 왜 하시나요? 라는 질문에 저는 빠른 웹 사이트가 사용하기 좋으니까요.라는 답이 전부였습니다. 이번 글을 읽으며 좀더 구체적인 웹 성능 최적화의 이유와 측성 기준에 대해서 알아보고자 합니다.만약 사용자가 ko
10.React의 불변성이란?
들어가는 말)react 라는 주제로 면접 스터디를 진행하였습니다. 이때 리엑트의 불변성과 관련된 질문이 많이 언급되었습니다.이번 기회에 불변성이 어떤 성질이며 React에서 왜 불변성을 유지해야하는지 살펴보려 합니다.불변성이란 말 그대로 변하지 않는 성질이라는 뜻을 가
11.github action을 통해 CI 구축하기
최근 진행한 헤커톤에서 팀원 교체를 경험하게 되었습니다. 서로 다른 코드 스타일로 인해 코드가 조금씩 어지러워진다는 느낌이 들기도 하였습니다. 이는 프로젝트의 규모가 커지며 더 심각하게 느껴질 수 있는 부분일 것입니다. 따라서 저는 위와같은 어려움을 겪으며 CI(지속적
12.SSR과 RSC의 차이?
CSR,RSC,SSR 너무 복잡한 개념 샌드위치로 이해해봅시다!
13.웹 접근성이란?
자기소개를 하는 멘트에 저는 “UX측면에 신경을 많이 쓴다.”라고 이야기 합니다. 그런데 어느 날, 답변에 대한 후속 질문으로 “디자이너가 동일한 디자인 파일을 넘겨주었을 때, 개발자는 어떻게 하면 스스로의 역량을 가장 잘 나타낼 수 있을까요?”라는 질문을 받았습니다.
14.RSC란?(RCC, RSC의 렌더링 방식과 약간의 SSR)
Next 13 업데이트에 app directory가 되면서, app directory 내부 모든 컴포넌트는 기본적으로 서버 컴포넌트로 동작이 됩니다. 이 서버 컴포넌트는 무엇이고 어떻게 동작하는지 알아봅시다.
15.“라우팅”과 “서빙”의 차이가 뭐죠?
사용자는 url을 통해 이동하며 페이지를 돌아다니죠. 그런데 내부에서 어떻게 페이지 전환이 이루어질까요? 또 브라우저에 페이지가 전달(서빙)되는 과정은 어떻게 될까요? 우 고민들을 인프라적인 관점과 렌더링 관점에서 이야기해보려고 합니다.
16.테스트 코드 작성하기
요즘 프로젝트 스택이나 구인 공고를 보면 테스트 코드를 작성해 본 경험을 우대하는 경우가 많죠. 그리고 프로젝트를 하다 보면 팀원들 사이에서 빠지지 않고 등장하는 주제 중 하나가 바로 테스트 코드일 것이에요.그렇다면 우리는 왜 테스트 코드를 작성해야 할까요?