자바스크립트로 페이지 만드는법좀요?

Question

구글 검색하고 맨 하단에 보면

1 2 3 4 5 6 7 8 9 10

이런 페이지가 있잖아요

번호 누르면 탭이 늘어나지 않으면서

이런걸 만들려면 자바스크립트로

만들수있나요?

그럼

자바스크립트 어느 부분을 공부해야 될까요?

Answer 1

스프링 프레임워크 라는 기술이 있습니다. 그 기술을 활용해서 게시판을 만들 수 있는 예제가 있습니다.

자바, 자바스크립트, html 등을 활용해서 개발하는 예제입니다.

예제 블로그를 소개해 드립니다.

//스프링 프레임워크 게시판 강의(melon peach 강사님)

https://melonpeach.tistory.com/category/%EC%9B%B9%EA%B0%9C%EB%B0%9C/%EC%8A%A4%ED%94%84%EB%A7%81%20%EA%B2%8C%EC%8B%9C%ED%8C%90%20%EB%A7%8C%EB%93%A4%EA%B8%B0?page=4

그리고 해당 강의를 스텝 바이 스텝으로 따라가다보면 [10강 게시판 페이징 구현] 부분에 방법이 나옵니다.

10강까지 완료했을 때의 모습을 이미지로 공유드립니다.

Answer 2

하단에 페이지가 나와 있는 것을 보통은 페이지네이션(Pagination)이라고 이야기 합니다.

페이지네이션 구현 방법을 찾아보는 것을 추천 합니다.

쉽게 만들기도 가능하고 이미 만들어진 라이브러리를 사용할 수 도 있습니다.

개인적으로는 그냥 만드는게 편하기는 합니다

라이브러리의 경우 이미 만들어진 API 에 따라서 쉽게 적용이 가능하기도 하지만 그렇지 않은 경우도 있습니다.

Answer 3

게시판에서 나오는 페이지 주소는 웹서버단에서 처리를 해줘야 합니다

그래야 페이지 스킵할때 원활한 동작이 될 수 있습니다

님이 한번 해당 페이지 눌러보시면,

페이지 번호에 링크된 값들이 전부 상이한것을 보실 수 있습니다

그렇기에 자바스크립트에서 처리를 안하는것입니다.

억지로 하면 할 수 있겠지만 괜히 코드만 복잡해집니다

Answer 4

네 자바스크립트로 만들 수 있습니다.

구글이나 네이버 등에 js page navigation 이라고 검색하시면 예제와 함께 자세하게 설명 되어 있습니다.

기본적으로는 click event / location.href 등의 기본적 기능을 활용하여 만들게 됩니다.

참고하실만한 URL 추가로 적어드리니 확인해보시면 좋을것 같습니다.

https://nextjs.org/learn/basics/navigate-between-pages

https://www.w3schools.com/howto/howto_js_redirect_webpage.asp

Answer 5

안녕하세요~! 아하(Aha) 지식답변자 다라닝입니다.

질문하신 내용에 대하여 아래와 같이 답변 드립니다.

아무래도 페이징처리에 대한 문의로 보입니다.

페이지번호를 클릭할때마다 저장된 데이터를 인덱스에 맞게끔 처리하는것으로

보통 스타일을 본인이 직접 만드는데 시간이 걸려서 오픈소스를 많이 활용합니다.

구글에 자바스크립트 페이징 검색하시면

페이징바 소스가 있고 거기에 페이지번호 누를때마다 함수탈수있도록 프로그래밍하시면 됩니다

부족하지만 도움이 되셨기를 바라며 추가적인 문의가 필요하시면 답변 부탁드려요!