![]()
완성본 1. 총 3가지의 버튼을 생성하기 alert("버튼클릭")} type={"positive"} /> alert("버튼클릭")} type={"negative"} /> alert("버튼클릭")} type={"default"} /> 2. MyButton을 컴포넌트화 시켜주기 : 위에서 text , type , onclick 을 파라미터 변수로 받아줘서 * btnType = > positive,negative 이 아닌 다른 값이 들어오면 강제로 "default" 로 변경해주는 함수. * MyButton.defaultProprs = > type값이없으면 "default" 로 만들어준다. const MyButton = ({text,type,onClick}) => { // positive 나 negative 아..
![]()
1. React 기본 경로 위치 => /public/** 와 같은역할 const env = process.env; env.PUBLIC_URL = env.PUBLIC_URL || ""; import "./App.css" import {BrowserRouter, Route, Routes} from "react-router-dom"; import Home from "./pages/Home" import New from "./pages/New"; import Edit from "./pages/Edit"; import Diary from "./pages/Diary"; function App() { const env = process.env; env.PUBLIC_URL = env.PUBLIC_URL || ""; r..
![]()
1. Path Variable 이런식으로 디테일 화면으로 갈때사용한다.. const {id} = useParams(); // 전달받아서 모아서 객체 🐳 상세페이지 js import {useParams} from "react-router-dom"; const Diary = () => { const {id} = useParams(); // 전달받아서 모아서 객체 console.log(id) return ( Diary 이곳은 일기 상세 페이지 입니다. ); } export default Diary; 🐳 App.js import "./App.css" import {BrowserRouter, Route, Routes} from "react-router-dom"; import RouterTests from './c..
![]()
사용하기 1. 설치 npm npm install react-router-dom@6 🐳 App.js 로 돌아가서 import {BrowserRouter} from "react-router-dom"; 🐳 App.js 페이지 import "./App.css" import {BrowserRouter} from "react-router-dom"; function App() { return (
![]()
사용한 개발환경 * Spring_Boot 3.2.1 * Maria_db 8.xx (RDBMS) * Mybatis (Frame_Work) * LomBok * JAVA 17 * React App 생성 cd src/main npx create-react-app {프로젝트명} 위와 같이 리액트 앱이 실행되는 모습이 보인다. 나는 3000번 포트가 이미 사용중이어서 3001번으로 실행하였다. 아마 여러분은 localhost:3000으로 실행되었을 것이다. 프로젝트 연동 여기까지 잘 따라왔다면 React와 Spring Boot의 프로젝트가 각각 3000번과 8080번 포트에서 수행되는 모습까지 확인했을 것이다. 그렇다면 이제 두 프로젝트를 연동시켜보자. ⚡️ Proxy 설정 기본적으로 React 프로젝트는 3000..
![]()
#1. MariaDB 설치 및 설정 변경하기 1) MariaDB 설치하기 YUM Repolist 저장소에 MairaDB 추가하기 $ sudo vim /etc/yum.repos.d/MariaDB.repo [mariadb] name=MariaDB baseurl=http://yum.mariadb.org/10.4/centos7-amd64 gpgkey=https://yum.mariadb.org/RPM-GPG-KEY-MariaDB gpgcheck=1 MariaDB-server와 MariaDB-client를 설치한다. $ sudo yum install -y MariaDB-server $ sudo yum install -y MariaDB-client 설치작업이 완료되면 아래와같이 MariaDB의 설치가 잘 진행되었는지..
