개발 37

[8주차] 게시판 구현 #6 - 조회수 카운트

다음 코드를 추가해줍니다. UPDATE 같은 SQL 쿼리함수를 사용할 때 대문자를 사용해야 함수로 취급됩니다. //게시판 DB 연결 $con = mysqli_connect('localhost','root','비밀번호','database이름'); //게시판 내용 보여주기 ~~~이하 생략 //클릭할 때 조회수 1 증가 $hit = $board['hit']; $hit = $hit + 1; $hit_query = "UPDATE board SET hit = '".$hit."'WHERE number ='".$bno."'"; $hit_result = $con->query($hit_query); 저장하고 게시글을 클릭하니 조회수가 1 증가했다. 그런데 클릭했을 시에는 조회수가 증가한 게 안보이고 다시 목록으로 돌아가야..

개발/웹 개발 2023.05.22

[8주차] 게시판 구현 #5 - 검색 기능 (제목/작성자/내용별)

이번에는 게시판 하단에 검색 기능을 추가해볼 겁니다. 아무래도 데이터가 많아질수록 일일히 페이징을 하면서 넘기는거보다 검색기능을 주로 사용하게 될 것 같습니다. BootStrap에 들어가니 괜찮은 입력-버튼 폼이 많이 보입니다. 처음 저 두번째 버튼을 갖다가 썼는데 css 기본설정값에 오른쪽 정렬이 포함되어있는건지 중앙 정렬이 하도 안되서 id와 class를 싹 빼고 기본 input으로 바꿨습니다. 정말 빼니까 정렬이 되었습니다. 코드는 이렇습니다. 검색 이제 검색 버튼을 클릭했을 때 form 태그를 이용해 원하는 검색 정보를 보여줄 수 있도록 type을 submit으로 바꾸고 form 태그로 감싸겠습니다. 그리고 처리 페이지에서 $_GET을 사용할수 있도록 name을 부여하겠습니다. 검색 그 후, se..

개발/웹 개발 2023.05.20

[6주차] 게시판 구현 #3 - 수정, 삭제

수정 기능 이번에는 게시판 수정 기능을 구현해볼 겁니다 현재까지 구현된 기능은 게시판 리스트 구현, 게시글 읽기, 게시글 쓰기 총 3개의 기능을 구현했다. modify.php를 생성해줍니다. 일단 modify.php의 내용을 작성하기 전 write.php의 내용을 복사해서 modify.php에 붙여넣어줍니다. 왜냐면 디테일만 조금 다를 뿐, 전체적인 틀은 비슷하기 때문이죠 그리고 글 내용을 읽는 read.php 에도 수정 버튼을 만들어 버튼을 클릭하면 modify.php로 이동하도록 코딩해줍니다. 게시판에서 아무 글이나 클릭하면 이런 버튼이 생겼습니다. 그럼 이 수정 버튼에 해당 글을 수정하는 페이지를 띄울 텐데, 냅다 modify.php로 보내는 게 아니라 get 방식으로 게시글의 number 값을 보..

개발/웹 개발 2023.05.05

[5주차] 게시판 구현 #2 - 게시글 읽기, 게시글 쓰기

게시판 글쓰기 간단히 글 작성폼을 만들어 테스트용 글을 만들어 작성을 눌러보았다. 쿼리문이 제대로 전달되지 않아 DB로 안가면 에러처리가 되게 해놨는데, 글쓰기 완료라고 떴으므로 DB에 잘 저장이 되었다. 실제로 SQL을 켜서 확인해봐도 글이 잘 추가되었다. 근데 게시판에서 새로고침을 아무리 눌러도 확인이 안됨.... 기존에 글 작성이 아니라 DB에 강제로 때려넣었던 1번 게시글만 확인이 된다. 일단 문제가 뭘까 싶어 DB를 보니 분명히 세션 아이디를 쿼리문에 넣게 코드를 짰는데 name이 전혀 추가가 안되고 있다. 혹시 SESSION 아이디가 안먹히나 싶어 메인 페이지에 썼던 session 아이디 확인을 해봤는데 잘되고 있었다. 혹시나 게시판 페이지에서 session이 안먹나 싶어 출력해보았지만 잘 출..

개발/웹 개발 2023.05.03

손 쉽게 웹페이지 꾸미는 법 #2 - 그리드 시스템 BootStrap

