Over the limit

DOM? - Document Object Model. HTML, XML 문서의 프로그래밍 interface - 웹 페이지의 객체 지향 표현 - 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할 -> 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다. - 자바스크립트와 같은 스크립팅 언어로 DOM을 수정할 수 있음 RN vs React - RN에서 라이프 사이클은 웹에서의 렌더링과 같지만 렌더링 절차는 조금 다르다. 브릿지에 의존하기 때문. - 브릿지는 JS코드를 통해 네이티브 계층과 통신하는 역할을 한다. JS스레드(=JS코드가 실행되는 장소)정보를 받아 네이티브에 전달한다. 네이티브를 담당하는 ..

잘 살아있는 API를 데려올테다 먼저 useEffect로 axios 내용을 가져오면 콘솔에 다음과 같이 찍힌다. 이름만도 잘 찍힌다. 상태 유지 관리를 용이하게 하기 위해 useState + useEffect + async 형식으로 변경하자 첫 줄 useState({})를 useState(false)로 적어둬서 뻘짓 엄청함... 배열로 주고 받기 때문에 괄호 안 값 신경쓰자 역시 콘솔에 잘 뜸. 이제 다른 컴포넌트로 props 넘겨서 정보 받아오자

가운데 정렬 하겠다고 margin-left, right로 땜빵X.. 모든 화면의 환경과 픽셀은 다르기 때문에 절대 언제보나 중앙 정렬로 안나온다. 이럴 땐 부모 div와 자식 div 를 활용하자 //RecommendedList.js //내용 //RecommendedList.module.css .parent{ display: flex; } .child{ margin: auto auto; } 편 ㅡ 안 다음과 같이 창을 줄여도 가운데 정렬이 잘 따라온다.

버튼을 누를 때마다 해당 값에 알맞는 JSON 데이터를 가져와서, 원하는 자리에 채워넣고 싶음 +) 참고로 JSON 형식 지켜가면서 하기.. https://jsoneditoronline.org/#left=local.mateyi&right=local.qagaku JSON Editor Online: JSON editor, JSON formatter, query JSON You need to enable JavaScript to run this app. News Mobile-friendly 2022-08-29 The JSON Editor Online application is now mobile-friendly, you can enjoy it on smaller screens and touch devices ..

useEffect() React component가 렌더링 될 때마다 특정 작업을 실행할 수 있도록 하는 리액트 Hook 0. 기본 형태 useEffect(function, deps) function : 실행하고자 하는 함수 deps : 배열 형태, function을 실행시킬 조건 -> 해당 조건에 맞는 값이 업데이트(=mount) 될 때 useEffect를 실행한다. +) 컴포넌트가 - 마운트 됐다 = 처음 나타났다. - 언마운트 됐다 = 사라졌다. - 업데이트 됐다 = 특정 props가 바꼈다. 1. Component가 Mount 되었을 때(나타날 때) useEffect(() => { console.log("렌더링 될 때마다 실행"); }); deps 부분을 생략했다. 어떤 빈 배열도 들어가지 않은 ..

onClick을 통해 버튼이 눌리면 상태가 변하기 때문에, 이 부분에서 useState를 활용한다. style변화는 getElementById를 사용해서 id 값으로 눌린 버튼을 찾고, 그 위에 스타일을 바로 적용해준다. const Navigator = () => { const [currentClick, setCurrentClick] = React.useState(null); const GetClick = (e) => { setCurrentClick(e.target.id); }; React.useEffect{ (e) => { if (currentClick !== null) { let current = documnet.getElementById(currentClick); current.style.color..

@MappedSuperclass 프로그래밍 기능상 부모의 기능과 같다. 부모 클래스에 선언하고 속성만 상속 받아서 사용하고 싶을 때 사용한다. 공통 매핑 정보가 필요할 때 사용함. 객체의 입장만 고려하므로 DB 테이블과는 상관 없다. https://www.inflearn.com/course/ORM-JPA-Basic

MariaDB를 다운 받고 https://mariadb.org/ MariaDB Foundation - MariaDB.org … Continue reading "MariaDB Foundation" mariadb.org 터미널을 켜준다. show databases; 를 통해 현재 존재하는 db를 확인 database 말고 databases라고 써야함! create database db이름; create database review_service; use 사용할 db; use review_service; https://blog.naver.com/pjok1122/221539169731 [MySQL] 테이블 만들기,수정하기 (Create table, Alter table) 1. DATABASE MySQL 테이블을..

redux-thunk, redux-promise 설치 redux-thunk 어떻게 function을 받을 지 알려줌 redux-promise 어떻게 promise를 받을 지 알려줌 이 둘 없이 redux를 사용하면 에러가 많이 나게 됨 index.js 에서 redux 연결시키기 //index.js .. import {Provider} from 'react-redux'; ReactDOM.render( .. middleware 적용 //index.js .. import {Provider} from 'react-redux'; import promiseMiddleware from 'redux-promise'; import ReduxThink from 'redux-thunk'; const createStoreWi..

Props 소통 방식 : 부모 컴포넌트 -> 자식 컴포넌트 컴포넌트간에 무언가 주고 받으려면 prop이 필요하다 immutable. 변하지 않는다. 자식 컴포넌트의 값이 바뀌려면 부모 컴포넌트에서 다시 값을 내려줘야 바뀜 State 소통방식 : 컴포넌트 안에서 데이터를 전달함. mutable. state가 변하면 re-render가 된다. Redux가 상태를 Redux store에 저장해서 바로 action이 접근할 수 있게끔 해준다. 참고> https://xean.tistory.com/89 Redux 사용의 기본 Redux 사용 이유는? 1. props 전송 없이 모든 컴포넌트가 데이터를 바로 꺼내쓸 수 있도록 하려고 2. reducer, dispatch 함수로 state 데이터 관리를 용이하게 하려고..