React
1.[231226] Spring/ @RequestBody, NoticeController & RestNoticeController, Model, POJO 비교, React-Spring소스리뷰
Spring을 통한 MVC 패턴 적용하기1\. 컨트롤 계층@Controller: jsp 페이지 처리할 때 ( 정적페이지와 같이 - html, js, css) - 원시적인 방법: jstl 사용할 때 - 2015년까지@RestController: json형식으로 페이지 처
2.[React] State & LifeCycle, Hooks, Handling Events, Conditional Rendering, List and Keys
state & LifeCycle은 주로 클래스 컴포넌트와 관련됨.리액트의 핵심 중 핵심!!!리액트 Component의 상태 = 리액트 Component의 데이터= 리액트 Componenet의 변경 가능한 데이터state는 사전에 미리 정해진 것이 아닌 React 컴포넌
3.[React] JSX, 렌더링 엘리먼트, Components, Props
js : javascriptx : 자바스크립트의 확장 문법javascript + XML/HTMLReact의 createElement() 함수역할 : 내부적으로 XML, HTML 코드를 javascript로 변환하는 과정을 거침. 최종적으로 jsx코드에서javascrip
4.[React] Quill 추가하기(1)/ Front(reduxDemo)-Back(springDemo2) 프로젝트 환경설정, 코드 추가
파일 업로드를 위해 uploadPath, servlet 추가uploadPath: C:\\Users\\SeulGi\\Desktop\\Developer\\project\\project_gym\\springDemo2\\src\\main\\webapp\\pds\\http&#
5.[React] Quill Editor(2) 첨부파일, CORS 에러 해결
BoardController에 있던 imageGet을 이전함.imagUpload 추가https://inpa.tistory.com/entry/WEB-%F0%9F%93%9A-CORS-%F0%9F%92%AF-%EC%A0%95%EB%A6%AC-%ED%95%B4%EA%
6.[React] 240125 Quill(3) 첨부파일 추가
아래 코드를 사용해야 새로고침이 발생하지 않고 사진 첨부 후 추가로 사진 첨부했을 때 이전 사진첨부 파일이 사라지지 않고 누적된다.
7.[React] 240130 JSX, Babel, JSX vs HTML, div vs fragment, Element, Render
Babel은 자바스크립트 빌드를 가능하게 해준다.ES5같은 하위버전에서도 동작하도록 바벨을 추가하였다.CDN 방식 : 로컬PC 캐쉬 사용함 - 시스템 사용 발생으로 속도가 느리다.unpkg방식 : 네트워크를 통해 객체 주입 - 속도가 빠르다.React는 별도의 파일에
8.[React] 240131 JSP->React Refactoring, webpack, NEXT.JS, JSX와 JS 섞어쓰기
npm init -y : package.json이 생성됨React Framework이다.charAt을 사용한다.삼항연산자 사용반복문은 사용하지 못 함아래와 같이 구조 변경해보기
9.[React] 240205 Rendering(렌더링), 리렌더링
렌더링과 리렌더링 > 재조정(Reconciliation) > useMemo, useCallback > 메모이제이션SPA - 동기화: 왼쪽에 화면 바뀌면 오른쪽 화면도 즉시 바뀌는 것이 반영된다리액트 -> NextJS최후의 수단으로 배열의 인덱스를 key로 사용할 수 있
10.[React] 240206 Side-Effect( 사이드 이펙트) - useEffect
사이드 이펙트 = 부작용사이드 이펙트란 React 자체에서 제공하지 않는 모든 것이다.fetch() 메서드, Local Storage, document.querySelector('클래스명), setTimeout, setInterval위의 작업들은 브라우저의 Web AP
11.[React] Render와 SPA란?
React에서의 Render와 SPA (Single Page Application) 개념Render의 개념Render는 React에서 컴포넌트를 사용자 인터페이스(UI)에 표시하는 과정을 말합니다. React의 핵심 기능 중 하나로, Virtual DOM을 사용하여 효
12.[React] 서버에 React 프로젝트 배포하기
npm run buildscp -r ./dist/\* 서버계정@192.168.10.12:/var/www/html/폴더명바로 옮기면 됩니다.scp -r ./dist/\* 서버계정@서버host:~/react-temp/원격 서버에서 특정 디렉토리에 파일을 업로드할 때 해당
13.[stompjs] this.debug is not a function 문제 해결
리액트에서 @stomp/stompjs 라이브러리로 웹소켓을 구현하는 도중 개발자도구 콘솔에서 this.debug si not a function이라는 에러가 발생했다.이 에러는 라이브러리 내부에서 debug 속성을 함수로 예상했지만 실제로는 함수가 아닌 다른 값이 들어