react(11)
-
20240413 firebase 설치 및 react 웹 구현
https://velog.io/@e_juhee/Firebase-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C%EC%97%90%EC%84%9C-DB-%EB%8B%A4%EB%A3%A8%EA%B8%B [Firebase] 프론트엔드에서 DB 다루기 \[Firebase Docs]규모가 커지면 보안 등의 문제가 생긴다.규칙에서 보안처리를 하는데, 이 부분을 설정하기가 조금 까다롭다.간단하게 서비스를 만들거나 테스트 서비스 검증용으로는 좋은 선택이 velog.io DB를 다운 받기 전에 먼저 firebase 에 가입 - 보통 구글 아이디가 있으면 쉬움 firebase에 가입하면 #API 코드 - 회원가입과 동시에 보여줌 (바로 복사해서 붙여넣어야 함) // Import the fu..
2024.04.14 -
20240412 React Couple Diary - Personal Project ver.1
import React from "react"; import Stack from '@mui/material/Stack'; import { pink } from '@mui/material/colors'; import SvgIcon from '@mui/material/SvgIcon'; function HomeIcon(props) { return ( ); } export default function Home({ user }) { return ( LoveBridge LoveBridge dairy album calendar setting ) }; home.jsx import React from "react"; export default function NotFound() { return ( Page Not Fo..
2024.04.12 -
20240405 react Springboot 만들기
USE abbs; INSERT INTO hamburger VALUES (1, '불고기버거', 2500, '살아있는 불향을 맛보고 싶다면!'), (2, '새우버거', 2700, '팔딱팔딱 숨쉬는 새우의 향연!!'), (3, '빅맥', 3000, '오로지 빅맥만 먹는 매니아를 위한 버거!'), (4, '와퍼', 2800, '작고 소중한 버거!'), (5, '휠렛버거', 3100, '휠렛휠렛 소리가 절로 나는 버거!'), (6, '슈슈버거', 3500, '슈비두밥바 새우가 춤추는 버거!'), (7, '슈비버거', 3700, '슈비두밥바 새우와 고기가 춤추는 버거!'), (8, '한우버거', 3800, '한우는 전설이다!'), (9, '싸이버거', 3100, '싸이처럼 춤추게 되는 버거!'), (10, '징거버..
2024.04.05 -
240402 react exam
import React, { useState } from "react"; import Button from 'react-bootstrap/Button'; import 'bootstrap/dist/css/bootstrap.min.css'; // 부트스트랩 CSS 파일 추가 export default function Count() { const [count, setCount] = useState(0); const handleIncrement = () => { if (count { setCount(1); // 카운트 리셋 }; return ( {count} 증가시키기 리셋 ) } import React, { useState } from "react"; import Button from 'react-bootst..
2024.04.02 -
20240328 react
리액트는 참 신기하다. 내가 수정하는 코드가 바로바로 동기화가 된다! 짠! 아주 부드러운 변화는 대부분 리액트라고 하셨는데 정말 그렇다. 나는 리액트를 맛보고 코딩이 즐거워졌다 ^^ 신기신기~~>. { const [displayValue, setDisplayValue] = useState(''); const [result, setResult] = useState(''); const handleClick = (value) => { if (value === '=') { calculate(); } else if (value === 'C') { clearDisplay(); } else { setDisplayValue(prevValue => prevValue + value); } }; const calculate..
2024.03.28