전체 글172 React 개발자 알면 좋은 안티 패턴 ※ 아래 내용은 생성형 AI 도움을 받아 작성했습니다.1. 상태 직접 변경❌ 안티패턴: 상태를 직접 변경하면 React가 렌더링하지 않습니다.const [tasks, setTasks] = useState([]);tasks.push(newTask); // 잘못된 방법✅ 올바른 방법: 불변성을 유지하며 상태 업데이트 함수를 활용합니다.setTasks(prevTasks => [...prevTasks, newTask]);2. 리스트에서 인덱스를 키로 사용❌ 안티패턴: 배열의 인덱스를 key로 사용하면 성능 문제 및 버그가 발생합니다.{tasks.map((task, idx) => ( ))}✅ 올바른 방법: 안정적인 고유 식별자를 사용합니다.{tasks.map(task => ( ))}3. 파생 가능한 상태를 과.. 2025. 5. 23. [Slack] 카카오 => 슬랙 마이그레이션 회고록 (Slack 데이터 가져오기) Slack 데이터 가져오기 URLhttps://[workspace 이름].slack.com/services/import/csv?started=1 Slack 데이터 가져오기 메뉴 가능방법! 관리자 계정으로 진행하셔야합니다.1. 워크스페이스 => 도구 및 설정 => 워크스페이스 설정 클릭 2. 홈 => 설정 및 권한 클릭 3. 설정 및 권한 => 데이터 가져오기/내보내기 클릭4. 데이터 가져오기 => CSV/텍스트파일 가져오기 클릭5. 데이터 가져오기2 => 내 CSV 파일 선택 6. 카카오톡 채팅 CSV 파일 가져오기채팅방 최상단 오른쪽 메뉴 버튼 클릭 [채팅방 설정] 클릭 7. 대화 내용 관리 => 텍스트 파일로 저장형식 변환 작업 필자에 경우 python을 통해 csv 파일을 읽고 채널명을 추가한 새.. 2025. 5. 9. [Mac] NVM (Node Version Manager) 설치 Homebrew 설치 brew install nvm 결과 ==> Downloading https://ghcr.io/v2/homebrew/core/nvm/manifests/0.39.5 Already downloaded: /Users/pcm9881/Library/Caches/Homebrew/downloads/0948392e3d85a4354980add2b7105cb9e5451cfaa01cc29222e9308bba3d50d9--nvm-0.39.5.bottle_manifest.json ==> Fetching nvm ==> Downloading https://ghcr.io/v2/homebrew/core/nvm/blobs/sha256:2290c2b0f95c6ba0c10d18b286bb8e4022126177d356eb.. 2023. 11. 9. [Flutter] Error (Xcode): DT_TOOLCHAIN_DIR cannot be used to evaluate LIBRARY_SEARCH_PATHS, use TOOLCHAIN_DIR instead ios/Podfile 수정 변경 전 ... post_install do |installer| installer.pods_project.targets.each do |target| flutter_additional_ios_build_settings(target) end end 변경 후 ... post_install do |installer| installer.pods_project.targets.each do |target| flutter_additional_ios_build_settings(target) end installer.aggregate_targets.each do |target| target.xcconfigs.each do |variant, xcconfig| xcconfig_path = tar.. 2023. 11. 2. [Mac] ₩ (원화) `(백틱) 입력하기 기본 내용 한글일 때는 ₩ 원화가 입력됩니다. 영어일 때는 ` 백틱이 입력됩니다. 추가 내용 한글일 때 ` 을 사용하고 싶을 때 단축키 fn + option + esc를 입력하시면 됩니다. 영어일 때는 안됩니다. 2023. 11. 2. [SQLite] 명령어 정리 데이터베이스 파일 위치 sqlite> .database 테이블 목록 sqlite> .tables 테이블 스키마 sqlite> .schema 출력 포맷 변경 sqlite> .mode list sqlite> .mode table sqlite> .mode column sqlite> .mode line ... 종료 sqlite> .exit 나가기 sqlite> .quit 명령어 설명 sqlite> .help mode 2023. 10. 30. [pyenv] 파이썬 버전 관리 pyenv 설치 설치방법 1 : Homebrew 설치 brew update brew install pyenv 설치방법 2 : curl 설치 curl https://pyenv.run | bash pyenv 명령어 파이썬 설치 가능 목록 pyenv install --list 파이썬 설치 pyenv install 예시 - 3.10.4 pyenv install 3.10.4 파이썬 설치 된 목록 pyenv versions 파이썬 삭제 pyenv uninstall pyenv virtualenv 설치 설치방법 1 : Homebrew 설치 brew install pyenv-virtualenv eval "$(pyenv virtualenv-init -)" 설치방법 2 : git clone 설치 git clone https.. 2023. 10. 13. [Web] 온라인 코드 에디터 제이에스피들 ( JSFiddle ) https://jsfiddle.net/ JSFiddle - Code Playground jsfiddle.net 코드펜 ( CodePen ) https://codepen.io/ CodePen An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications. codepen.io 코드샌드박스 ( CodeSandBox ) https://codesandbox.io/ CodeSandbox: Instant Cloud-Based IDE CodeSandbo.. 2023. 10. 12. [CSS] a 태그 (tag) 관련 a tag는 anchor(닻)의 약어 속성(attributes) target self: 현재 창 _blank: 새 창 ( 새 탭 ) href 클릭시 이동 할 URL(Uniform Resource Locator)을 입력 받는 속성입니다. a:link: 링크 방문 전 a:visited: 링크 방문 후 a:hover : 링크 마우스 오버 a:active : 링크 클릭 a 태그 밑줄 제거 a { text-decoration: none; } 2023. 10. 9. [Java] 다중 변수 선언 다중 선언 // int int i = 1, j = 2; // String String name = "", address = ""; // List List items = new ArrayList(), nodes = new ArrayList(); 다중 할당 // String String first, second, third; first = second = third = "다중할당"; // List List items, nodes; items = nodes = new ArrayList(); 2023. 9. 20. [CSS] 선택자 참조 (Selector Reference) - class 편 쉼표 ( , ) .class1, .class2, .class3 class1, class2, class3 모두 스타일이 적용됩니다. (OR 조건) class1 class2 class3 결과 띄어쓰기 (공백) .class1 .class2 .class3 class1 하위 class2 하위 class3에만 스타일이 적용됩니다. class1 class2 class3 결과 붙여쓰기 (공백없이) .class1.class2.class3 "class1 class2 class3"에만 스타일이 적용됩니다. (AND 조건) class1 class2 class3 결과 Reference https://www.w3schools.com/cssref/css_selectors.php CSS Selectors Reference W3Sch.. 2023. 9. 19. [React] Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it. 이슈 1 router element를 컴포넌트로 호출안해서 생긴 이슈입니다. import React from "react"; import Home from "pages/Home"; import { createBrowserRouter, RouterProvider } from "react-router-dom"; const router = createBrowserRouter([ { path: "/", element: Home, }, ]); function App() { return ( ); } export default App; 해결 방안 import React from "react"; import Home from "pages/Home"; import { createBrowserRouter, RouterPr.. 2023. 9. 17. 이전 1 2 3 4 ··· 15 다음
