wonder

☞ HTML/CSS 디자인 이해 ☞ 레이아웃 구조 보통 레이아웃 구조는 container navbar header content sidebar footer 이렇게 됩니다. 각각 padding, border선을 설정하여 처음에는 레이아웃 위치를 확인하며 감을 잡도록 합니다. 1) div 를 중앙 정열시키기 위해서는 margin: 10px auto; 을 사용하며 padding: 1px 2px 3px 4px; 한줄로 하자면 위에서부터 시계방향 순입니다. 2) div 또는 container들을 fluid로 바꿔 inline구조로 사용할 수도 있습니다. 3) # - id는 하나밖에 설정을 못하며 . - class는 하나의 태그에대해 여러그룹을 설정할 수 있습니다. 4) box-shadow를 사용하면 그림자 효과를..

☞ 메인페이지 구성 메인 로그인 페이지에서 바로 비회원 문의 게시판으로 이동하도록 합니다. 회원 게시판은 로그인을 해야 했다면 비회원 게시판은 로그인없이 같은 기능을 사용할 수 있도록 제작합니다. 옵션 검색부터 정렬, 페이징 등은 그대로 사용하도록 하고 파일업로드는 제외하였고, ask_board로 테이블을 새로 등록시켰습니다. ☞ 연락처 추가 기능 추가될 기능은 연락처이며 추가/수정할 때만 등록한 익명 회원에게 보입니다. 다른 사람들이 글을 읽었을 때는 연락처가 포함되지 않고 DB에 저장만 돼있습니다. ☞ 비밀번호 기능 비밀번호는 회원가입없이 등록된 비밀번호로 삭제/수정 가능합니다. 임의의 비밀번호로 사용가능합니다. 원래는 새로 글을 등록할 때도 로그인한 세션에 대한 비밀번호를 검증했다면 지금은 그 단계..

☞ 비밀번호 변경 구현 정보수정을 할 수 있는 마이페이지를 만들고 비밀번호를 변경할 수 있도록 합니다. post 방식으로 폼을 비밀번호 변경 페이지에 전달합니다. 버튼으로 전달하는 것보다 미관상 하이퍼 링크 형식으로 제작하고 자바스크립트로 비밀번호 id값을 받아온 뒤 만약 비밀번호값을 입력했다면 폼을 전달시키고 값이 없다면 경고창이 뜹니다. 비밀번호 값을 post로 받아온 뒤 세션 아이디가 있을 때 비밀번호를 변경합니다. confirm창 확인을 누르면 마이페이지로 돌아가고 취소를 누르면 뒤로 돌아가 값이 유지됩니다. ☞ 주소 변경 구현 주소변경 버튼을 누르면 회원가입 때와 마찬가지로 새창으로 주소변경창을 띄웁니다. 원하는 위치로 띄우도록 합니다. 주소검색값은 현재 페이지로 검색어을 전달하여 데이터를 불러..

☞ 시행착오: 캘린더 제작 처음에 input 종류인 date로 달력을 구현할 수 있는지 모르고, 시행착오를 겪었습니다. API인줄 알았고, 직접 구현하고자 했습니다. 시간을 구해서 시작과 끝 날짜를 옵션에 넣고 선택 시에 달력을 띄웁니다. 자바스크립트를 활용해 작은 달력창을 띄워 클릭을 하면 검색에 적용되도록 하려고 했으나 date라는 기능이 있었습니다. ☞ 기간 검색 기능 date 날짜 선택 달력을 이용해서 원하는 시작날짜~ 끝날짜를 기간으로 검색할 수 있도록 합니다. 날짜는 검색 폼에 들어가서 현재 페이지에서 GET방식으로 검색합니다. 일단 한국시간 기준이 아니기 때문에 시간대을 설정합니다. GET방식으로 받은 시작/끝 날짜를 만약 검색에서 시작/끝 날짜가 없다면 시작날짜는 넉넉하게 2020년 1월 ..

게시판의 날짜/제목/조회수순 정렬을 구현해야합니다. ☞ SQL 조회수 컬럼 추가 일단 조회수 컬럼을 추가해 게시글을 읽으면 조회수가 DB에 추가되어 저장되도록 합니다. 게시글을 읽으면 기존 조회수에 1을 더하는 방식으로 구현합니다. DB에 조회수 업데이트를 쿼리도 추가해줍니다. ☞ 날짜순 정렬 먼저 날짜순정렬입니다. 최신순, 오래된순으로 정렬을 해야하니 substr으로 날짜의 총합을 더하여 비교하는 방법도 있겠지만 그렇게 하면 복잡해지고 SQL 쿼리문중에 order by라는 편한 녀석을 사용합니다. 대상을 기준으로 오름차순, 내림차순을 설정할 수 있습니다. 제목의 기호를 누르나 제목순정렬을 누르나 똑같이 최신순 정렬페이지로 이동합니다. 최신순 정렬페이지로 넘어가면서 최신순(내림차순)으로 정렬합니다. 또한..

사실 좋아요를 누를 때마다 페이지를 일일이 이동하는 게 아니라 바로 행동할 수 있는 자바스크립트로 구현하는 게 맞겠지만 자바스크립트 안에서 php> SQL문을 실행시키는 것에 있어서 문제가 생겨서 방향을 틀었습니다. 그냥 페이지를 이동시키는 방식으로 구현합니다. ☞ 좋아요 구현 일단 좋아요 수를 카운트할 수 있는 up 과, 좋아요를 한 사람을 체크할 수 있는 upname을 DB 컬럼에 추가합니다. 현재좋아요 수를 노출하고 세션값: 아이디로 검색해서 만약 유저가 좋아요를 누른적이 있다면 DB에 이름이 등록이 되어있을 것 입니다. 이름이 등록되어있지 않다면 색칠안된 빈 하트를 노출합니다. 이미지를 클릭하면 좋아요페이지로 갑니다. 현재는 좋아요를 누르지 않고 관리자(wonder12)만 좋아요를 누른 상태이므로..