본문 바로가기

Project

 (26)
project 2.3 My first website/ 회원가입 페이지 정규식을 할 수 있는 회원가입페이지 결과는 아래와 같이 나온다 지금 정규식검사가 진행되는 div 가 동적이 아닌,,, 내맘대로 패딩을 대충 중간으로 우겨넣었기 때문에 이게 창사이즈마다 웃기게작용됨ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ진짜ㅠㅠ 프론트엔드 개발자분들 존경합니다.. 무튼 본론으로 들어가서 오늘도 view부터 1. view (join.jsp) 정규식 검사를 진행한 건: id, pw, confirm pw, email, phone 어짜피 다 비슷한 형식으로 가기 때문에 제일 힘들었던? 복잡했던? 비밀번호 체크만 올린다. * 모든 정규식은 전부 페이지로드 이벤트 함수에 걸려있음 // 2. 비밀번호 체크 // 8 ~ 20 사이의 대문자, 소문자, 숫자, 특수문자(~!@#$%^&*)를 사용한다. // 소문자, 숫자 필수 나..
project 2. 2 My first website/ 아이디, 비밀번호 찾기 페이지 Ajax를 이용하여 백앤드 결과값(아이디, 임시비밀번호) 받아 프론트에 뿌려주기 결과는 아래와 같이 나온다! 1. View (findId.jsp , findPw.jsp) 기본 html은 너무기본적인 내용이라 생략 스크립트 (ajax) 위주로 정리 1) findId $(document).ready(function (){ // 화면이 켜지면 바로 함수실행 fn_findId(); }); function fn_findId() { $('#findIdBtn').click(function(){ // FIND ID 버튼이 클릭되면 아래 ajax실행 $.ajax({ url:'/MYHOME_P/findId.member', // 이동할 컨트롤러 주소. type: 'get', //요청방식 : get data: 'mEmail=..
project 2. 1 My first website/ Mybatis란? 그리고 login 페이지만들기 메인페이지 index.jsp header와 footer파일을 나눠 모든 각각의 페이지에 삽입시켜줬다 헤더는 상단 버튼들 퓨터는 기본 저작권 내용 ~~뭐 약관 등등~~ + 태그 index에는 정말 welcome to my first website 내용만 있다고 보면됨.. DB는 Mybatis로 오라클에 연결했고, 회원과 관련된 member mapper/ 게시판 글과 관련된 board mapper를 만들었다. SqlSession으로 Dao가 Db 접근을 할 수 있게했다. MyBatis란? 1. MyBatis 는 모든 쿼리문(SQL)을 Mapper 에 저장한다. 2. Mapper 에 접근해서 쿼리문을 실행하는 역할을 SqlSession 클래스가 담당한다. 3. SqlSession 클래스를 사용하려면 다음 과정..
project 2. My first website JSP 로 진행한 웹 사이트로 현재 서버단은 어느정도 구현이 되어있는상태이다. 구현한 기능은 1. 로그인 (정규식 검사 진행) 2. 탈퇴 3. 내 정보수정 3. 게시판 글쓰기 4. 게시판 답글 쓰기 5. 게시판 글 삭제하기 6. 조회수 올리기 이제 부트스트랩을 이용해서 조금 살을 붙여볼까 한다. 우선 오늘 살을 붙인건 header.jsp 파일에 css를 도입? 시켰다. 기본 폰트가 너무 보기싫어서 구글에서 긁어왔음 header.jsp // 구글폰트 링크 sytle.css #wrap { // *전체를 감싸고 있는 font-family: 'Source Sans Pro', sans-serif; } 이랬는데 아무일이 없고 콘솔에서는 에러뜸 404 진짜 404~~~~~~ 열심히 구글링해보니 컨텍스트패스를 통해 가..
project 3 Bite A Bit 프로젝트 완성, 도메인 구입해 서버 연결! 기존에 문제가 되었던 1. 왠지모르게 알럿창이 두번뜨고.. 2. 이상해서 서버쪽에 print를 찍었는데 여기서도 수정이 필요한 부분 (post_kor, post_memo)이 두번 프린트가 된다. 이 부분을 드디어 고쳤다. 문제가 되었던 부분 나는 1. 모달창을 띄워주는 함수인 edicCard 2. 서브밋을 누르면 실행하는 함수인 fn_edit 두개를 가지고 있었는데 editCard를 실행시킬때마다 를 실행시키고 있었던 것.. , , , , , , , , fn_edit(post_eng) 그래서 함수를 두번호출할수도 있는 것들은 모조리 없애고 1. 버튼 태그가 원래 로 eng, kor, memo 텍스트 태그와는 다른 곳에 있었는데
project 2. 2 Bite A Bit 수정 기능 추가완료 2차 완성 이 감격스러운 순간을 잊을 수가 업따 흑흑 우선 결과부터 얘기하자면 이전 포스팅에서 썼던 내용대로 완성을 했다 1. 서버에서 디비 오리지널 칼럼을 찾는건 "영어표현" 2. 헷갈리지 않도록 플레이스 홀더로 기존표현을 알려주기. 3. 2번에 추가로 둘 다 수정이 필요하지 않고 한국어표현만 수정하거나 메모를 추가하거나 등 '한 개의 영역'만 고칠 수 있도록 따로 사용자가 적지않으면 플레이스홀더의 내용(기존에 등록되있던 내용)으로 서버로 보내주기 3. 서버에서 디비 업데이트 해주기 4. 업데이트 된 내용 받아와서 다시 클라이언트에 뿌려주기 수정버튼을 클릭하면 이렇게 모달창이 뜨고 모달창 내용을 적은 후 (여기선 한국어 표현은 기존표현 그대로, 메모만 추가한 상황) 서브밋을 누르면 tada! 이렇게 수정이 된다...
project 2. 1 Bite A Bit 수정 기능 추가하기 동영상을 따오는 건 시도했는데 도무지 안되서 당장 다음주가 발표기 때문에 수정기능을 추가하기로 했다. 1. 글을 등록할때 애초에 새로운 창 혹은 팝업창으로 했던게 아니기 때문에 (토글키 처럼 아래 사진 Write a memo 키를 눌러서 폼이 나오면 적어 서버로 보내주는 방식) 2. 수정할 때 카드 자체에 수정할 수 있는 폼을 다시 만들어야 하는지, 아니면 새로운 창을 띄워야 하는지 고민하던 찰나 3. 'Modal' 기능을 발견. 4. 어떤 기능을 사용해서 수정할 지 정했으니 폰트어썸에가서 아이콘을 줍줍 이 모달창 띄우는데 애를 얼마나 먹었는지... ㅡ_ㅡ... (bootstrap 기본 코드 중에 놓친 코드가 있어 작동 안하고있었음ㅋㅋㅋㅋㅋㅋㅋㅋ) 창을 띄웠으니 큰 시작 고민은 1. english phr..
project 1. 2 Bite A Bit 서버구현 / 1차 완성 클라이언트 단 완성 후 서버구축 1. 클라이언트로부터 데이터 받는 post요청 1)받은 데이터를 mongoDB에 저장하기 2. 클라이언트로 디비에 있는 데이터를 보내주는 get요청 1)posts라는 이름의 리스트를 만들어서 디비에서 온 정보를 리스트화 시키기 2)그 리스트를 jsonify시켜 저장해놓은 posts를 클라이언트로 보내주기 3. search 1) get요청으로 클라이언트로부터 데이터(한글/영어표현) 받기 (한글 표현/영어 표현 검색 가능하도록 설정함) 2) 디비에서 받은내용으로 조회해서 ("$regex" 로 전체를 입력하지 않고 키워드만 입력을 해도 검색이 가능하게 했다) 다시 리스트 만들기 3) 만든 리스트를 어펜드시켜 jsonify시켜 클라이언트로 보내주기 4. delete 1) 삭제할 ..

티스토리툴바