WEB Dev/Javascript | REACT | Node.js(29)
-
[Javascript] 정규식으로 태그 제거하기
모든 꺽쇠로된 HTML 태그 제거하기 var txt = ~텍스트~; txt.replace(/(]+)>)/ig,"") 태그 중 일부분만 제거하기 var txt = ~텍스트~; txt.replace(/]*)>/gi,""); navigator.share 이용해 공유 기능을 구현하는데 data 태그로 text를 받아오다보니 개행 태그가 그대로 노출되어 정규식과 replace 메소드를 이용해 제거하였다. 인터넷의 대부분의 정규식을 적용해보았으나 가장 정확하게 드는 정규식이라 기록한다! 출처는 아래에! 을 제거하는데도 모든 HTML 태그 없애는 정규식이 가장 깔끔하게 먹혔다. [자바스크립트] 정규표현식을 사용하여 태그만 제거하기 정규표현식을 사용한 태그의 제거 방법입니다. 태그를 제거하기 위해서 내장함수에서 태그를..
2022.01.06 -
[Javascript] sessionStorage 사용하기 (setItem, getItem)
업무가 커머스 페이지 유지보수이기 때문에 세션을 활용해서 화면을 구현해야 하는 일이 생각보다 많다. 로그인한 회원의 정보를 가져다 쓰는 일이 많기 때문에 localStorage 보다 sessionStorage를 사용한다. .setItem으로 세션에 넣고, . getItem으로 가져오는건 아는데 활용법을 가끔 까먹어서 메소드 정리 겸 포스팅한다. 로컬 스토리지Local Storage | 세션 스토리지Sesstion Storage 공통점 - 로컬스토리지와 세션스토리지 모두 '웹 스토리지 객체 Web storage object' 이다. - 브라우저에 키 - 값 (Key - Value) 쌍을 저장해서 데이터로 사용할 수 있다. - 저장되는 값은 객체가 아닌 텍스트다. (객체를 주로 저장하는데 이것도 텍스트로 바..
2021.12.30 -
[React] useState 사용하기
리액트는 상태관리가 다 인거 같은데... state 개념은 지금까지 몇 번 반복해도 쉽게 이해가지 않는다. 거기에 props까지 더해지면 갑자기 머리가 팽 돌아버리는 느낌이 든다 (⌐■_■) 코딩애플 강의를 글로 정리한 적이 없어서 글로 정리하면서 참고자료를 만들어본다. State란? *중요한 데이터는 변수말고 리액트 state! 아마 나처럼 아직 변수에도 익숙하지 않은 사람은 state라는 개념을 왜 쓰는지 조차 이해할 수 없을 때가 있다. 그냥 변수인데, 변경되는 변수인 state는 useState라는 hook을 통해 쉽게 조작할 수 있다. 리액트에서 State를 쓰는 가장 큰 이유는 리액트는 state가 변경될 때 그 state가 포함된 HTML을 자동으로 재렌더링한다. var, let, const..
2021.12.26 -
[Javascript] 간단한 링크 주소 복사 버튼 만들기
이벤트 등을 할 때 링크 주소 공유 기능을 만들어야 하는 경우가 있는데 스크립트를 길게 쓰지 못하는 경우에 사용하려고 저장한 방법이다. 만약 이미지를 클릭했을 때, 지금 현재 url이 복사되도록 하고 싶다면 아래 함수를 사이에 넣고 을 써주면 해결된다. 만약 특정 url을 복사하게 하려면 아래 함수의 url = "window.location.href" 에 원하는 url을 넣으면 된다. function clip(){ var url = ''; var textarea = document.createElement("textarea"); document.body.appendChild(textarea); url = 'window.location.href'; textarea.value = url; textarea.s..
2021.12.22 -
[React] 상태관리 라이브러리 RecoilJS
🔷 상태관리 라이브러리 Recoil A state management library for React 투두메이트 클론 프로젝트를 진행하면서 상태관리 라이브러리에 대해서도 공부하게 되었다. 리액트 개발자라면 누구나 필수로 사용해야 한다는 상태관리 라이브러리들 중에서 가장 유명한건 역시 Redux지만 Redux가 큰 규모의 애플리케이션에 적용하기 좋은 라이브러리이고 그렇기 때문에 무겁다는 평이 있어서 작은 프로젝트인 우리 프로젝트에서는 Recoil을 쓰는 것을 추천해주셨다. 리액트를 만든 페이스북팀이 만든 상태관리 라이브러리기 때문에 앞으로의 대세가 될 가능성이 있다. 아직 리코일에 대한 글이 많이 없어서 유튜브와 블로그를 참고해서 상태관리에 대한 정의와 Recoil 사용법을 간단하게 정리해보고자 한다. 상..
2021.11.28