본문 바로가기

스프링부트를 이용한 웹페이지 만들기 도전!!

(15)
게시판 코드 깃허브 경로 https://github.com/haoun1/springboot-board GitHub - haoun1/springboot-board Contribute to haoun1/springboot-board development by creating an account on GitHub. github.com 이클립스버전 게시판코드 깃허브 주소입니다.
IntelliJ를 이용해서 스프링부트를 시작해보자!! (6) - Dto, Dao, Service 오늘은 아래 작업을 진행 할겁니다. 1. Dto와 Dao, Service를 작성 2. 회원가입 창 작성 3. 회원가입 창에서 id, pw, 성별을 입력하고 "확인"을 누르면 중복 id가 있는지 확인하고 없다면 DB에 추가하고 가입완료 alert출력 4. 가입되어있는 회원의 목록을 웹페이지내에 출력 간단하게 "회원가입" 기능을 만들어보겠다는 얘기입니다. 가장먼저 Dto, Dao, Service를 만들어 보겠습니다. 맨처음에 설명했던걸 다시 설명하면 Dto는 Class 입니다. Data Transfer Object의 약자이죠. 이클립스 버전에서 설명할때는 UserDto와 BoardDto를 둘 다 사용했습니다. "회원"이라는 개념도 있고 "게시물" 이라는 개념도 있었기 때문이죠. 하지만, Board는 생략하고..
IntelliJ를 이용해서 스프링부트를 시작해보자!! (5) - css, javaScript 지난번에 DB연동을 마치고 기본 html페이지를 띄워보는 것 까지 진행했습니다. 이번에 할 일은 이 페이지에 스타일(css)을 적용시켜보고 이벤트를 연결시켜보고 (javaScript) 파라미터를 서버와 주고받아보는 작업(타임리프) 입니다. 먼저, css와 자바스크립트는 사용하는 방법이 3가지가 있습니다. 첫번째는 html의 로 미리 정의해놓고 사용하는 방법입니다. Internal Style Sheet라고 합니다. Hello World!! Time alert 이렇게, 미리 정의해놓은 내부이 스타일이 body의 내용들에 반영되는걸 알 수 있습니다. 두번째는 Inline Style Sheet입니다. 가장 기본적인 적용 방법으로 Hello World!! 같이 실제 엘리먼트 내부에 삽입해서 사용하는 방법입니다. ..
IntelliJ를 이용해서 스프링부트를 시작해보자!! (4) - 창띄우기 이번 포스팅에서 진행할 내용은 컨트롤러를 작성하고, DB와 연동하고 home.html을 띄워보는 작업입니다. 먼저, 브라우저의 URL을 처리해서 View로 연결시켜주는 코드가 Controller라고 설명했습니다. Controller 클래스 파일을 만드는게 가장 먼저 해야하는 일입니다. @RequestMapping은 따로 method = RequestMethod.GET 이나 RequestMethod.POST 을 지정해주지 않으면 GET과 POST를 모두 처리하는 방식으로 동작합니다. GET만 처리하고 싶으면 @GetMapping("/") post만 처리하고 싶으면 @PostMapping("/")을 쓰면 됩니다. 화면에서 무언가를 받아오고 싶으면 GetMapping을 쓰면 됩니다. 지금 위의 코드는 아무 u..
IntelliJ를 이용해서 스프링부트를 시작해보자!! (3) - 프로젝트 구조 저번 포스팅을 따라서 프로젝트 생성을 완료하셨다면 이렇게 생긴 프로젝트가 만들어집니다. 다른건 볼 필요없고 src->main 폴더 아래의 java, resources 폴더와 pom.xml, application.properties가 중요합니다. java폴더는 dto, dao, Service, Controller같은 데이터 처리와 관련된 코드가 들어갑니다. resource폴더는 흔히들 아시는 jsp, html, css, javaScript같은 View에 관련된 코드가 들어갑니다. pom.xml은 dependency를 xml의 형태로 추가해주는 코드입니다. 1챕터에서 설명했던 것 처럼 코드를 열어보시면 따로 버전을 지칭해주는 부분이 없다는게 보이실겁니다. 물론 특정 버전을 지정해서 1.11 이런식으로 해줘도..
IntelliJ를 이용해서 스프링부트를 시작해보자!! (2) - 설치 및 프로젝트 생성 가장 먼저, 인텔리제이를 설치 해 보겠습니다. https://www.jetbrains.com/ko-kr/idea/ IntelliJ IDEA: 우수성과 인체 공학이 담긴 JetBrains Java IDE www.jetbrains.com 1. 인텔리제이 사이트에 들어갑니다. 2. "다운로드" 버튼을 누릅니다. 3. Ultimate 버전과 Community 버전이 있습니다. Ultimate버전으로 반드시 설치하셔야 합니다. (Community버전에는 스프링이 없습니다. 기본적인 자바 코딩만 가능한 버전이므로 무조건 Ultimate로 설치해주세요. Ultimate버전은 30일 무료이용기간이 있고 그다음부터는 유료 결제를 해야하는데, 대학교 이메일이 있는 학생 신분이라면 무료 라이센스가 나옵니다.) 4. 설치를 ..
IntelliJ를 이용해서 스프링부트를 시작해보자!! (1) 인텔리제이를 이용해서 간단한 페이지를 만들어보고 부트스트랩(css + js)를 띄워보는 작업을 진행해보겠습니다. 스프링과 스프링부트는 웹사이트 개발을 위해서 정해져있는 템플릿이라고 생각하시면 됩니다. 스프링부트는 스프링에서 개발자가 번거롭게 설정해주어야 하는 부분들을 해소해준 버전이라고 생각하면 됩니다. 예를들면, 우리가 만들어서 서버를 돌리려면 이전에는 톰캣을 따로 설치하고 버전을 맞추고 포트번호 지정하고.. 귀찮은 작업들을 많이 했어야 하는데 스프링 부트는 Embedded 톰캣을 가지고 있어서 그냥 실행 버튼만 누르면 내장되어있는 톰캣으로 자동으로 서버를 실행시켜주게 됩니다. 또한 가장 중요한점은 Dependency의 관리를 알아서 해준다는 점인데요, Dependency란 우리가 DB를 사용하거나 j..
SPRING BOOT를 이용한 나의 첫 웹페이지 제작 (8) - 회원가입 구현하기 (데이터베이스 연계) 저번 포스팅에서 회원가입을 하고 게시물을 조회하고 하는 화면을 jsp와 컨트롤러를 연계해서 만들어 보았다. 하지만, 지금까지의 상태로는 만들어진 웹 페이지가 db와 어떠한 연동도 하지 못하고 단순히 눈에 보이는 껍데기만 구현되어있는 상태인 것이다. 그러므로, 이번 포스팅에서는 껍데기에 이제 db와 연동하여 진짜로 id, pw등의 정보를 입력해서 회원가입을 진행하고 또한, 회원가입 되어있는 모든 사람의 정보를 조회하는 회원조회 창을 구현하고 id와 pw를 입력해서 해당 id의 dto에서 저장되어 있는 userPw와 입력한 pw가 같다면 db에서 삭제(회원탈퇴) 시키는 회원탈퇴 기능도 구현을 할 것이다. 사실 회원가입 만 구현하면 나머지는 비슷한 작업들의 연속이라 딱히 어려울게 없다. 그렇다면 지금부터 일단..