프로그래머처럼 생각하기

https://lemontia.tistory.com/912 [react, springboot] react 와 spring boot 로 구성하기, 묶어 build 하기 Springboot 프로젝트를 생성한다. 여기서는 Intellij 를 이용해 생성했고, Gradle과 Java 버전 11을 사용했다. 이 과정은 생략하겠다. ​ ​ react를 설치하는 방법은 다양하지만 여기서는 Create react app 을 lemontia.tistory.com

https://kojoo112.tistory.com/entry/React-%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0 React 시작하기 📕 React는 무엇일까? 컴퓨팅에서 리액트(React, React.js 또는 ReactJS)는 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다. 페이스북과 개별 개발자 및 기업들 공동체 kojoo112.tistory.com 기본적으로 React 앱 만드는 방법입니다. 앱을 만드셧으면 https://react-bootstrap.github.io/ React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io ..

지금 스프링부트 프로젝트 진행하면서 백엔드는 얼추 정리된거같아서 프론트작업을 하고있는데 이왕 프론트 하는거 html, css, javascript말고 새로운 React로 하는게 재밌을거같아서 시작하게 됐습니다. 또 그냥 React보다 bootstrap과 합치면 재밌을거같아서 검색해봤는데 두개가 다르더라구요. https://stackoverflow.com/questions/56061590/what-is-difference-between-reactstrap-and-react-bootstrap What is difference between reactstrap and react-bootstrap? I found two different bootstraps for reactjs npm install --save..

동적인 값 할당을 하기 위해선 useState를 해야합니다. 전에 했던 let data = '데이터'; . . . { data } 에서 data = '데이터123';으로 변경하면 새로고침을 해야 값이 바뀌지만 useState를 한다면 새로고침없이 동적으로 화면이 변할수있습니다. function App() { let [사용하기, 변경하기] = useState('useState'); let data = '데이터'; let fontBlack = {color : 'black', fontSize : '50px'} return ( { 사용하기 } { data } { data } { data } { data } ); } 이렇게 useState를 사용할 수 있습니다. []대괄호 안에 왼쪽은 사용을 할수있는 메소드의 이..

📕 데이터바인딩(Data Binding)이란? 화면에 있는 객체와 데이터를 일치시키는 것입니다. data라는 변수에 '데이터'라는 변수를 담고 사용하는 방법은 중괄호 {} 사이에 해당 변수를 넣어주는 것입니다. 요런식으로 굳이 '데이터'라는 말을 쓰지않아도 '데이터'라는 글자를 볼 수 있습니다. 이것이 데이터 바인딩입니다. 근데 className?? 처음보지않나요? HTML에서는