728x90
반응형

HTML 3

[로그인 기능 만들기] 6. website login-form 만들기(2)

thymeleaf를 spring boot에서 이용해 다루는 법을 지난번에 테스트 해봤으니, 이번에는 진짜 내가 쓸 form까지 만들어보자. 우선, 전과 같이 controller 패키지에 loginController.java를 추가한다."localhost:8080/main" 에 접속하면 웹사이트의 메인 페이지가 뜨고,"localhost:8080/login" 에 접속하면 로그인 창이 뜨게 된다. (디자인은 크게 신경쓰지 않고 만들었다는 점...!)1. Main Page, Login Page Controllermain으로 접속하면 위와 같이 메인 페이지로 접속된다.여기서 login 버튼을 만들어 login page로 넘어가게 만들 예정이다.2. Login button(page 이동)로그인 버튼을 만들기 위해서..

개발/Spring Boot 2024.05.24

[로그인 기능 만들기] 5. website login-form 만들기(1)

맨 처음, 로그인 기능을 만드는 방법은 크게 두 가지를 언급했다.첫번째는 spring boot 자체에서 로그인 기능을 구현하는 방법.두 번째는 OAUTH를 사용해 외부 로그인 api를 활용하는 방법. 우선, 첫 번째 방법으로 구현할 생각이다.(둘다 해보긴 할거임!)spring boot 자체에서 로그인 기능을 구현하는 방법도 크게 두 가지로 나뉜다. 먼저, JWT을 이용하는 방법. 이건 복잡하지만 활용성이 높은 것 같다.다음은, spring security를 이용하는 방법. 우선은 이게 쉬워보여서, 이걸 한 후 이해도를 높여서 JWT도 해볼까 싶다. 이걸 하기 전에, 간단하게 html로 웹 사이트에서 아이디 비번 제출하여 로그인하는 란을 만들고,메인 화면과 이것저것..추가해보려 한다. spring boot..

개발/Spring Boot 2024.05.23

[백엔드 개발자의 프론트 도전기] 6. props 2 - children

props에 대해서는 https://jyejye311.tistory.com/105에서 설명하였다. props로는 특정 값 뿐만 아니라 HTML을 넘기는 방법도 있다. 이전에 사용한 코드에서 일부만 수정하여 html을 props로 넘겨보았다. 우선, 부모 컴포넌트는 다음과 같다. 더보기 import './App.css'; import { useState } from 'react'; import ChildApp from './ChildApp'; function App() { // count라는 state와 count의 setter를 동시에 정의하는 과정 const [count, setCount] = useState(0); // up 버튼 클릭했을 때 동작하는 함수 const onClickUpCount = (..

개발/React 2023.12.13
728x90
반응형