My Daily

처음 리액트 프로젝트 생성했을땐 그냥 npx create-app my-app 으로 진행해서 타입스크립트가 적용이 안된채로 타입스크립트 환경설정을 해주었다. 하지만 지금 새로운 프로젝트를 생성할 필요가 느껴져서 다시 찾아보려 하니 익숙했던 부분이 익숙치가 않아져서 불편했다. 그래서 이 사이트를 우선 참조했다 https://velog.io/@defaultkyle/react-with-ts-1 [Study] React _ TypeScript 적용하기 #1이번주차 스터디 공유물로 리액트에 점진적으로 TypeScript를 적용하는 방법에 대해서 알아보겠습니다. create-react-app을 이용해서 리액트 어플리케이션을 만든다면, TypeScript + React 환경을 쉽게 구축velog.io  그리고 기존에 ..

리액트 클라이언트에서의 코드이다. 소켓 연동을 위해 useEffect 처음 mount 시 진행되도록 작업해놨다. 채팅 혹은 WebRtc 를 위해서 작업하던 중... Node 서버에서 어떻게 작업해야 하는지 감이 안잡혀서 검색해보았다. 서버 작업 후 클라이언트 작업을 한 것이여서 이미 완료된 상태이다.서버작업시 , 참조한 사이트이다. https://smaivnn.tistory.com/2 [node.js] socket.io 예제와 정리Socket.io 이란? socket.io를 알아보기 전, 웹 소켓에 대해 먼저 알아보자. 웹 소켓은 HTML5에 새로 추가된 실시간 양 방향 데이터 전송을 위한 기술이다. http가 아닌 ws프로토콜을 사용하며, 따라서 브라smaivnn.tistory.com  https://..

리액트에서 페이징 처리를 해야하는 상황이였다...주로 앱을 작업하였기 때문에 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로 무한 스크롤을 구현해보자강아지를 무한대로 즐길 수 있게 무한 스크롤을 구현해보자. 페이..

redis noSQL 에서 데이터들을 fields 기준으로 정렬하고 싶었다..redis-cli --raw 로 해서 이것저것 해도 안돼서 구글링 하였다...  Redis -cli 정렬 redis-cli --raw HGETALL personList | paste - - | sort -k1,1n 아주 좋다!!personList 필드는 숫자로 되어 있기에 오름차순으로 정렬되어 보여졌다  쉽게 볼수 있겠군...

Chmod 설명https://recipes4dev.tistory.com/175 리눅스 chmod 명령어 사용법. (Linux chmod command) - 리눅스 파일 권한 변경.1. 리눅스 파일 사용 권한 리눅스에서, 파일(File)을 사용해 할 수 있는 작업은 크게 세 가지로 나눌 수 있습니다. 파일에 저장된 데이터를 읽기. (r = read). 파일에 데이터를 쓰기. (w = write). 파일 실recipes4dev.tistory.com  Vim 명령어https://hong00.tistory.com/79 [linux] vi 전체 삭제, 복사 / 선택 삭제, 복사 / 붙여넣기 / 되돌리기vi 편집기로 전체 삭제는 다음과 같이 할 수 있다. 전체 삭제 전체 삭제 방법 1 gg // 첫번째 줄로 이동 ..

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..

리눅스 centos 7 카페24 가상환경 서버에서 py 파일을 실행하려고 했더니 print(f"{}"); 이 코드가 인식을 못하는것이다 .... 두둥...왜지 보니 3.6 이상부터 인식이 된다고 한다..   그래서 현제 python -V 로 확인해보니 2.7.5 라서 업그레이드 필요성을 느꼈다.. https://tech.zinnunkebi.com/all-about-os/all-about-linux/upgrade_python27to36/ Linux CentOS7 Python 2.7.5에서 3.6으로 Version Up하기CentOS 7.x에서는 Python 2.7.x가 기본으로 설치 되어 있는 경우, Python 프로그램을 작성할 때 상위 버전인 Python 3.x가 필요하다면 yum 명령을 사용하여 Py..

리액트 작업 중 회원가입 페이지에서 새로고침했을때 기존에 input 태그에 입력했던 정보들이 전부 없어져버렸다.Redux 를 사용하고 있어서 새로고침되면 자동으로 저장되어 기존 데이터를 유지할 줄 알았는데 그게 아니였다.원래 새로고침시 특정 조치를 취하지 않는 이상 데이터가 휘발되어 버린다... persistance .. 단어 부터 영구적이다 Redux persistance 적용 후 원하던 대로 기능이 작동되었다. 새로고침해도 필요한 데이터는 남아있게 되었다.  https://choyeon-dev.tistory.com/14 [Redux-persist] 새로고침에도 유지되는 store (with Redux-toolkit)🤔 1. redux-persist를 사용한 이유 프로젝트 중 로그인 기능을 구현하는데..

정보가 아주 중요해진 부분 코드까지도 보안적인 부분에서 허점이 있을 수 있다..크롤링 경험이 있는 나에겐 아주 유용했다.. 개발자모드... 그래서 이러한 경험으로 인해 코드를 아예 보지 못하도록 하고 싶었다. 예전엔 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)우선 코드난독화에..

Node.js 에서 Jwt 로 인증토큰을 컨트롤 하여 로그인 및 다른 api 통신 관련해서 인증기능을 추가 하고 싶었다. 이젠 기본이 되는 보안 기술중 하나로 당연히 적용해야할 부분이라고 느꼈다. https://velog.io/@hoonnn/NodeJS-JWT%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-%EB%A1%9C%EA%B7%B8%EC%9D%B8-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0 NodeJS (JWT를 이용한 로그인 구현하기)첫번째 프로젝트를 진행했을 당시, 백엔드를 담당하였고 그 중 User와 Admin 관련 기능을 구현하게 되었다. User 기능 중 가장 기본이 되는 로그인과 로그아웃 방식을 JWT 토큰을 활용한 방식으로 구velog.io ..