목록Programming/React (16)
2swan
App.js import './App.css'; import {BrowserRouter, Route, Routes} from "react-router-dom" import Navigation from './Navigation'; import Home from './components/Home'; import Contact from './components/Contact'; import Topics from './components/Topics'; import Login from './components/Login'; import Topics1 from './components/Topics1'; import LoginResult from './components/LoginResult'; import Top..
App.js import {BrowserRouter, Route, Routes} from "react-router-dom" import './App.css'; import Home from './routers/Home'; import About from "./routers/About"; import Navigation from "./components/Navigation"; import Poster from "./routers/Poster"; import Detail from "./routers/Detail"; function App() { return ( ); } export default App App.css * { box-sizing: border-box; } body { margin: 0; pad..
App.js import {BrowserRouter, Route, Routes} from "react-router-dom" import './App.css'; import Home from './routers/Home'; import About from "./routers/About"; import Navigation from "./components/Navigation"; function App() { return ( ); } export default App; App.css * { box-sizing: border-box; } body { margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, ..
BoardController @RestController public class BoardController { @Autowired private BoardService boardService; //추가 //@PostMapping("insert") //public void insert(@RequestBody Board board) { //boardService.insert(board); //} //추가(입력 2 방법 때문에 이렇게 수정) @PostMapping("insert") public Board insert(@RequestBody Board board) { boardService.insert(board); return board; } //전체보기 @GetMapping("list") public Li..
App.js import BoardForm from './BoardForm'; import BoardList from './BoardList'; import {useEffect} from "react" import axios from "axios" import {useState} from "react" import './App.css'; function App() { const [listContent, setListContent] = useState([]) useEffect(()=>{ listBoard() },[]) //추가(Form.js 입력2 방법) const insertBoard = (data)=>{ //data는 추가된 내용 console.log(data) axios.post('insert',{ ..
BoardController @RestController public class TodoController { @Autowired private TodoService todoService; //전송 @PostMapping("todo/insert") public Todo insert(@RequestBody Todo todo ) { return todoService.insert(todo); } //전체보기 @GetMapping("todo/list") public Listlist(){ return todoService.list(); } //삭제 @DeleteMapping("todo/delete/{num}") public void delete(@PathVariable Long num) { todoService...
App.js import './App.css'; import BoardForm from './BoardForm'; import BoardList from './BoardList'; import {useEffect} from "react"; import axios from 'axios'; import {useState} from "react"; function App() { const [listContent, setListContent] = useState([]) useEffect(()=>{ listBoard() },[]) //추가(Form.js 입력2 방법) const insertBoard = (data)=>{ //data는 추가된 내용 console.log(data) axios.post('/api/in..
App.js import logo from './logo.svg'; import {Component} from "react"; import './App.css'; import CommentList from './CommentList'; import TodoListTemplate from './component/TodoListTemplate'; import Form from './component/Form'; import TodoItemList from './component/TodoItemList'; import NotificationList from './NotificationList'; class App extends Component { state = { id : 4, input : '', todo..
App.js import { Component } from 'react'; import './App.css'; import PhoneList from './component/PhoneList'; import PhoneForm from './component/PhoneForm'; class App extends Component { id = 2; state = { information: [ { id : 0, name:"홍길동", phone:"010-1111-1111" }, { id : 1, name:"이순신", phone:"010-2222-2222" } ] } //추가(기존 값에 추가) handleCreate= (data) =>{ console.log(data) const {information} = th..
App.js import logo from './logo.svg'; import './App.css'; import Device from './Device'; import Counter from './Counter'; import Food from './food'; import Movie from './Movie'; import Counter2 from './Counter2'; import MyDevice from './MyDevice'; import MyDevice1 from './MyDevice1'; import MyDevice2 from './MyDevice2'; function App() { const mydataApp={ "myDeviceData":[ { name:"갤럭시1", RAM:10, H..
App.js import React, {useState} from "react"; const Counter = ()=>{ const [number,setNumber] = useState(0) const onIncrease =()=>{ setNumber(number+1) } const onDecrease =()=>{ setNumber(number-1) } const Change = (num)=>{ setNumber(number + num) } return( {number} +1 -1 Change(1)}>1증가 Change(-1)}>1감소 ) } export default Counter; Child.js const Child =({comment})=>{ return( comment : {comment} ) ..
App.js import './App.css'; import Counter from './Counter'; import InputSample from './InputSample'; import InputTest from './InputTest'; import Parent from './Parent'; import Say from './Say'; function App() { return ( ); } export default App; Counter.js import React, {useState} from "react"; const Counter = ()=>{ const [number,setNumber] = useState(0) const onIncrease =()=>{ setNumber(number+1..