본문 바로가기

전체 글65

김영한 http강의 오늘부터 보기 시작했다. 아직 9개밖에 보지 않았지만 인상적이었던 부분에 대해 적도록 하겠다. 사실 학원에서 한 번 비슷한 내용을 들은 적이 있었는데 기본적인 용어조차 헷갈려서 내용이 머리에 들어오지 않았고, 그저 '들었었다'는 것만 기억에 남았다. 여튼 이 아홉 개의 강의를 통해 포트가 뭔지 조금 더 알 수 있었다. 예를들어 내 아이피주소가 100.100.100.100일 때 내가 유튜브를 보면서 메이플을 한다고 했을 때 메이플의 포트가 10이라고 치고, 유튜브의 포트가 20이라고 치면 넥슨에서 메이플에 대한 게임 정보를 100.100.100.100/10 이런 식으로 보내는 거고, 유튜브에서는 영상 정보를 100.100.100.100/20 이런 식으로 보내서 내 컴퓨터에서 100.100.100.100/1.. 2023. 8. 17.
디버깅 댓글, 대댓글의 구현을 완료 하고 자잘한 것들을 보기 좋게 fix한 뒤 이력서 지원을 위해 ppt를 만들기 전에 대충 한 번 확인해보는데 잘 되던 페이지네이션이 동작하지 않는 것이었다. 분명 전에는 잘 동작했었는데.. 뭐가 문제인가 하니 api로 받아오던 lastPage에 대한 정보가 12로 1~10페이지까지는 잘 동작하는데 >이 버튼을 눌러 다음 11~20 페이지를 출력하려고 하면 lastPage에 대한 정보가 0으로 바뀌는 것이었다. 무엇이 문제인지도 모르겠고 내가 짠 코드지만 주석이 없어서 이해하기도 어려웠다 ㅠㅠ. 힘들여 문제일것 같은 부분을 함축하고, 계속 console.log로 확인하다가 예전에 스쳐봤던 디버깅(?) 영상이 생각났다. https://www.youtube.com/watch?v=I.. 2023. 8. 15.
@Query와 @Modifying과 @Transactional @Query어노테이션을 사용하면 JPA에서 JPQL로 직접 작성할 수 있다는 것을 알고있었다. 그런데 오늘 알게 된 사실은 @Query만 적었을 때는 select문을 실행하는 것으로 인식하고 @Modifying을 적어야 Update문 혹은 Delete문을 실행할 수 있다고 한다. @Transactional은 트랜잭션을 관리하기 위해 있다고 하는데 이게 없으면 실행이 안 되던데 향후에 더 자세히 알아봐야 할 거 같다. 오늘은 너무 졸려서 집으로 돌아가야 할 거 같다. ps. 혹시 이 내용들이 jpa책을 읽었다면 그냥 손쉽게 넘어갔을 부분이 아닐까 걱정된다. ps2. 오늘 하루종일 한 게, 댓글입력+대댓글입력 뿐이라니..에효 2023. 8. 15.
DTO와 Entity / JPA Join돼 있는 값 빼오기 예전에 검색을 해봤을 때 둘의 차이를 읽어본 적 있지만 무슨 차이인지 인식을 못 했었다. 그 당시 DTO는 받아온 정보를 넘겨주는 역할 Entity는 테이블의 속성을 똑같이 만들어 두는 역할 이정도로 이해하고 넘겼는데. (물론 그러면서도 Entity만으로 정보를 넘겨 사용했었는데 왜 DTO가 있어야 하는지 몰랐다.) 여튼 이번에 알게된 사항은 ChatGPT가 알려준 부분이라 거짓말일 가능성도 있지만, 지금 이해한 것은 Entity는 테이블의 속성을 똑같이 만들어 두는 역할이고, 테이블에서 내가 원하는 항목만 빼오고 싶을 때 DTO를 만들어서 사용한다는 거 같다. JPA Join 돼 있는 값 빼오기 이걸 하려고 거의 세 시간 헛짓 한 거 같다. 그래도 다행인 점은 세 시간을 들여 방법을 찾아냈다는 것.. .. 2023. 8. 13.
vue history모드와 hash모드 history모드는 검색엔진에 검색이 된다고 하고, hash모드는 검색이 안 된다고 했다. 그래서 당연히 history모드가 좋구나 생각해서 사용했었는데 이게 history모드일 경우에는 url접속이 안 되는 거 같다. 그래서 실제로 배포하는 단계에서는 url을 입력하면 모든 걸 다 index로 보내버리고, 무조건 클릭으로 접근이 가능하게 만드는 거 같다. 예를들면 내가 게시글의 url이 www.localhost:8080/board/24 라는 걸 알아도 해당 페이지를 입력하면 www.localhost:8080/index로 보내버리는 거 같다. 그에비해 hash모드는 url에 www.localhost:8080/#/board/24 게시글을 치면 접속이 된다. 뭔가 이 둘을 섞은, 검색은 되면서 url로 접속.. 2023. 8. 12.
(생각)화면 움직이기? 거의 두 시간 동안 게시글 전환이 안 되 낑낑댔다. 그러던 중 vue lifecycle hook이 생각났다. onUpdate를 박으니 잘 되는 것 처럼 보였는데 자세히 보니 지 맘대로 돌아가고 있었다. 산 넘어 산이라고 온갖 뻘짓을 하다가 문득 '아니 화면단을 움직이는 것은 프론트엔드의 기술 아닌가? 당장의 취업을 위해서는 백엔드를 만져야 하는 거 아닌가?' 라는 생각에 힘이 쫙 빠졌다.. 뭔가 기운이 빠져 열 받은 머리가 차가워 졌는지 이내 해결책을 찾아냈다. 그리고 해당 문제를 해결하니 뭔가 할 맛이 뚝 떨어졌다. 오늘 하루동안 실제로 한 게 '검색', '페이지네이션', '디테일페이지', '페이지간 전환' 애매하다. 내일, 늦으면 모레 면접 결과를 알려주신다고 했는데 12대 1의 경쟁률이었는데 깝깝하.. 2023. 8. 8.
(vue) 부모에서 자식의 매소드 사용하기! 부모에서 자식 메소드를 어떻게 쓰는지 몰라 고생고생하다가(사실 인터넷에 다 올라와 있었는데 그 글을 보고서도 적용할 생각을 안 했었다.) 해결 해 적어본다. 자식 자식 부모 필요 없는 것들 떼고 요약하면 이렇게 사용하면 되는 거 같다. ps. 오늘 을 'vue3 setup script'라고 부른 다는 사실을 알게 됐고, 그냥 를 사용하면서 setup을 펑션스타일로 쓰는 경우에는 'vue3 setup function'이라고 부른다는 사실을 알게됐다. 2023. 8. 8.
(경험) int(Long)와 flot(Double) 페이지네이션 및 검색 기능까지 완료했다. 그 과정에서 int a = 36; double b = 36; double c = a/5; // 7.0 double d = b/5; // 7.2 System.out.println(c); System.out.println(d); 이 부분을 간과해 시간을 허비했다. c 같은 경우에는 Math.ceil(c)를 해봐야 7이라는 걸 간과하고 화면단에 잘못한 줄 알고 헛짓 하다가 Math.ceil(d)를 해야 8이 나온다는 게 문득 생각나 해결할 수 있었다. 오늘 세 가지 헛 짓 한 거 같다. 다음에는 안 해야지~ 2023. 8. 8.
(경험)조회와 검색과 페이지네이션. 학원의 팀프로젝트에서 게시판 및 검색기능을 만든 적이 있었다. (다시 생각해보니 검색기능은 없었던 거 같다.) 그 당시에는 기획자의 요구대로 무한스크롤 느낌의 페이지를 만들었어서 '조회와 검색과 페이지네이션'이 같이 있어야 하는 상황을 생각하지 못 했다. 여튼, 이번에 게시판을 만드는 연습을 하면서 이전 프로젝트의 어려웠던 점을 교훈 삼아 미리 figma로 화면을 다 구성하고 퍼블리싱까지 7~80%정도는 수행 한 뒤 진행했다. 순차적으로 api를 만드는 과정에서 나는 뒷일은 깨닫지 못하고 예전에 한 것처럼 page에 따른 조회하는 api를 만들었다. 그 뒤 오늘 검색 기능을 위해 검색 키워드에 따른 조회 api를 만들었다. 만든 것을 화면과 연결하는 과정에서 무엇인가 이질감(?)을 느꼈다. 생각해보니 이.. 2023. 8. 8.
Math.ceil 오늘 페이지네이션(?)을 만들며 너무 화가 났다. 남들과 비교하지 말자 남들과 속도는 달라도 방향은 같으니, 아마 그 대단한 사람들도 과거에는 이런 별것도 아닌 것에 고통을 받았겠지? 늦게 시작 했으니 이제 경험하는 것일 뿐이다. 오늘 있었던 일은 게시판의 페이지를 넘기는 것을 만드는 과정에 일어났다. 나는 요즘 자주 사용되는 이러한 형태의 페이지네이션이 아니라 가장 기본적인 1~10 / 11~20 / 21~30 이런 형태의 페이지네이션을 만들고 있었는데 문제는 이 표시를 눌러 10페이지씩 넘기는 부분에서 발생했다. 최초에 gpt에게 만들어달라고 했는데 내가 말을 이상하게 했는데 엉뚱한 대답만 했다. 한 두어번 정도 더 물어보고 답이 없어서 그냥 내 머리로 만들기로 했다. 쉽게 만들기 위해 먼저 .. 2023. 8. 7.
java의 다중상속 금지 어쩌다 보니 'java는 다중상속이 금지 돼 있다.'라는 글을 봤다. 생각해보면 학원에서 배울 때 extends는 여러 개 못하지만 implements는 여러 개 가능하다고 배웠던 기억이 있다. (아마 강사님이 설명해주셧을 수도 있는데 난 딱 저정도만 기억하고 있다 ㅎㅎ;) 여튼, 오늘 본 소스에서는 'human클래스의 walk()메서드를 female과 male에서 상속받았다고 했을 때, female과 male을 다중상속한 person 클래스에서는 walk()코드의 충돌이 발생하게된다.' 이런 설명을 해줬다. 이해가 빡 갔는데 그럼 왜 interface는 여러개 구현할 수 있는데?!?! 처음 생각한 것은 어차피 interface는 만들 것들을 약속 해두는 것일 뿐이니까, 매소드(?) 명이 중복 돼도 만들.. 2023. 8. 6.
fetch와 uri/url 궁금했었으나 알아볼 기회가 없었는데 이번에 알게된 부분에 대해 적어본다. 1. onMounted(() => { // 데이터 값 받아오기 var requestOptions = { method: 'GET', redirect: 'follow' }; fetch(`http://localhost:8080/board/PaginatedBoard?page=${page.value}`, requestOptions) .then(response => response.json()) .then(result => { data.value=result; console.log("하하") }) .catch(error => console.log('error', error)); console.log("호호") }) 이 코드를 실행했을 때 왜 .. 2023. 8. 6.