본문 바로가기

분류 전체보기302

프로젝트 시작단계에서 컴포넌트 폴더/파일 한번에 생성하기 (feat. powershell) 개발자 마다 다를 수있지만 프로젝트 시작단계에서 컴포넌트의 구성까지 미리 계획하는 사람들도 있을 것이다.(기획서와 디자인이 있다면...) 만약 컴포넌트의 구성을 어떻게할지 결정했다면 다음은 코드 에디터에서 컴포넌트를 만들기 위해서 다량의 폴더와 파일을 생성해야 할 것이다.  이때 일일이 "우클릭" → "폴더/파일" 을 반복하다 보면 손가락이 상당히 피곤하다.그래서 터미널에서 bash 라면 "mkdir", powershell 이라면 "NewItem" 명령으로 일괄 생성하면 편하더라. 예)# 복수 폴더 생성New-Item -ItemType Directory -Path "src\components\ProgressIndicator", "src\components\QuestionBox"# 파일 생성New-Item.. 2025. 1. 27.
[React.js] 클래스형 컴포넌트의 단점 3가지 1. 문법이 복잡하고 코드가 길어짐2. 상태 관리와 라이프사이클 관리의 복잡성3. this 키워드의 사용  1. 문법이 복잡하고 코드가 길어짐 클래스형 컴포넌트는 constructor, this.state, 그리고 this를 바인딩해야 하는 등 초기 설정이 비교적 복잡합니다. 함수형 컴포넌트와 비교했을 때 동일한 기능을 구현하는데 더 많은 코드와 반복적인 작업이 필요합니다. 클래스형 컴포넌트:import React, { Component } from 'react';class Counter extends Component { constructor(props) { super(props); this.state = { count: 0 }; this.handleIncrement = this.ha.. 2025. 1. 22.
Published three.js practice projects (feat. blender) 현대백화점(중동)https://blackstarzck.github.io/custom_model/ isometric room 01 (feat. animation)https://blackstarzck.github.io/isosmetric-01/ isometric room 02 (feat. respond to dynamic gltf file)https://blackstarzck.github.io/isosmetric-02/ particle (display random shame and images)https://blackstarzck.github.io/particle particles starshttps://blackstarzck.github.io/particle-colorful-stars/ scroll pag.. 2024. 11. 19.
Modifier - Array 로 생성된 복수 오브젝트 나누기 Modifier Array Apply → Edit mode → 전체 선택(vertex, edge, face 상관 없음)  → P → Loose Parts 2024. 9. 13.
(비교) Extrude Faces Along Normals & Modifier-Solidify 차이점1. Edit mode 에서 vertex 의 생성 유무- Extrude Faces Along Normals : Extrude 이 후 뽑아진 면 부분에 vertex 가 생성됨- Solidify : Extrude 이 후 뽑아진 면 부분에 vertex 가 없음  공통점 1. 두 방법 모두 Extrude 이 후 뽑아진 면이 균등(even)하지 않다.  해결방법: 2024. 9. 11.
MUI custom-palette 를 동적으로 생성 & tailwind, Material UI 테마(theme) 의 색상 동기화(sync) 빠른 개발을 위해 스타일 관련 라이브러리는 tailwind, 컴포넌트는 MUI 를 사용하려고 한다. 그런데, MUI 의 color system 과 tailwind 의 colors 는 조금 다르다. 예를 들어 "Teal" 500 의 컬러 코드를 보면 MUI 는  #009688, tailwind 는 #14B8A6 인 것을 볼 수 있다. 이와 같이 색상 코드가 서로 일치하지 않기 때문에 MUI 컴포넌트와 tailwind 의 스타일이 섞인 형태인 경우 디자인 시안과 결과물이 다를 수 밖에 없다. tailwind 의 사용 빈도가 MUI 보다 상대적으로 높기 때문에 MUI 의 색상(primary, accent, warn...)을 tailwind 에 맞추기로 하였다. 아래는 SCSS 로  tailwind 의 컬러 코.. 2024. 8. 5.