728x90 React15 React 무한 스크롤 리액트에서 페이징 처리를 해야하는 상황이였다...주로 앱을 작업하였기 때문에 Swift 에서는 tablecell 로 스크롤이 마지막에 닿으면 그때 쓰레드를 통한 페이징처리를 작업하였고 Java에서도 역시 recyclerview 를 이용한 페이징 처리를 진행하였다.하지만 웹에서는 어떻게 스크롤 끝을 감지하여 페이징하는지 잘 몰라서 검색해보았다.. https://velog.io/@somda/FE-React%EB%A1%9C-%EB%AC%B4%ED%95%9C-%EC%8A%A4%ED%81%AC%EB%A1%A4%EC%9D%84-%EA%B5%AC%ED%98%84%ED%95%B4%EB%B3%B4%EC%9E%90 [FE] React로 무한 스크롤을 구현해보자강아지를 무한대로 즐길 수 있게 무한 스크롤을 구현해보자. 페이.. 2024. 6. 10. Node.js 무중단 서비스 ( 배포 ) React .. 드디어 일반 가상환경 서버에서 배포하였다 !!! Node 서버를 빌리려 했는데 ... 생각해보니까 개발 서버인 로컬에서도 노드서버 환경 구축으로 인해 할 수 있었던것 아닌가 !!그래서 그냥 빌렸던 일반 가상서버에 node 환경을 구축하였다 그리고 React 를 띄우는데 성공하였지만 ....React Server 인 node 부분에서는 .jar 파일 , Tomcat 등 무중단 서비스를 할 수 있는 방법이 무엇인지 몰라서 찾아보았다. pm2.... 아주 유용하면서도 중요한 부분이였다.. https://inpa.tistory.com/entry/node-%F0%9F%93%9A-PM2-%EB%AA%A8%EB%93%88-%EC%82%AC%EC%9A%A9%EB%B2%95-%ED%81%B4%EB%9F.. 2024. 6. 9. React 새로고침 데이터 저장 리액트 작업 중 회원가입 페이지에서 새로고침했을때 기존에 input 태그에 입력했던 정보들이 전부 없어져버렸다.Redux 를 사용하고 있어서 새로고침되면 자동으로 저장되어 기존 데이터를 유지할 줄 알았는데 그게 아니였다.원래 새로고침시 특정 조치를 취하지 않는 이상 데이터가 휘발되어 버린다... persistance .. 단어 부터 영구적이다 Redux persistance 적용 후 원하던 대로 기능이 작동되었다. 새로고침해도 필요한 데이터는 남아있게 되었다. https://choyeon-dev.tistory.com/14 [Redux-persist] 새로고침에도 유지되는 store (with Redux-toolkit)🤔 1. redux-persist를 사용한 이유 프로젝트 중 로그인 기능을 구현하는데.. 2024. 6. 9. React 코드 난독화.. 정보가 아주 중요해진 부분 코드까지도 보안적인 부분에서 허점이 있을 수 있다..크롤링 경험이 있는 나에겐 아주 유용했다.. 개발자모드... 그래서 이러한 경험으로 인해 코드를 아예 보지 못하도록 하고 싶었다. 예전엔 javascript 로 했을때 js 파일 각각 난독화 사이트에서 난독화를 진행한 적이 있는데 .... 참... 리액트에서는 간단하게 package.json script 파일만 만져주면 바로 가능하다... 프로덕션 기준으로 적용이 된다. https://velog.io/@hazel123/%EC%86%8C%EC%8A%A4-%EC%BD%94%EB%93%9C-%EB%82%9C%EB%8F%85%ED%99%94code-obfuscation 소스 코드 난독화(code obfuscation)우선 코드난독화에.. 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. Node.js Typescript 적용 리액트 작업은 타입스크립트로 진행하고 있다. 하지만 같은 자바스크립트 계열의 노드에서는 일반적인 js 를 사용하고 있어서 혹시나 여기도 리액트 처럼 타입스크립트를 적용해서 사용할 수 있을까 해서 찾아보았다. 노드js+타입스크립트 환경설정https://myung-ho.tistory.com/94 [node.js] node.js + typescript 실행환경 세팅하기node.js를 사용할 사이드 프로젝트 아이디어가 생각이 나지 않아 일단 개발 서버 환경부터 만들어 두려고 한다. Node.js 설정 0. Nodejs란 Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니myung-ho.tistory.com 우선 위의 참조사이트대로 작업을 하였고 현재 노드js 도 .. 2024. 6. 9. 이전 1 2 3 다음 "이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다." 728x90