jsp5 SPRING 프로젝트 - 펀딩 사이트(7) : 페이지네이션 없이 무한스크롤 구현 1. 내용 : 내가 찜한 펀딩을 확인할 수 있는 페이지이다. 찜을 하면 DB에 있는 mem_like에 회원 아이디와 펀딩 번호가 저장되는데 나의 펀딩 페이지에서는 이 mem_like와 funding 테이블을 join해서 데이터를 가져온다. 페이지가 켜지면 바로 ajax를 이용해서 모든 정보를 List로 가지고 오는데 스크롤을 내릴 때마다 12개씩 뜨도록 무한스크롤을 사용하였다. 2. 과정 중 특이점 : 페이지네이션을 사용하면 쉽게 할 수 있지만 데이터를 모두 가져온 다음 필요한만큼 잘라서 무한스크롤을 하고 싶어서 이런 식으로 만들었는데 순서 부분 때문에 좀 헷갈렸다. 선생님의 도움과 구글링으로 해결할 수 있었다. 3. 화면 및 코드 1) 나의 펀딩 화면 펀딩리스트와 똑같은 모양이다. 아래 영상을 보면 화.. 2022. 9. 8. SPRING 프로젝트 - 펀딩 사이트 (5) : 찜하기와 공유하기 1. 내용 : 펀딩 리스트에서 사진이나 제목을 클릭하면 그 펀딩의 내용에 대해서 간단하게 알려주는 페이지이다. 찜과 공유하기, 더 알아보기를 할 수 있다. 2. 과정 중 특이점 : 수업시간에는 찜하기를 배우지 않았기 때문에 스스로 어떤 식으로 짜야할지 하나씩 생각하면서 만드는게 어렵지만 재미있었다. 찜을 하는 순간 하트 색깔과 찜한 갯수가 바뀔 때 새로고침하게 만들었는데 그냥 요소가 바뀌게 했어도 좋았을 것 같다. 3. 화면 및 코드 1) 펀딩 세부 화면 펀딩 세부 화면에서는 펀딩의 카테고리, 제목, 사진, 달성현황과 퍼센트, 남은 시간, 창작자, 키워드를 정보로 보여준다. 더 알아보기를 클릭하면 크롤링해온 기존 펀딩 사이트가 새 탭으로 뜬다. (키워드는 이후에 진행된 파이썬 프로젝트의 결과물이라 현재 .. 2022. 9. 6. SPRING 프로젝트 - 펀딩 사이트 (4) : xml 조건 정렬과 Grid 1. 내용 : 펀딩 사이트들의 내용을 크롤링하여 모은 뒤 화면에 띄워주었다. 2. 과정 중 특이점 : 게시판을 만들 때 카테고리 별로 보여주는 것은 했어서 이번에는 정렬 기능을 넣어보았다. where 조건만 추가하면 되서 많이 어렵지 않았다. 페이지네이션도 이전 화면구현 때와 JSP 수업 때 했어서 동일하게 구현하였다. 3. 화면 및 코드 설명 각 사이트에서 진행되는 펀딩들을 모아서 보려면 먼저 텀블벅, 와디즈, 오마이펀딩 사이트를 크롤링해해야 한다. 파이썬을 이용해서 각 사이트에서 필요한 정보를 크롤링하고 그 결과를 오라클 DB에 저장하였다. 그리고 저장된 내용을 가지고 펀딩 리스트를 구현하였는데 화면은 아래와 같다. 1) 펀딩 화면 펀딩 이미지, 제목, 달성율과 그 퍼센트, 찜한 숫자, 카테고리, 남.. 2022. 9. 2. javascript - for문을 이용하여 표 안에 구구단 출력하기 for문을 이용하여 표 안에 구구단을 출력하는 문제 선생님이 하드코딩으로 만든 구구단을 보고 그걸 for문으로 만들어 보았다. 먼저 출력 결과부터~ 위와 같은 출력결과를 위해 하드코딩하려면 엄청 길게 써야 한다. 아래 더보기를 눌러 확인! 더보기 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90.. 2022. 6. 13. 리눅스에서 Tomcat 설치하여 서버 켜고 끄는 방법 검색 엔진에 '톰캣' 또는 'Tomcat'을 검색하여 홈페이지에 들어간다. 왼쪽에 있는 다운로드 메뉴 중에서 원하는 버전을 골라 클릭한다. 나는 Tomcat 9.0을 설치하였는데 jdk 1.8버전 이상에서 작동하니 주의할 것~ Binary Distributions의 Core에서 내 운영체제에 맞는 파일을 선택하면 된다. 우리는 리눅스이므로 tar.gz (pgp, sha512)을 선택하여 다운받았다. 홈에 tools라는 폴더를 생성한 뒤에 위에서 다운 받은 apache-tomcat-9.0.63.tar.gz를 넣어 압축을 풀어준다. 그리고 터미널을 켜서 현재의 연결 상태를 확인하기 위해 위의 사진처럼 netstat -tlnp를 입력한다 그러면 위의 사진처럼 현재 사용 중인 PORT가 뜨는데 현재 사용할 PO.. 2022. 6. 2. 이전 1 다음
