#component당신의 컴포넌트는 안녕하신가요❗ 원지혁님의 컴포넌트, 다시 생각하기에서 얻은 인사이트를 정리한 글임을 밝힙니다. ❗ 필자의 생각도 많이 들어가 있으니 원본 영상도 함께 보는 것을 추천합니다! 🎯 개요 당신의 컴포넌트는 안녕하신가요? 조금 관심을 끌기 위한 멘트로 글을 시작했는데…
#refresh tokenrefresh token 도입기❗ SSR 상에서 refresh token을 도입하면서 느낀 것들을 작성한 글입니다. ❗ SSR에서 로그인이 어떻게 이루어지는지 궁금하시면 여기를 참고해주세요! 도입 계기 - 2시간이 지나면 로그인이 풀린다! 현재 진행하고 있는 놀토 앱은 acces…
#error-handling리액트 쿼리로 에러처리하기현재 팀 프로젝트를 진행하고 있는 놀토 팀에서는 를 통해서 에러 처리를 하고 있다. 에러 처리를 하면서 겪었던 어려움이 머리 속에 정리가 잘 안돼있다고 느껴서 글을 작성하게 되었다. 같은 환경으로 에러 처리를 구현하려고 한다면 글이 참고가 될 것이다…
#csrCSR 앱에서 SSR + CSR 환경으로 이주하기❗ CSR에 SSR을 적용하는데 어려움을 겪는 분들을 위해 작성했습니다. 혹시 틀린 부분이 있다면 말씀해주세요! ❗ SSR과 refresh token에 대한 사전 지식이 있으면 글을 이해하기 조금 더 편합니다. ❗ 웹서버와 WAS가 무엇인지 궁금하다…
#event-loop이벤트 루프, 넌 누구냐최근 requestAnimationFrame(이하 rAF)과 setTimeout을 공부하면서 브라우저의 싱글 스레드 동작이 정확히 어떻게 이루어지는지 잘 모른다는 생각이 들었다. 이번 기회에 이벤트 루프의 동작을 공부하고 추가로 rAF와 setTim…
#reactreact에서의 에러 처리🔥 아직 고민할 점이 많은 문제입니다. 다양한 의견 남겨주세요 🔥 에러 처리에 대해서 개인적인 생각들을 담았습니다. 🚫 에러, 어떻게 처리해야하나 이전부터 프론트 개발을 하면서 계속 고민했던 부분이다. 팀 프로젝트를 할 때 명확한 기준없이 에러 처리…
#react사용자 경험 개선 2편 - react concurrent mode❗ react suspense에 대한 이해가 필요한 글입니다. 사용자 경험 개선 1편을 참고해주세요. 👀 concurrent mode란 무엇인가 자바스크립트가 싱글 스레드 언어라는 것을 들어본 적이 있을 것이다. 이는 자바스크립트가 하나의 작업을 수…
#suspense사용자 경험 개선 1편 - react suspense📜 읽기 전에… 🎈 본문에 등장하는 문제에 대한 예시는 suspense를 사용하지 않고도 해결할 수 있습니다. 하지만 앱이 커지고 복잡해짐에 따라 각 문제를 어떻게 으로 봐주시길 바랍니다. 🎈 2021.07.11 기준 시험적인 기능입니다. 현재 정식…
#refactoringSWR, 서버 데이터를 앱 데이터처럼 관리해보자프론트엔드는 웹과 사용자가 맞닿아 있는 부분을 개발하는 영역이다. 따라서 프론트 개발자에게 라는 문제는 정말 중요하다고 볼 수 있다. 그런데 서버의 데이터를 보여주기 전에 관리부터 해야 할 텐데 다들 어떻게 관리해왔을까? 서버 데이터를 앱에서 관리하…
#refactoring프론트엔드에서의 Inversion of Control🎁 Inversion of Control 이란? , 제어 역전이란 무엇일까? 가장 간단히 설명하자면 용어 그대로 코드의 로직이 일반적인 제어 흐름이 아니라 역전된 것을 의미한다. 하지만 처음 IoC를 듣게 되면 은 무엇인지, 그리고 그 흐름이 어떻게…
#refactoringpresentational and container 패턴이란 무엇인가❗ 본 글은 Hook 개념이 없는 과거 리액트를 기준으로 쓰여진 글입니다. 리액트에서 과거에 자주 언급되고 활용되었던 패턴 중 라는 패턴이 있다. 처음 이 패턴을 소개한 Dan Abramov는 2019년 기준으로 현재는 이 패턴을 사용하지 말라고 …