전체 글153 React 좀 더 현명하게 사용하기 이제 프론트엔드 엔지니어로 일을 하게 된 지 경력 1년이 넘었는데, 그동안 알게 된 React에 관련된 편리한 꿀팁들을 작성해 보려 합니다. 지극히 주관적인 의견들이 들어가 있음을 미리 알려드립니다! 1. 재사용성, 확장성이 좋은 atomic component 만들기 어떤 프로젝트를 시작하던 atomic component를 잘 만드는 것은 중요합니다. material UI나 ant design처럼 잘 만들어진 컴포넌트 라이브러리를 사용하기도 하는데, 시간이 좀 들더라도 컴포넌트를 직접 만들어야 할 때가 있습니다. interface CustomButtonProps { text: string; onClick?: () => void; } const CustomButton = ({ text, onClick = .. 2023. 5. 8. [Babylon.js] Blender로 Babylon.js에 필요한 모델 추출하기 https://doc.babylonjs.com/features/featuresDeepDive/Exporters/Blender Blender to Babylon.js exporter | Babylon.js Documentation Blender to Babylon.js exporter The Blender export plugin can be found on github repository. We assume your using the last version. Note that v6 is for Blender 2.8 (currently in beta), v5 for Blender 2.79b or below can be found in the deprecated folder. In doc.babylonjs... 2023. 2. 14. [Next.js] getStaticProps, getServerSideProps 제대로 이해하기 nextjs의 큰 장점 중 하나는, SSR(Server Side Rendering)이 쉽다는 것이다. 서버 사이드 렌더링은 한마디로, 서버에서 html을 렌더링해서 클라이언트에 전송해주는 것을 뜻한다. php나 jsp등 서버에서 템플릿 엔진을 이용해 html을 전송해주는 방식들이 대표적인 서버 사이드 렌더링이라고 볼 수 있겠다. 그와 반대로 클라이언트 사이드 렌더링은 브라우저(클라이언트 측)에서 html을 그리는 방식이다. nextjs의 경우 좀 더 정확히 말하면, CSR(Client Side Rendering)이 필요한 곳에 CSR을 SSR이 필요한 곳에 SSR을 적용하기 쉽게 되어있다. (Pre-rendering이라고 한다.) getStaticProps나 getServerSideProps같은 경우도 .. 2023. 2. 12. 빌드 시 에러가 나는 경우, minify 옵션을 꺼보자. 개발환경에서 프론트엔드 앱을 구축하고, 빌드해보면 예상치 못한 에러들이 발생하곤 한다. 타입스크립트를 사용하여 컴파일 시점에 최대한 에러를 검출하려 해도 외부 라이브러리 등에서 런타임 에러가 발생할 수도 있다. 예컨대, 개발이냐 프로덕션이냐 개발환경에 따라 생성되는 코드가 꼭 같다고 말할 수는 없다. 보통 빌드 시 minify를 통해 파일의 용량을 줄여주는데, 이때 코드가 난독화되기 때문에 에러가 발생한 구문을 보아도 이게 정확히 어떤 코드인지 구분이 어렵다. 이럴 때는 minify 옵션을 끄고 빌드해보면 에러가 난 곳을 쉽게 찾을 수 있다. vite react의 빌드 명령어는 tsc && vite build다. vite build --minify false로 빌드한 후 다시 에러로그를 확인해보자 min.. 2022. 12. 11. 이전 1 2 3 4 5 6 ··· 39 다음
