실시간TAG
빌런 TOP 20
일간 l 주간 l 월간
1
[컴퓨터] 조텍, 지포스 RTX 5070 Ti 그래픽카드 2종 특가 판매 진행
2
[컴퓨터] 조텍 VIP 대상, 신년 맞아 그래픽카드 정비 제공하는 ‘조텍 VIP 정비소 오픈’
3
[일상/생활] 다들 저녁 맛있게드세요~!
4
[버그/건의] 쪽지 보내기 작동을 안합니다.
5
[일상/생활] 워쉽 8티어 골쉽 득템??ㅋㅋㅋㅋ
6
[전자부품] YMTC, 중국 내 DRAM 생산 돌입… 지역 HBM 공급난 타개 노린다
7
[모바일] 삼성, 첫 트리플 폴더블폰 ‘갤럭시 Z 트라이폴드’ 공개 임박
8
[일상/생활] 에즈락 이제 등록 되네요.ㅋ
9
[일상/생활] 윈도우11 25H2 인사이더 프리뷰 판올림 후기
10
[PC/가전핫딜] 한성컴퓨터 TFG27Q18P 27인치 Fast IPS QHD 180Hz 게이밍 모니터
11
[컴퓨터] AMD Radeon GPU Price Increase: 8GB는 $20, 16GB는 최대 $40 인상… 2026년 내내 더 오를 가능성
12
[컴퓨터] AI 업계의 폭발적 수요에 인텔, ‘EMIB’ 첨단 패키징을 암코로 외주… 한국 인천에서 생산
13
[이슈/논란] Ai 사진 구별하기 더 어려워 지네요
14
[컴퓨터] 차세대 맥북프로 확 바뀐다…기대되는 5가지 변화
15
[컴퓨터] 아이피타임, BE9400급 와이파이 공유기 아이피타임 BE9400QCA 출시 및 포토 리뷰 이벤트
16
[컴퓨터] 1240P 미니 PC를 조심하세요
17
[컴퓨터] LG, 2026년형 LG 그램 출시 이벤트 진행
18
[컴퓨터] 버튼으로 투명해지는 어항케이스
19
[PC/노트북] 해외 커뮤니티 탑 1% 유저
20
[컴퓨터] 서린씨앤아이, 6.86인치 IPS LCD 장착한 서멀라이트 트로페오 비전 360 ARGB 출시
인텔 코어 울트라7
사소하게 신경쓰이는 것들이 있어서 확인 부탁드립니다. 메뉴에 스크롤바 생기는 문제.. 어제 대장님이 양식을 제대로 지킨 회원들을 대상으로 포인트 100을 가져가셨다 했는데 보니까 이거 내용이 살짝 이상하지 않나요? ㅋㅋㅋㅋㅋㅋ 활동 포인트 → 가용 포인트 (사용이 가능한 포인트) 누적 포인트 → 누적된 포인트 (소모된 포인트까지 합계 되어 표기되는 포인트) 처럼 보였는데 반대로 적용이 되어서 이 부분이 맞나? 싶어서 글 한번 적어봤습니다 메인페이지 하단 전체 게시글 표기되는 부분에서 페이지네이션에서 비공개, 삭제 글들이 전체 페이지네이션에 포함되어 실제 게시글은 36페이지이지만 38페이지까지 표기가 되네요. 보이는 대로 계속 글 적어보겠습니다. 아참, 그리고 youtube 임베드 반환하는 코드 보니까 https://youtu.be/Bqb2xEr3DQw?si=wiPnZ77XL-vu9I_6 이렇게 값이 넘어오는 건지 이렇게 embed 설정이 되어 있더라구요? https://villain.city/static/js/common/oembed.js?version=0.1.22 이건 뭔지 모르겠습니다만.. 유튜브 iframe 관련 글이 있더라구요.. 근데 실제로는 동작하는거 같진 않고 반환되는 코드를 살펴보니 <iframe class="w-full aspect-video" src="https://www.youtube.com/embed/Bqb2xEr3DQw?si=wiPnZ77XL-vu9I_6" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="no-referrer" allowfullscreen=""></iframe> 이렇게 반환되던데 <iframe src="https://www.youtube.com/embed/Bqb2xEr3DQw" class="w-full aspect-video" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen=""></iframe> 이렇게만 반환되어도 정상 동작할텐데 실제 테스트 해본 결과 실제로 오류나는게 확인. 반대로 제가 적은 iframe 태그로 적용하면 정상 출력되는 것이 확인. 뭔가 iframe 반환하는 규칙에서 오류가 있는 것으로 보입니다. 참고로, 저건 에디터가 아니라 게시글의 html만 수정해본거라 안될수도 있습니다.
2025.09.09
3
0
아직 미흡한 기능들 댓글 추적/알림 기능 → 대댓글이 달리면 알아볼 수 있도록 알림 기능이 있어야 하는데 누가 답글 달면 직접 가서 확인하지 않는 이상 대댓글에 답장하기 어려움 쪽지 기능 → 사실상 되는지 알 수 없음. 우측 하단 랭킹기능 → 거의 고정된 상태.. 지금 기억나는 미흡한 기능들은 이정도이고.. 제가 기억안나서 그래요.. 엄청 많은데 기억이 안나요.. 마지막 디버깅 이후 새롭게 찾은 오류 또는 문제 아니면 지속적으로 나타나고 있는 오류 누군가 추천을 눌러줄 순 있음.(좋아요 아닙니다.) 다만, 그 이후에는 그 아무도 추천을 눌러줄 순 없음. (?) 이미 다른 사람이 댓글 추천을 누른거에 또 별을 눌러보니 취소할꺼냐는 메세지가 뜸. 그래서 눌러보면? 네트워크에서는 200으로 반환됨. 다만, 상태는 변경되지 않음. 애매한 이 추천 기능 .. 어디에 쓰려고 만든 기능인지 궁금하기도 하네요.. 좋아요랑 또 별개로 되는 거라.. 대댓글 N가 아직도 해지가 되지 않아 프로필의 댓글 : {int}가 카운트가 차감되지 않는 문제. 타인 게시글에서 타인(작성자)가 본문을 확인하지 않는다면 N로고가 그대로 남아있는 문제(?) (8월 2일이니 30일은 넘게 유지된셈) 즉, 시간대가 지나 N이 사라지는 것이 아닌 작성자가 확인하지 않으면 N이 사라지지 않는 것. (카톡 1 과 같은 느낌..) 페이지 끝단 이동시 마지막 페이지가 이상하게 이동됨. 위 사진의 URL에서는 page=21로 끝나는 페이지 하지만 실제 종료되는 페이지는 page=20 그리고 pagenation도 오류 나는지 하단 페이지 표기가 되지 않는 문제 발생 아마, 페이지뷰가 비공개/삭제 된 게시글도 카운트에 포함이 되었는데 실제 표기되는 것은 그보다 적으니 생긴 문제로 보임. page=2에서 page=3이되어도 댓글 리스트는 변경되지 않는 문제 이건 그냥 DB에 SELECT 를 제대로 설정을 안해서 생긴걸로 보임. 카테고리가 대분류>중분류>세분류 형식인데 중분류만 선택되어도 글이 등록이 가능함 이건 일부 수정하면 바뀔 순 있을 듯. 이렇게 써놨는데 이렇게 표기되는 문제도 있었네요? 이건 에디터 문제인듯.. 이미지 붙이고 싶어서 글자랑 같이 표기되도록 해놨는데 사진크기를 줄였음에도 원본 크기로 나오고 하는거 봐선.. 음~
2025.09.05
2
1
그냥 전체적으로 해결 하는 방법 공유해드리겠습니다. 지금 PC 버전에서는 칸 분리가 잘 이뤄지기 시작했는데, 정작 모바일은 그대로더라구요. row-span-2를 없애고, md:row-span-2로 두시고, 기본값은 row-auto로 두세요. 즉, 반환되는 class는 row-auto md:row-span-2로 두시면 됩니다. md: ← 이건 tailwind css 반응형 접두사인데 min-width:768px에서만 이 클래스를 적용시키기 위해 사용하는 접두사에요. 즉 md:col-span-2는 가로 768px 이상일 경우 col-span-2를 적용하고 768px 이하일 경우에는 col-span-2를 적용해제한다는 뜻이죠. 지금 코딩을 둘러보면 정상적으로 적용시키면 이런식으로 코딩이 되어야 합니다.. 그래야 이런식으로 표기가 잘 됩니다.. 결과를 미리 봐보고 싶다면 브라우저에 개발자도구 키고 (function normalizeGridSpans(){ const els = document.querySelectorAll('[class*="row-span-"], [class*="col-span-"]'); els.forEach(el => { const classes = Array.from(el.classList); // 숫자 추출 함수 const getSpanNums = (prefix) => { const base = classes .filter(c => new RegExp(`^${prefix}-span-(\\d+)$`).test(c)) .map(c => +c.split('-').pop()); const md = classes .filter(c => new RegExp(`^md:${prefix}-span-(\\d+)$`).test(c)) .map(c => +c.split('-').pop()); return { base, md }; }; // 정규화 함수 const normalize = (prefix, autoClass) => { const { base, md } = getSpanNums(prefix); // 1) 기존 span 클래스 전부 제거 classes .filter(c => new RegExp(`^(md:)?${prefix}-span-(\\d+)$`).test(c)) .forEach(c => el.classList.remove(c)); // 2) 모바일은 auto 고정 el.classList.add(autoClass); // 3) md에서 유지할 숫자 결정: md에 있던 숫자 > base에 있던 숫자 const keep = md[md.length - 1] ?? base[base.length - 1]; // 4) 숫자가 있었다면 하나만 md로 재적용 if (keep) el.classList.add(`md:${prefix}-span-${keep}`); }; normalize('row', 'row-auto'); normalize('col', 'col-auto'); }); })(); 해당 코드 입력해보세요. 만약 붙여넣기 오류 난다면 한글로 그냥 붙여넣기 허용 이라고 입력하고 엔터하면 붙여넣기 됩니다.
2025.08.11
1
1
디버깅을 해드리다보니 독학으로 코딩을 배운 제 입장에서 얼마나 디버깅이 중요한지 깨닫게 되었습니다? ㅋㅋㅋ 사실 독학이다보니 개발자로 일하지 않고, 원래 하는 업종은 따로 있어서 .. 그 업종을 하면서 간간히 독학으로 배운 코딩을 연습해보는 편이다보니 아무래도 뒤집기가 쉬웠습니다 ㅎㅎ;; 디버깅을 안하고 뒤집기 일수이고, 스파게티 코딩으로 인해 버그를 발견해도 해결하지 못하는 경우도 허다했죠.. 그래서 이것저것 찾아드리면서 “아, 이런게 문제가 될 수 있구나~” 하는 마음으로 틈날때마다 사이트를 찾아와 디버깅을 하고 있습니다. 물론, 지금 쓰는 이 글은 두번째 작성중입니다. 왜 오류가 났냐면.. gif를 올리려고 하면 용량 제한이 걸리는지 업로딩 실패가 되어, URL로 삽입을 하니 500 코드로 반환되더군요..(?) 아무튼 그렇게 제 코드를 보다보면 이런 생각이 들어서 갑작스레 적어본 똥글입니다. 아참, 대장님 https://villain.city/contents/view/357 이거 보셨는지요..? 피드백이 없으셔서 못보신건가.. 메인페이지가 바뀌질 않고 있어서 다시 한번 언급해봅니다 ㅋㅋ 지금은 왜 또 되는 것이지..? 카테고리가 ROOT > 로 표기되던데.. 올라갈때 뭐 이상하게 올라갔나..
2025.08.11
2
3
지금 현재 빌런의 모바일은 정말 빌런 다운 버그가 일어나 있는 상황입니다. 무슨 버그냐구요? 모바일에서는 2번째에 있는 게시글이 앞 게시글을 잡아먹는 버그가 있습니다. 이렇게 보이던 게시글이 해상도를 줄이면? 이런식으로 잡아먹히는 문제이죠. 콘솔을 통해 보면 앞 게시글의 가로 사이즈 354px이하로 내려가자마자 뒷 게시글로 크기가 이동되는 것이 보이지요? 왜 이런 문제가 생기느냐.. 바로 이 div를 합치는 구간 때문에 발생됩니다. 반응형 웹 페이지는 별도로 모바일 웹버전인 (m.villain.city) 이런식으로 들어가지 않아도 똑같은 URL을 통해 모바일과 데스크탑을 함께 사용 할 수 있도록 만들어진 웹 페이지를 반응형 웹페이지라고 합니다. 반응형 웹페이지의 장점은 모바일 웹으로 구성하면 2개의 웹소스를 운용하거나, 2개의 웹페이지를 별도로 제작해야 한다는 단점이 있던 것을 하나로 관리할 수 있다는 장점이 있습니다. 대신에 두 개로 나눠서 관리하던 것을 하나로 관리해야 하는 점에서 class 같은 지정을 제대로 운용해야 합니다. 근데 빌런은 그 운용을 제대로 하지 못하여 모바일로 접속시 제대로 된 페이지 표기가 되지 않았던 것이죠. 모바일로 보면 게시글은 1열로 표기 되어야 하는데 기본 값이 2열로 설정되어 있어 1칸으로 바뀌었지만 없는 1칸을 또 만들어서 2열로 만들다보니 기존에 있던 좌측의 div 칸을 집어 먹어버리는 문제가 발생해버린 것이죠. 이 문제가 되는 col-span-2와 row-span-2 를 지워버리면? 이랬던 게시글 상태가 이렇게 숨겨졌던 게시글이 표현되면서 정상적으로 변경되는 것을 확인할 수 있었습니다. row-span-2와 col-span-2가 어디서 반환되는지 찾아보려 했는데.. 애초에 carouselMain.js를 통해 값이 반환되는 것으로 보이더군요. api로 어떻게 반환되는지는 모르겠습니다만.. main.html을 이용해서 반환되는 것을 봤습니다. 근데 main.html인데 게시글을 끌어오는 html 소스이면 조각 형태로 해야 하는데 전체코드 형태로 해두셨더라구요..? (왜죠?) 아무튼 api 통신을 통해서 값을 가져온 것을 처리하는 것이라 제가 그 이상의 추적은 어렵게 되었.. 근데 여기서 모바일만 해결 되느냐? 아뇨. 기존에 데스크탑 메인페이지에서 한 줄에 2개의 게시글이 들어가던 문제도 이렇게 해결됩니다. 즉, 이 메인 페이지의 악의 근원은 row-span-2와 col-span-2의 return의 문제였답니다~ 자, 개발이사님. 일하실 시간입니다.
2025.08.10
2
3
문제 사항. XSS 관련 보안 위험 서버에서 응답 되는 값들을 살펴보는 중 문제가 될 수 있는 사항을 발견함. X-XSS-Protection을 Value를 0으로 설정함. 이는 웹 브라우저에게 서버가 “이 사이트는 XSS 보호기능 끄세요.” 라고 지시한거임. 이건 XSS 보안관련 위험문제가 높음. 여기에 플러스로 더 위험한건 바로 게시글을 조회할때 발생하는 API 중 하나인 https://www.villain.city/api/auth/check 이거임. 왜? 여기에 반환되는 응답값에는 이전에 작성했던 개인정보가 여기서도 똑같이 표기되기 때문임. 여기서 필요한 것은 roles와 role, 그리고 block, black뿐임. 즉, 그 위에 있는 userId 외의 다른 개인정보를 서버에서는 반환하여선 안됨. XSS 프로 텍터가 꺼져있는 상태에 이게 js로 반환이 된다? 그러면 중간에 누군가가 이 응답 값을 가로 챌 수 있다는 것임. CKEditor를 사용하고 있는데 CKEditor도 필터링을 통해 HTML 소스 같은 것들을 표기하지 못하도록 기능을 구현해놓고 있지만, 하지만 무언가에 의해 필터링을 피해 입력할 수 있다면? 그 순간 api/auth/check를 통해 개인정보를 모두 취득할 수 있게 됨. script로 공격자 서버에다가 이 데이터를 넘기게 설정할 수 있으니까. 그러면 해킹을 직접적으로 당한 것이 아니라서 서버나 관리자도 이는 눈치 채지도 못할 것이고, 그러다 개인정보 털리면? 큰일나게 되는거임.. 그리고 어떤 api에서 개인정보를 반환합니까.. 저도 독학으로 프로그래밍 배웠지만 프로그램에서 사용자 정보 수정 외에는 사용자의 데이터에서 접근 할 수 있어야 하는 건 사용자의 ID만 접근 할 수 있어야 합니다. 또한, 설정 관련해서 Access-Control-Allow-Origin: * 이게 뭔지 아십니까? 어디서든 이 URL를 맘대로 조회할 수 있다는 뜻입니다. 그러면 무슨 문제가 있느냐.. 어디서든 API를 조회요청을 할 수 있고, 서버는 이 요청을 무시하지 않고 답변을 해준다는 것입니다. 즉, 지금 어떤 방식으로 auth 데이터를 수신요청하고 있는지는 아직 확인이 안되었지만 공격자가 사용자의 정보를 얻기 위해 전송되는 값을 알게 된다면 api요청을 통해 auth 데이터를 요청할 수 있고, 서버는 모든 주소를 허용했기 때문에 그 요청에 개인정보를 그대로 넘겨줄 수 있다는 뜻입니다.
2025.08.02
3
2