개발자
질문앞서 토스나 배민에서 여러 좋은 영상을 많이 업로드 해줘서 잘봤습니다만, 컴포넌트 구조나, js를 이렇게 까지 완벽하게 쓴다 하는 명확한 코드를 보고싶어요. 제목과같은 고민을 하고 직접 생각하고 짜봤지만 딱히 이렇다 할 결과물이 나오지 않는듯 합니다.. 저는 20인 이하 기업인데다가 신입만 모여있어서 좋은 코드 구경하기가 힘듭니다. 레포중에 스타를 많이받거나 단순히 트랜딩되는게 다가 아니라, 특정 문제( 잦은 재렌더링,최적화된 canvas 사용 , 깔끔한 컴포넌트 구조 등) 참고가 될만 한걸 보신분이 있다면 지식을 구걸하겠습니다.
답변 1
인기 답변
안녕하세요! 저도 비슷한 고민을 많이 했었는데요, 좋은 코드를 많이 보는 것은 확실히 도움이 됩니다 저는 센드버드의 quickstart 레포를 추천드립니다. 전반적인 디렉토리 구조도 확인하기 좋고 코드도 엄청 깔끔하게 작성되어있어요 https://github.com/sendbird/quickstart-calls-reactjs 그리고 아래는 제가 개인적으로 기능구현한 항목들을 push해둔 레포인데요, 앞으로 강의를 출시할 때마다 브랜치를 생성해서 업데이트 예정이라 참고하시면 좋을 것 같아서 같이 전달드립니다. https://github.com/jasonkang14/react-basics
MINGO
주니어개발자 • 2024년 01월 07일
저도 쓴이님과 같은 고민을 하고 있었는데 감사합니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2024년 01월 05일
인지도 있는 리액트 관련 깃허브 레포를 추천하고 싶습니다. 다음과 같은 레포들은 React와 관련된 좋은 코드와 패턴을 보여줍니다. 1. [React - 공식 리액트 레포](https://github.com/facebook/react) - 이 레포에서는 React의 내부적인 작동 방식에 대해 알 수 있으며, 깔끔한 코드를 볼 수 있습니다. 2. [Material-UI](https://github.com/mui-org/material-ui) - Google의 Material Design을 구현한 UI 프레임워크입니다. 좋은 컴포넌트 구조와 최적화된 성능을 보여주는 좋은 예시입니다. 3. [Redux](https://github.com/reduxjs/redux) - Redux는 JavaScript 앱을 위한 예측 가능한 상태 컨테이너입니다. Redux 사용법 외에도, 어떻게 큰 프로젝트를 구조화하고 효율적으로 코드를 작성할지 배울 수 있습니다. 4. [Apollo Client](https://github.com/apollographql/apollo-client) - GraphQL을 사용하는 클라이언트입니다. Apollo Client의 소스 코드는 잘 정리되어 있고 API 호출 등 비동기 데이터 흐름과 상호작용하는 데 필요한 모든 것을 처리하는 매우 효과적인 방법을 보여줍니다. 이 레포들에는 많은 스타가 있지만, 그 이유는 그들이 효과적인 코드 작성 방식과 좋은 구조를 보여주기 때문입니다. 이러한 레포를 분석하고 읽는 것에 익숙해지면, 나중에 다른 프로젝트에서 이러한 패턴을 찾아볼 수 있을 것입니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!