본문 바로가기
728x90

리액트3

React_ Semantic 구조 시멘틱 태그에 대해서 알아두면 굉장히 좋다사실 이거 하나만 알아도 실제로는 무방하다 보지만, 협업이나 여러사람들이 같이 하는 구조에서는 이러한 방법은 비효율적인 방법이다.어떤 곳에서 어떻게 쓰이는지 시각적으로 직관적으로 해야 협업이 가능하므로 알아두면 굉장히 좋다필수라고 해도 과언이 아니다  그렇다면 Semantic 이란 무엇인가 !! React에서의 Semantic 구조란?Semantic(시맨틱) 구조란, 의미론적으로 올바른 HTML 태그를 사용하여 웹 페이지를 구성하는 것을 말한다.React에서 시맨틱 구조를 적용하면:**SEO(검색 엔진 최적화, Search Engine Optimization)**에 도움이 되고**웹 접근성(Accessibility, a11y)**이 향상되며코드 가독성이 좋아진다.. 2024. 8. 7.
React 새로고침 데이터 저장 리액트 작업 중 회원가입 페이지에서 새로고침했을때 기존에 input 태그에 입력했던 정보들이 전부 없어져버렸다. 원래는 기존 데이터를 가지고 있을 줄 알았으나, 그게 아니었다. 전부 입력했던 데이터들이 그대로 사라져버린 것이다. setState 안에 넣어봐도 깊은 복사를 해보아도 휘발성으로 사라져 버렸다. 왜그러지 ??그래서 방법을 찾아보았는데 React-Redux Persistance 라는 것을 알게 됐다.persistance .. 단어 부터 영구적이다  그렇다면 왜 React-Redux 가 필요한가!   Redux 는 React 에서 사용하는 api 기술관리 중 하나이다.처음에는 ContextApi 로 전역관리를 하면서 api 도 같이 작업하고 있었다. 사실 이 Context Api 로도 큰 불편함은.. 2024. 6. 9.
React useMemo.. useCallback.. memo.. React Native 에서 useMemo , useCallback , memo 등 다양한 함수들을 써왔다. 불필요한 리렌더링을 방지하기 위한 일련의 대책으로 사용했다. 하지만 useCallback , useMemo 등 비슷한 기능들이여서 정확히 어떤 용도인지 잘 몰랐다. 그래서 이참에 한번 글을 읽어 보았다. 이 부분은 React Native 에서도 똑같이 적용된다. 크로스 플랫폼에서 처음 접했으며 이걸 토대로 공부해 나아가서 React 로 넘어가게 된 것이다. React Native 는 크로스 플랫폼으로 간단한 앱을 2가지 OS 로 하고 싶을땐 정말 좋은 언어이지만 깊이 들어가면 어쩔 수 없이 네이티브 코드를 건드려야 한다 그래서 나는 React Native를 하되 AOS, SWIFT 도 같이 공부하.. 2024. 6. 9.
"이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다."
728x90