목록전체 글 (116)
Today I Learned …
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cldNho/btrjqqfYHLY/Mq7pCaVGhwmfCsuGtMwYak/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 설명 저번에 게시글 리스트 출력을 다뤘으니 이번에는 페이징을 다뤄볼까 한다. 페이징에는 크게 두 가지의 목표가 있다. 1. 한 페이지 당 원하는 개수의 게시글을 출력하고 그때 그때 총 페이지 개수에 따라 페이지 번호를 출력해 링크를 타고 넘어다닐 수 있게끔 한다. 2. 페이지가 20개, 30개 된다면... 혹은 100개 쯤 된다면 페이지 번호 자체도 페이징해주는 편이 보기 편할 것이다. 이걸 보통 block이라고 부른다. 여기서는 먼저 1번을 다뤄본다. 최종 화면 게시글 리스트 페이징 기능 : 게시글 페이징 1. 먼저, 이전에 짜놨던 기본 게시글 리스트 출력 코드이다. //(윗 부분)... [1] 전체 게시글을 id를 기준으로 내림차순으로 정렬하고, [2] wh..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/qnNjN/btrjsqeGG4f/TEkHdaKEKRqA0PYzb7foH0/img.png)
* 워게임 풀이 과정을 기록합니다. 사담 백신 2차 때문인지... 너무 피곤하다... 보고서도 써야하는데 큰일...ㅠ 오늘은 정말 간단히!! 2번 문제 cobolt를 다뤄볼까 한다. 이전 문제 https://choco4study.tistory.com/49 [Lord of SQL Injection] 1번 gremlin 풀이 * 워게임 풀이 과정을 기록합니다. 소감 음.. 너무 바쁘다..ㅠ 오늘은 간단히 워게임 1번 풀이를 해보도록 하겠다... 핳 Lord of SQL Injection 간단 소개 말그대로 SQL Injection의 지배자(?)가 되자는.. 그런 choco4study.tistory.com 2번 문제 cobolt 분석 2번 문제는 다음과 같다. 저번 문제에서 이미 다뤘던 preg_match()..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dhlchW/btrjk4pXRje/ZVxs9xt5bWbNtRrhnkvfM0/img.png)
* 워게임 풀이 과정을 기록합니다. 사담 음.. 너무 바쁘다..ㅠ 오늘은 간단히 워게임 1번 풀이를 해보도록 하겠다... 핳 Lord of SQL Injection 간단 소개 말그대로 SQL Injection의 지배자(?)가 되자는.. 그런! 노말틱님이 추천해주신 워게임으로 SQL Injection을 연습하는데 큰 도움이 되는 사이트다. 종종 풀면서 감을 익히면 좋을 것 같아서 앞으로 차곡차곡 풀이를 올려보려고 한다. 1번 문제 gremlin 분석 설레는 마음으로 들어가보면 아래와 같은 화면이 반겨준다. ....??? 일단 워게임 경험이 거의 없는 나로서는 첫번째 당황 = 폼이 없다...? 잠시 쳐다보니 코드 중간에 GET이라는 글자가 눈에 띄었다. GET이란 결국 url에 정보를 담아 전달하는 메소드이..
* 해당 주차의 수업 내용을 정리합니다. 0. 들어가기 전 [1] SQL Injection ① 인증 우회 (지난 주) ② 데이터 추출 (이번 주) [2] SQL Injection Wargame : Lord of SQL Injection ⇒ 현장은 또 다르기 때문에 직접 개발한 웹에서의 실습도 중요하다. [3] 보고서 관련 TIP ① SQLi 공격 연구 보고서 안에 크게 세개의 카테고리가 있게끔 한다. ⑴ SQLi 개념, 원리... ⑵ 인증 우회 ⑶ 데이터 추출 ② 구성 및 디자인 ⑴ 표지 페이지 ⑵ 단락 (스타일 사용 : 제목1, 제목2 등... 디자인 맘에 안들면 스타일을 수정해서 자신만의 템플릿 만들어보기) ⑶ 기본 여백 보다 좁게 (레이아웃 - 여백 - 좁게) ⑷ 페이지 번호 매기기 (바닥글로) ⑸..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/zmN7W/btri7QLpHNW/EUXZVqFCOK2yuKuJwLpCCK/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 소감 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐본다. 최종 소감 맨 아래로! 이전 포스팅 http://choco4study.tistory.com/46 [웹개발] 웹 최종 한 눈에 보기 (3) : 문의게시판, 비회원 글작성, 비밀번호 관리 * 개인적인 공부 내용을 기록한 글입니다. 소감 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐본다. 앞으로 추가할 사항 현재는 회원/비회원에 관계없이 작성자 이름과 비밀번호 choco4study.tistory.com 마이페이지 1. 마이페이지 : 회원 정보 조회 [1] 메인 화면 네비바의 [마이페이지] 를 눌러 마이페이지로 진입했을 때의 첫 모습이다. [2] 네비바가 마이페이지 전용 네비바로 바뀐..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/Poskn/btri0bxcouj/5SKRc4fO6uv0dxqpMtKqRK/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 소감 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐본다. 이후 수정할 사항 현재는 회원/비회원에 관계없이 작성자 이름과 비밀번호를 받고, 모든 문의글이 잠겨있다는 전제이다. ⇒ 회원일 경우 작성자 이름과 비밀번호를 받지 않고, 사용자의 선택에 따라 공개/잠금 여부를 설정할 수 있도록 변경할 생각이다. 이전 포스팅 http://choco4study.tistory.com/45 [웹개발] 웹 최종 한 눈에 보기 (2) : 글수정, 글삭제, 조회수, 좋아요 (취소 포함) * 개인적인 공부 내용을 기록한 글입니다. 소감 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐본다. 이전 포스팅 http://choco4study.tistory.com/44..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/CDMxC/btri668GzUU/yTt50zdhUpTRqNbPzEurU1/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 소감 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐본다. 이전 포스팅 http://choco4study.tistory.com/44 [웹개발] 웹 최종 한 눈에 보기 (1) : 그리팅, 로그인, 회원가입, 메인, 글쓰기, 글조회, 게시판, 검 * 개인적인 공부 내용을 기록한 글입니다. 소감 중간고사 기간에... 틈틈이 딴짓처럼 하다보니... 어느새 다 만들었다.. 반쯤 정신이 나간 상태에서(...) 작업했다보니 효율적이지 못하게 짠 부분 choco4study.tistory.com 회원게시판 관련 편의 (1) : 글수정, 글삭제 1-1. 게시글 수정 : 전체적으로 [1] 글조회 시 해당 게시글이 자신이 쓴 글이면 우측 하단에 [수정] [삭제] 버튼이 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/b0QvD9/btri3LEhZzR/cjyDcZezZGctCtDyGazyUK/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 소감 중간고사 기간에... 틈틈이 딴짓처럼 하다보니... 어느새 다 만들어버렸다... 반쯤 정신이 나간 상태에서(...) 작업했다보니 효율적이지 못하게 짠 부분도 있을 것 같다. 시간은 충분하니 계속 수정하고 업데이트하면서 조금씩 더 발전시켜볼 생각이다. 이 포스팅에서는 최종 결과물을 화면과 화면에 대한 설명 위주로 한 눈에 펼쳐보려고 한다. * 주소DB는 구현 전이다. 언제나 그렇지만 기능 구현 시간이 한시간이면 디자인은 두세시간은 넘게 걸린 것 같다. CSS는 제대로 해보려고 했는데.. 생각보다 레이아웃이나 셀렉터 관련 내용이 까다로웠다. 꾸미기에 있어서는 정말 감각도 없고 끈기(?)도 없는 나로서는 그냥.. 어떻게든 해보는 것에 의의를 뒀다. 디자인 전공하..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/c9O0PS/btri3VfvnMK/RHC2JLV0eKn4dntLJQuYe1/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 최종 화면 게시판 리스트 출력 기능 0. 요약 [1] 게시판 페이지를 만든다. [2] 게시글 목록을 출력할 표를 만든다. [3] DB에 담긴 게시글 정보를 최신글부터 가져와 출력해준다. 1. 게시판 페이지 (= board.php) 에 게시글 목록을 출력할 표를 만든다. 게시판 글쓰기 Post ID 제목 작성자 작성일 조회수 좋아요 [0] 게시글 목록 상단의 제목 부분을 만든다. ① Post ID ② 제목 ③ 작성자 ④ 작성일 ⑤ 조회수 ⑥ 좋아요 2. DB에 담긴 게시글 정보를 최신글부터 가져와 출력해준다. //(윗 부분)... [1] SELECT ~ ORDER BY 구문을 통해 모든 게시글의 정보를 최신글부터 가져온다. [2] fetch를 반복 실행해서 쿼리문..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/rlEsw/btriMJt36pf/MKjRaN3o6oACFABLCvLd0k/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 최종 화면 게시글 작성 기능 0. 요약 [1] 게시글 DB 만들기 [2] 게시글 폼 만들기 [3] 폼과 DB 연결 [4] 끝! + 회원만 작성할 수 있게 세션 검증은 덤 1. 게시글 DB 만들기 (= board) [0] 게시글을 저장할 DB를 적당히 만들어준다. [1] 앞으로 필요한 컬럼들까지 한 방에 만들어줬다. ① id : 게시글 식별자 ② title : 제목 ③ writer : 작성자 ID ④ name : 작성자 이름 ⑤ written : 작성일 ⑥ content : 게시글 내용 ⑦ file : 업로드한 파일 ⑧ hit : 조회수 ⑨ liked : 좋아요 2. 게시글 폼 만들기 (= write.php) 글쓰기 [0] 간단한 폼을 만들어준다. [1] 세션이 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bApSlY/btriFiI8T3E/NIBLFlRm5jCb2H8CcOJqG0/img.png)
* 개인적인 공부 내용을 기록한 글입니다. 소감 회원가입 시 비밀번호를 두번 이상 확인하는건 가입자의 실수를 방지하지 위한... 인지상정(?) 간단하게 구현해보자! 최종 화면 비밀번호 일치 확인 1. 먼저 join.php의 태그 내부이다. 비밀번호: 비밀번호 확인: [1] 비밀번호 확인 폼을 하나 더 만든다. [2] php로 다뤄주기 위해 name을 지정해준다. 2. 다음은 회원가입을 처리할 join_ok.php의 일부 내용이다. $join_pw = $_POST['join_pw']; $join_pw2 = $_POST['join_pw2']; if(!$check){ //사용가능ID if($join_pw != $join_pw2){ //비밀번호 불일치 echo ""; } else { //비밀번호 일치 if($r..