본문 바로가기
반응형

전체 글169

5월 15일 React day07 복습 하.. 언제쯤 리액트가 이해가 될까... 순서순서 day07프로젝트 만들기 src 밑에 page01 폴더 만들기 --> 기존 component 폴더를 만든 것과 같음 흔히 말하는 페이지 이동 기능을 리액트에서는 "리액트 라우터" 를 통해 처리해보고자 한다. 1. 라우팅이란? - 간단하게 생각 하자면 사용자가 요청한 URL에 따라 해당 URL에 맞는 페이지를 보여주는 것이라고 생각할 수 있다. - 리액트에서는 라우팅 관련 라이브러리가 많이 있는데, 이중 가장 많이 쓰이는 리액트 라우터(React Router)를 사용해보려 한다. 리액트는 SPA (Single Page Application) 방식 - 기존 웹 페이지 처럼(MPA 방식) 여러개의 페이지를 사용, 새로운 페이지를 로드하는 방식이 아니다. - 새.. 2023. 5. 15.
5월 11일 react 수업들 day04-05 day04 Todos~ Todo로 된 모든 파일들! day05 Test01~04 Test 01) //1번 인터넷 사이트 가서 많은양의 데이터를 다 가지고 들고 오고 싶으면, 딱 한번만 가능 useEffect(() => { fetch('https://jsonplaceholder.typicode.com/posts') .then(res => res.json()) //응답을 받으면 json형태로 받겠다는 것 .then(res => setData(res)) }, []) 부연 설명 : 이 코드는 fetch 함수를 사용하여 JSONPlaceholder API에서 데이터를 가져오고 setData 함수를 사용하여 해당 데이터를 상태로 설정합니다. useEffect 훅은 마운트 시 한 번만 실행됩니다. fetch 함수를 .. 2023. 5. 11.
5월 10일 React day03-Test08~11 day03 Test08 강아지 사진들 다운로드 받은거 로드 시키기 파일들이 굉장히.. 굉장히 많음 Test09 사진 import하는 다른 방법 Test10 Test11 약관 동의 하는방법 전체 선택, 전체 해제, 전체해제에서 일부 선택되면 약관동의 체크박스가 자동 해제 되는 법 day04 Test01 Teset02 x축과 y축 나오는 것 뭔지는 잘 모름 2023. 5. 10.
5월9일 React day03 의 test4-7 day03 Test01 사용되는 Hook - useRef /* Hooks - useRef - JavaScript 를 사용 할 때에는, 우리가 특정 DOM 을 선택해야 하는 상황에 getElementById, querySelector 같은 DOM Selector 함수를 사용해서 DOM 을 선택한다. 리액트에서는 직접 DOM 요소에 접근해야 할 때, useRef 훅을 사용하여 DOM 요소에 직접 접근이 가능하다. - useRef 훅이 반환하는 ref 객체를 이용해서 자식 요소에 접근이 가능하다. 리액트 컴포넌트는 State가 변할 때마다 다시 렌더링이 되면서 컴포넌트 내부 변수들이 초기화 된다. 하지만 Ref안에 있는 값은 아무리 변경해도 컴포넌트는 다시 렌더링 되지 않는다. *** 값이 고정되어 있어서 유.. 2023. 5. 10.
어느 카테고리에 넣어야 하는지 모르는.... react 전 사전...지식..? 오전 Spring Boot에 대해 설명과 설치 및 롬복까지 배웠다. 솔직히 복습 안하고 잘려고 했는데 안하면 또 나만 힘들겠지.. 싶어서 침대에 누워있다가 급 일어나서 정리한다. 템플릿 리터럴(javascript) javascript에서 backtick(`) 문자를 사용하여 문자열을 표현한것을 템플릿 리터럴이라고 한다. 이렇게 사용하면, 두가지 기능이 있는데 (1)줄바꿈을 쉽게 할수 있고, (2)문자열 내부에 표현식을 포함할 수 있게 된다. 일반 문자열 사용시 아래와 같이 표현되어야 하는 것을, 일반 문자열 사용 예시 템플릿 리터럴을 사용하면 아래와 같이 간단하게 표현할 수 있다. 템플릿 리터럴 사용 예시 (1) 줄바꿈 기호(\n)을 쓰지 않고 코드에서 그냥 줄을 바꾼것 (2) (a + b)라는 표현식을.. 2023. 5. 10.
5월 9일 SpringBoot 수업 Chapter04_JPA project :Chapter04_JPA 1.pom.xml 2.application.properties 3.Main 클래스 4.JSP지원하지 않음 => EclipseMarketㅁPlace =>타임리프 x , 리액트 또는 뷰 ▶ pom.xml에 apache.tomcat 그리고 javax.servlet을 추가해준다. ▶ package com.example.demo; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.boot.autoconfigure.domain.EntityScan; import or.. 2023. 5. 9.
728x90
반응형

티스토리툴바