My Tech Blog (프로그래밍언어)

1. 게시판 메인 페이지 `bbs.jsp`만들기먼저 `main.jsp` 페이지에서 게시판 부분 href 속성에 "bbs.jsp" 를 연결해준다.  `main.jsp` 페이지를 복사해서 webapp 에다 붙여넣기 하고 이름만 `bbs.jsp`로 바꾸자.여기서 코드에 손을 좀 볼 것이다. 만들었으면 `Home`에 있던 active 클래스를 `게시판`으로 옮겨 줘서 현재 선택한 페이지임을 가시적으로 보여 준다. 그 다음 네비게이션바 아래에 게시판 형식의 테이블을 삽입 해 준다.테이블을 만들기 전에  `` 태그로 container와 row 영역을 잡아 주고 테이블을 만들어주자.  번호 ..

자바스크립트 이벤트 리스너 간단히 포스팅하려고 심플한 To Do List를 만들어 보았다!    1. 구글폰트, 스타일시트, 자바스크립트 연결- `style.css`와 `script.js` 연결- 구글 폰트 `Poppins`  사용하기 위해서 Embed Code를 2.  전체  적용될 css 설정 & container에 배경 추가⚡  폰트는 구글 폰트 `Poppins` 로 설정 ⚡ `box-sizing: border-box;`요소의 크기를 계산할 때 `패딩(padding)`과 `테두리(border)`까지 포함하도록 설정하는 속성. 기본적으로 CSS에서 box-sizing의 기본값은 `content-box`이다. `content-box`는 요소의 `width`와 `height`가 콘텐츠 영역..

블로그 꾸미기 하면서 간단한 뮤직 플레이어를 만들었다. 음악이 재생 중일 때만 현재 플레이중인 음악 정보를 표시하는 코드 어떻게 짰는지 간단히 올려 본다. 플레이 버튼을 누르기 전까지는 `Title` 과 `Progress Bar` 이 숨겨져 있다가 곡이 재생되면 제목과 프로그레스바가 플레이어 위로 부드럽게 나타나는 코드이다. ⚡ music-info 클래스 CSS 코드음악 재생 전(기본상태).music-body .music-container .music-info { opacity: 0; /* 투명도 100%로 화면에서숨겨짐 */ transform: translateY(100%); /* (수직 방향) 자기 자신 높이만큼 아래로 이동 */ transition: transform 0.3s ease-in..

✅ session 관리✅ logout.jsp✅ main.jsp 만들기 지금까지 회원가입, 로그인 기능까지 구현해보았다.이제 세션 관리를 해 보자. `session` 이란 현재 접속한 회원에게 할당해주는 고유한 아이디이다.로그인에 성공한 회원에게 각각 `session`을 부여해주는 과정을 구현해보자. `loginAction.jsp`에 `session`을 설정해주는 `session.setAttribute()` 코드 한 줄 타이핑!`joinAction.jsp`에도 코드 복붙해서 넣어 준다.로그인 성공한 회원에게 세션 부여하고 메인 페이지로 넘어가게끔 해 준다. 이렇게 세션을 설정해 주었다. 세션은 해제 하기 전까지는 유효하기 때문에 할당한 세션을 해제할 수 있는 로그아웃 페이지도 만들어 주자. `joinAc..

저번에 회원가입 양식 `join.jsp` 까지 만들었다. 오늘은 userDAO 클래스에 회원가입을 처리하는 메서드를 하나 추가해 줄것이다.DAO 클래스는 실제로 DB에 접근해서 어떤 데이터를 가져오거나 데이터를 넣는 역할을 하는 데이터 접근 객체이다.그리고 처리된 결과값을 가져와서 View 처리하는 `join Action.jsp` 까지 만들어 볼 것이다.   먼저 userDAO 클래스로 간다.login 메서드 아래에 join 메서드를 만들어 준다.// 회원가입 처리 로직 public int join(User user) { String SQL = "INSERT INTO USER VALUES(?, ?, ?, ?, ?)"; try { psmt = conn.prepareStatem..

DB 위주로 할거라 화면은 부트스트랩으로 클래스만 먹여서 만들고 있어요. 데이터 넘어가는 것만 볼 거라서 화면 디자인은 신경 못 쓰고 있습니다!! 이쁘게 만들고 싶은 사람은 HTML/CSS 신경쓰면서 하셔도 좋습니다. 전 바빠서 디자인은 버렸지만,  여러분들은 이쁘게 만드시라고 간단한 회원가입/게시판 만들기 실습해 보실만한 무료 템플릿 사이트 가져왔습니다. 제가  추천하는 템플릿은 Forty입니다. Forty에서 회원가입/로그인/게시판 등 실습하시기 좋아요. https://html5up.net/ HTML5 UPResponsive HTML5 and CSS3 site templates designed by @ajlkn and released under the Creative Commons license.ht..

Java Reousrces > user 에 UserDAO 클래스 생성하고, JDBC 연동을 해 줄 것이다.DAO(Data Access Object) 클래스는 데이터베이스와 애플리케이션 간의 상호작용을 담당하는 객체. 주로 데이터베이스에 대한 CRUD(Create, Read, Update, Delete) 작업을 캡슐화하고, 데이터베이스 관련 코드를 분리하여 애플리케이션의 유지보수성을 높이는 데 사용됨. 1. MySQL 접속하기 먼저 데이터베이스 작업을 수행하기 위해 사용되는 주요 객체들 `Connection conn`, `PreparedStatement`, `ResultSet` 를 선언 해 주자.             package user;public class UserDAO { // MySQL 접속하기..

윈도우키 > MYSQL Command Line Client MySQL 계정 비밀번호 입력한 뒤CREATE DATABASE BBS;USE BBS; BBS라는  데이터베이스 만들어 줌 이제 테이블 생성할 차례 CREATE TABLE USER 로 유저 아이디, 비밀번호, 이름, 성별, 이메일 컬럼 5개 만들어 주고 USERID를 PK로 지정해주었음.SHOW TABLES; 위 명령어로 테이블 보기  DESC USER; `DESC + 테이블명`으로 현재 테이블 형태 보여줌            테스트로 홍길동이라는 유저의 정보를 테이블에 한 줄 넣어 줌 참고로 테이블에 데이터가 잘 들어갔는지 확인하려면 `select * from user;`  데이터가 잘 들어왔으면 `commit` 해 준다.  여기까지 했으면 이제..