본문 바로가기

분류 전체보기402

Next.js를 사용하는 이유 (자유도의 관점, CSR vs pre-rendering) 지난 번 포스팅에서 Next.js를 사용하는 이유에 대해서 간단하게 작성해보았었다. API 라우트 구축이 가능해서 풀스택 애플리케이션을 만들 수 있고... 프레임워크의 성격을 가지고 있어서 별도로 스타일링을 해주거나 라우팅을 하기에 더 빠르고 수월하다는 점... 등등 네 다섯 가지 예시를 들었던 것 같다. 그런데 사실 개념을 정리한 정도의 요약글이었고, 구체적인 개념들을 살펴보진 않았었다. 따라서 이번 글에서는 Next.js를 사용하는 그 이유에 대해서 심도있게 다뤄보고자 한다.만약 이 글을 보고도 공감이 안 된다면 쓰지 않아도 된다. 마치 Next.js의 영업사원을 자처하는 것 같지만 리액트 단독으로 앱을 개발한다고 해서 문제가 되는 것은 아니다. 다만 Next.js의 이점을 누리지 못할 뿐.리액트 공.. Programing/Next.js 2024. 8. 25.
HYE Hobby/Guitar 2024. 8. 24.
2024-08-24 design pattern이란? 참고 문서https://www.linkedin.com/pulse/design-patterns-frontend-development-divyansh-singh Design Patterns in Frontend DevelopmentFrontend development is an ever-evolving field with a constant need for maintaining clean, maintainable, and efficient code. To address these challenges, developers turn to design patterns.www.linkedin.comhttps://refactoring.guru/design-patterns/ Design PatternsDesign Pa.. Programing/TIL 2024. 8. 24.
2024-08-23 TanStackQuery enabled 옵션으로 페칭 순서 조정하기 이것이 무슨 말이냐?상황을 보면 이해될 것이다. 코드를 작성하다 보니 이런 케이스가 발생했다. 다른 커스텀 훅을 통해 유저의 아이디만 추출한다.추출한 아이디로 API 라우트에 쿼리 매개 변수에 실어 GET 요청을 보낸다. 이거 두 개를 하고 싶었을 뿐인데,문제는 유저의 아이디만 추출해올 때 undefined가 찍혔다가 데이터가 불러와져서 그 사이에 비동기 함수인 GET 요청이 쿼리 매개 변수에 아무 값이 없는 상태로 넘어가게 되는 것이다. 그러니 계속 400 상태 코드와 함께 에러를 뿜어 낸다. TanStack Query로 상태 관리 중이라면 아주 간단하게 해결할 수 있다. 문제의 코드const { data: clickedBuddy, isLoading, error } = useBuddyProfile(pa.. Programing/TIL 2024. 8. 23.
2024-08-22 컴포넌트 재사용에 따른 조건부 로직 구현 방법 '팀 프로젝트'란 무엇인가부트캠프에서 마지막 프로젝트를 진행하면서 엄청난 깨달음을 얻었다. 이번 프로젝트까지 팀 프로젝트를 5~6번은 진행한 것 같은데,마지막 프로젝트는 약 한 달 간 진행하는 나름(?) 대규모 프로젝트였고,이전 프로젝트는 1~2주 내외의 비교적 간단한 프로젝트였다. 앞에 짧게 진행했던 프로젝트들을 거치면서 많이 성장했다고 느꼈었는데'팀 프로젝트'라는 것에 대한 접근법 자체가 틀렸었던 것 같다. 지금 와서 생각해보니 그 전의 프로젝트는4~5명의 개인 개발자들이 공용 리포지토리를 하나 만들어서각자 맡은 페이지나 기능을 만들어서 합치는 과정에 불과했던 것이었다는 생각이다. 내가 이런 생각을 하게 된 이유는 최종 프로젝트가 힘들어도 너무 힘들다는 것에서 '왜 그럴까'라는 고민에서 시작되었다. .. Programing/TIL 2024. 8. 22.