#1 에서 코드 몇 줄 만 붙여넣으면 BootStrap에서 제공하는 수많은 스타일들을 사용할 수 있다는 것을 확인했다. 이제 BootStrap을 이용해서 웹 페이지의 어느 정도 틀을 잡을 수 있는 방법을 정리해보자. BootStrap은 반응형 웹사이트도 제공할 수 있고 전체 길이를 12로 본다. 6이면 웹 사이트의 절반 길이인 것이다. BootStrap의 Layout 탭에서 Grid를 눌러보자 웹 사이트는 사실 행과 열로 구성되어 있다. 메뉴바든, 메인 페이지든 넓고 작은 크기의 행과 열들이 모여서 만들어내는 것이다. "row" 와 "col" class 로 간단히 Column 을 구성할 수 있다. 일단 테스트를 해보기 위해 만들어놓은 메인 페이지에 카드를 하나 추가해뒀다. 저장하고 실행하니 카드가 하나 ..

개발/웹 개발 2023.05.01

[5주차] 게시판 구현 #1 - 게시판 리스트 만들기

이번엔 여태까지 만든 페이지에서 게시판을 구현해볼 것이다 우선, board.php를 만들어준다. 게시판에서 사용될 컬럼을 미리 만들어두었다 자동으로 증가하는 auto_increment 속성을 가진 number 컬럼 제목이 저장될 title 컬럼 내용이 저장될 content 컬럼 작성자의 닉네임이 저장될 name 컬럼 글 작성시간이 저장될 date 컬럼 조회수가 저장될 hit 컬럼 추천수가 저장될 thumbup 컬럼 그다음 비밀번호가 저장될 password 컬럼이다. 우선, board라는 이름의 테이블을 생성한다. 터미널을 열고 mysql 코드를 입력해주자. CREATE table board ( number int not null auto_increment primary key, title varchar(..

개발/웹 개발 2023.04.30

손 쉽게 웹페이지 꾸미는 법 #1 - Bootstrap 적용하는 법, 버튼 디자인

웹 페이지를 HTML로 실컷 만들어놓으면 기능은 문제가 없을지 몰라도 하나의 산이 더 존재한다. 바로 css로 꾸미기..... 아니 꾸미는 거 젬병인데 컴퓨터에서도 꾸며야한다고? 근데 css 안쓰기에는 기본 html 골격 자체가 너무 날것이다 이런 개발자들에게도 희망은 있다. 바로 BootStrap 이라는 사이트인데, 구글에 검색해서 쉽게 접속할 수 있다. getbootstrap.com 이라는 곳 누르면 접속이 된다. https://getbootstrap.com/ Bootstrap Powerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize prebuilt grid system and com..

개발/웹 개발 2023.04.29

[3주차] 회원가입 페이지 구현 #2 - 아이디 중복 체크

여태까지 만들어놨던 로그인 창이다. 여기에 회원가입 버튼을 만들어 회원가입 기능을 구현해볼 것이다. login_proc.php로 보내는 로그인 부분과는 별도로 새로운 form 태그를 열어준다. 그리고 그 form 태그는 enroll.php로 데이터를 POST형식으로 전송한다. test.php test.php 코드 저장하고 브라우저를 보면 회원가입 버튼이 생긴 것을 볼 수 있다. 회원가입 버튼이 빨간 건 test.css파일을 생성해서 input 버튼에 부여한 enroll id에 css코드를 입력해서 그렇다. 코드는 다음과 같다. test.css #enroll { color : red; } 회원가입 버튼을 누르면 회원가입 페이지 (enroll.php)로 이동한다. 현재까지는 주소 검색 기능이 없고 중복체크 ..

개발/웹 개발 2023.04.22

[4주차] 회원가입 페이지 구현 #1 - 주소 검색 기능 만들기

회원 가입 페이지 란에 주소 검색 기능을 추가할 것입니다 우체국 사이트로 접속해줍니다. 구글에 우체국 사이트를 검색했을 때 통합검색 우편번호 란을 클릭하면 바로 들어갈 것 같습니다. 우편 번호 내려받기 탭에 지역별 주소 DB 파일을 제공하고 있습니다. 다운받아줍니다. 다운은 금방 완료되고, 지역별로 주소가 모인 txt 파일이 압축파일로 다 담겨있습니다. 이번에 서울시를 기준으로 구현해볼 예정이므로 서울특별시.txt 파일만 클릭해서 압축을 풀어줍니다. 한번 클릭해서 보니 어지럽습니다. 너무 많네요 여는 것도 시간이 꽤 걸립니다 window에서 되는지를 테스트해본 것이므로, 이 파일을 ubuntu로 옮겨줍니다. 그리고 경험상 이름이 한글인 것도 문제가 될 수 있기 때문에 1.txt로 바꿔줍니다. 그리고 my..

개발/웹 개발 2023.04.21