본문 바로가기

react29

[세미나] 왜 리액트인가? 사내에서 진행했던 세미나 발표 자료, 스크립트 정리0. 왜 리액트인가?오늘 주제는 "왜 리액트인가?"입니다. 리액트는 웹 개발에서 가장 인기 있는 기술 중 하나로, 전 세계의 수많은 개발자들과 기업들이 선택하고 있는 기술입니다. 2024년 스택오버플로우 개발자 조사에 따르면, 지난 1년 동안 어떤 웹 프레임워크와 웹 기술로 광범위한 개발 작업을 했으며, 내년에 어떤 작업을 하고 싶으신가요? 라는 설문에서 약 40%가 React를 선택했습니다. 2024년 뿐만 아니라, 리액트는 등장 이후로 꾸준히 순위가 증가하여, 현재까지도 높은 순위를 유지하고 있습니다.이런 통계는 리액트가 단순히 유행으로 많이 사용되었던 것이 아니라, 현재까지도 발전하며 많은 사람들에게 사용되고 있다는 것을 보여줍니다. 따라서 오늘 발.. 2024. 8. 29.
[TIL] Redux-Toolkit, Redux-Persist 에러 A non-serializable value was detected in an action, in the path: `register`. 프로젝트 테스트 중 Redux-Toolkit과 Redux-Persist를 함께 사용하니 콘솔창에 계속 에러가 났다.chatGPT에게 물어보니 아래와 같은 답을 주었고 이해는 안 됐지만 에러는 해결함...const store = configureStore({ reducer: persistedReducer, middleware: (getDefaultMiddleware) => getDefaultMiddleware({ serializableCheck: { // 직렬화 확인을 무시할 액션 타입들을 설정합니다. ignoredActions: ["persist/PERSIST"], }, }),}); 2024. 6. 16.
[TIL] Vite-React-Eslint Prop-Types 검사 에러 없애기 프로젝트 프론트 테스트 중 Vite로 구축한 React 환경에서 컴포넌트에 props를 넘기는데'error' is missing in props validationeslintreact/prop-types위 에러가 계속 나서 내가 처음에 타입스크립트로 잘못 선택했나 싶었는데 에러창을 잘 살펴보니 eslint 에서 문제가 있는 것 같아 찾아봤다. 이유는 vite로 프로젝트 구축할 때 자동으로 생성되는 .eslintrc.cjs 파일의 extemds 부분에 있는 "plugin:react/recommended" 가 문제였다. 이 설정은 React 컴포넌트에서 PropTypes를 사용하여 props의 타입을 검사하도록 권장해서 PropTypes를 정의하지 않았을 때 경고 또는 오류를 발생시킨다고 한다. (출처 Ch.. 2024. 6. 14.
[React, JavaScript] ChatGPT 질의응답 - styled-components와 JavaScript 표현식 styled-components에 대해서 공부하다가 props 사용 중에 해당 문법이 어떻게 동작하는지 궁금해져서 물어봤다.딥다이브 스터디 할 때 분명 배운 것들인데 또 헷갈린다 ㅠㅠ역시 JavaScript에 대해서 잘 알아야 하겠다...  Q1. background-color: ${(props) => props.bgColor}; 이런 식으로 css 코드에서 $과 {}를 사용하는 이유와 동작 방식이 궁금해A1. styled-components에서 CSS 코드 내에서 $와 {}를 사용하는 것은 JavaScript 표현식을 문자열 템플릿(template literals) 내에 삽입하기 위한 ES6(ES2015) 문법의 일부입니다. 이러한 문법은 태그된 템플릿 리터럴(tagged template litera.. 2024. 1. 17.