173만명의 커뮤니티!! 함께 토론해봐요.
미해결
2022 30분 요약 강좌 시즌 1 : HTML, CSS, Linux, Bootstrap, Python, JS, jQuery&Ajax
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. codesandbox 문서 버튼이 안보여요 코딩실습을 해야하는데 문서 버튼이 아예 없어서 어딜 눌러서 코딩을 해야할지...
미해결
스프링 시큐리티
안녕하세요 이렇게 좋은 Spring Security에 애를 많이 먹던 도중 늦게나마 열심히 듣고 있는 사람입니다. 강의를 들으면서 Spring Security 6.0 이상 버전으로 혼자 마이그레이션 해보며 공부를 진행하는데요.. 다른 분들은 모르겠지만 저는 6.0 이상 버전에서의 다중 보안 설정에서 애를 좀 먹어서.. 혹시나 저 같으신 분들이 있으실까봐 글을 남깁니다..! 다름이 아니라 Spring Security 6.0 이상 버전에서는 먼저 오버라이드해서 함수를 구현하는 것이 아니라 컴포넌트화 시켜서 진행합니다. 또한 HttpSecurity 안의 내용을 구현하는데 변경점이 있다는 것이 가장 큰 차이점인 것 같습니다. 예를 들어 UserSecurityConfig, AdminSecurityConfig를 만들어서 각 경우에 따라 다른 설정을 적용하고 싶은 경우에 두 가지의 config 파일을 만들 수 있다고 가정하면.. 저의 경우에는 AdminSecurityConfig에서 지정한 부분이 권한 정보에 따라 접근이 막히지 않고 다 접근이 가능한 ("/admin/pay"를 user가 접근 가능) 상황이었습니다. 뭐가 문제인지 한참을 찾던 도중 https://docs.spring.io/spring-security/reference/servlet/configuration/java.html 공식 문서를 통해 답을 찾았습니다. 간략하게 해결법부터 말씀드리자면 path로 접근 제한을 하는 경우에 http.securityMatcher()를 사용해야 한다는 점 입니다. 이렇게 하면 아주 잘 구분이 되더군요..! 혹시나 저처럼 하시는 분이 계실까봐 남깁니다..! @Bean @Order(0) public SecurityFilterChain adminFilterChain(HttpSecurity http) throws Exception{ http .securityMatcher("/admin/pay") .authorizeHttpRequests(request -> request.anyRequest().hasRole("ADMIN")); return http.build(); } @Bean @Order(1) public SecurityFilterChain systemFilterChain(HttpSecurity http) throws Exception{ http .securityMatcher("/admin/**") .authorizeHttpRequests(request -> request .anyRequest().hasAnyRole("SYS", "ADMIN")); return http.build(); } @Bean @Order(2) public SecurityFilterChain filterChain(HttpSecurity http) throws Exception{ http .authorizeHttpRequests(request -> request .requestMatchers(antMatcher("/user/**")).hasRole("USER") .anyRequest().authenticated());
미해결
UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략
안녕하세요, 맨 첫 강의인 <header영역 레이아웃> 수업을 듣고 있는데, 강의 내용과 똑같이 진행하였으나 Css가 적용되지 않아 질문 드립니다. Google에 검색을 통해 쿠키 삭제, link대신 @import 사용 등을 실행했으나 결과는 똑같았고, F12 눌러 개발자용 모드로 확인 해보았는데 css가 작동되지 않는다는 알림만 뜰 뿐 해결책을 찾지는 못했습니다. 이러한 경우에 어떻게 해결할 수 있을까요? 미리 답변 감사드립니다.
미해결
초보자도 만들 수 있는 스크롤 인터렉션. 1편 자바스크립트
2-1[코드설명]기초다지기! 강의에서 질문1. 코드에서 render함수가 정의되기 전에 getPercent함수에서 render를 호출(실행)하는게 이해가 안되요.. ㅜ_ㅜ 함수가 값도 되기 때문에 값을 전달하면서 동시에 호출도 하는것이 가능 한건가요? 질문2. function init(){ getPercent(); }; 이렇게 초기화 하는건 기본으로 꼭 해야하는 동작인가요 질문3. javascript 기초를 듣고 왔는데 익숙해질때까지 강의를 반복수강하는것 말고 익숙해지는 방법이 또 있을까요? 기초를 복습할 수 있는 아주 쉬운 예제가 있는 사이트들이 있다면 추천 부탁드립니다.
미해결
재고시스템으로 알아보는 동시성이슈 해결방법
좋은 강의 너무 감사합니다. 강의를 보며 궁금한 점이 생겨서 질문 드립니다. named lock을 통해 동시성 문제를 해결하는 예시를 보았을 때, 비관적 락과 무엇이 다른 것인지 큰 차이를 느끼지 못했습니다. named lock이 비관적 락에 비해 가지는 장단점에 비해 찾아보니, timeout 설정이 좀 더 간편하다는 내용 말고는 유의미한 차이를 찾지 못했습니다. (그러나 비관적 락 + queryhint 를 사용하면 비관적 락 사용 시에도 딱히 어려움 없이 timeout을 설정할 수 있었습니다.) 혹시 named lock이 비관적 락에 비해 지니는 장단점과, 어떤 경우에 비관적 락 대신 Named lock을 통해 분산락을 구현하시는지 궁금하여 질문드립니다.
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 빈 배열 객체 생성 let infowindow = []; 거기에 for문 돌면서 infowindow 집어넣기 infowindowArray.push(infowindow); 1,2번 까지는 말 그대로 빈 배열객체를 생성후 기존의 infowindow를 집어넣어 기존의 자료가 들어간 infowindowArray를 만든것까진 알겠는데 그 이후에 3. function closeInfoWindow(){ for (let infowindow of infowindowArray){ infowindow.close(); } }; 이게 무슨 말 일까요? 사실 모든 원리가 잘 이해가 되질 않습니다..ㅜㅜ 기존에는 그냥 인포윈도우 클릭하면 해당정보가 나타나고 그것을 다른 것을 누르면 끄려 그러는데 왜 빈 배열객체를 만드는지 부터 잘 이해가 안되네요..
미해결
[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
result 페이지에서 결과가 안 나와요 resultname, resultdesc가 안 뜨는데 이미지는 선택된 결과 제대로 뜨는 걸로 봐선 알고리즘엔 문제가 없는데 어디서 잘못된 걸까요? 제 코드는 이렇습니다. const main = document.querySelector("#main"); const qna = document.querySelector("#qna"); const result = document.querySelector("#result"); const endpoint = 6; const select = [0, 0, 0, 0, 0, 0]; function claResult() { console.log(select); var result = select.indexOf(Math.max(...select)); return result; } function setResult() { console.log(name); let point = claResult(); const resultname = document.querySelector('.resultname'); resultname.innerHTML = infoList[point].name; var resultImg = document.createElement('img'); const imgDiv = document.querySelector('#resultImg'); var imgURL = '../image/image-' + point + '.png'; resultImg.src = imgURL; resultImg.alt = point; resultImg.classList.add('img-fluid'); imgDiv.appendChild(resultImg); const resultDesc = document.querySelector('.resultDese'); resultDesc.innerHTML = infoList[point].desc; } function goResult() { qna.style.WebkitAnimation = "fadeOut 1s"; qna.style.animation = "fadeOut 1s"; setTimeout(() => { result.style.WebkitAnimation = "fadeIn 1s"; result.style.animation = "fadeIn 1s"; setTimeout(() => { qna.style.display = "none"; result.style.display = "block"; }, 450) }) setResult(); } function addAnswer(answerText, qIdx, idx) { var a = document.querySelector('.answerBox'); var answer = document.createElement('button'); answer.classList.add('answerList'); answer.classList.add('mx-8'); answer.classList.add('py-3'); answer.classList.add('mx-auto'); answer.classList.add('fadeIn'); a.appendChild(answer); answer.innerHTML = answerText; answer.addEventListener("click", function () { var children = document.querySelectorAll('.answerList'); for (let i = 0; i < children.length; i++) { children[i].disabled = true; children[i].style.WebkitAnimation = "fadeOut 0.5s"; children[i].style.animation = "fadeOut 0.5s"; } setTimeout(() => { var target = qnaList[qIdx].a[idx].type; for (let i = 0; i < target.length; i++) { select[target[i]] += 1; } for (let i = 0; i < children.length; i++) { children[i].style.display = 'none'; } goNext(++qIdx); }, 450) }, false); } function goNext(qIdx) { if (qIdx === endpoint) { goResult(); return; } var q = document.querySelector('.qBox'); q.innerHTML = qnaList[qIdx].q; for (let i in qnaList[qIdx].a) { addAnswer(qnaList[qIdx].a[i].answer, qIdx, i); } var status = document.querySelector('.statusBar'); status.style.width = (100 / endpoint) * (qIdx + 1) + '%'; } function begin() { main.style.WebkitAnimation = "fadeOut 1s"; main.style.animation = "fadeOut 1s"; setTimeout(() => { qna.style.WebkitAnimation = "fadeIn 1s"; qna.style.animation = "fadeIn 1s"; setTimeout(() => { main.style.display = "none"; qna.style.display = "block"; }, 450) let qIdx = 0; goNext(qIdx); }, 450); }
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>a연습</title> <link rel="stylesheet" href="css/a연습.css"> </head> <body> <div class="container"> <header> <div class="header-logo"></div> <div class="navi"> <ul class="menu"> <li> <a href="#none">탑</a> <div class="sub-menu"> <a href="#none">블라우스</a> <a href="#none">티</a> <a href="#none">셔츠</a> <a href="#none">니트</a> </div> </li> <li> <a href="#none">아우터</a> <div class="sub-menu"> <a href="#none">자켓</a> <a href="#none">코트</a> <a href="#none">가디건</a> <a href="#none">머플러</a> </div> </li> <li> <a href="#none">팬츠</a> <div class="sub-menu"> <a href="#none">청바지</a> <a href="#none">짧은바지</a> <a href="#none">긴바지</a> <a href="#none">레깅스</a> </div> </li> <li> <a href="#none">악세사리</a> <div class="sub-menu"> <a href="#none">귀고리</a> <a href="#none">목걸이</a> <a href="#none">반지</a> <a href="#none">팔찌</a> </div> </li> </ul> </div> </header> <div class="slide"> <div></div> </div> <div class="items"> <div class="news"> <div class="tab-inner"> <div class="btn"> <span class="active">공지사항</span> <span>갤러리</span> </div> <div class="tabs"> <div class="tab1"> <a class="open-modal" href="#none">운영위원장 후보자 추천을 받고 있습니다. <b>2020.01.09</b> </a> <a href="#none">홈커밍데이 진행위원회 결과를 다운로드 받으세요. <b>2020.01.07</b> </a> <a href="#none">카드결제 무이자 이벤트 한시적 10월 20일까지 <b>2019.12.31</b> </a> <a href="#none">보안강화 시스템 작업 안내 공지 <b>2019.12.20</b> </a> <a href="#none">부여 가을연꽃축제 10주년 콘서트 축제 <b>2019.12.20</b> </a> </div> <div class="tab2"> <a href="#none"><img src="imges/d-1images/gallery-1.jpg" alt="gallery1"></a> <a href="#none"><img src="imges/d-1images/gallery-2.jpg" alt="gallery2"></a> <a href="#none"><img src="imges/d-1images/gallery-3.jpg" alt="gallery3"></a> </div> </div> </div> </div> <div class="banner"></div> <div class="shortcut"></div> </div> <footer> <div class="footer-logo"></div> <div class="copyright"></div> <div class="sns"></div> </footer> </div> <div class="modal"> <div class="modal-content"> <h2>부여 가을연꽃축제 팸투어 모집</h2> <p>예비 청년상인들을 위해 진행하는 부여에서 청춘의 미래를 디자인하다. 청년창업人부여 팸투어가 12월 05일 토요일 충청남도 부여에서 진행됩니다. 팸투어는 전액 무료로 진행되며 참가비 없습니다. 이번 팸투어에서는 부여군상권활성화재단의 청년상인 육성프로젝트를 실제로 견학하며 확인해 보실 수 있는 좋은 기회이니 창업을 희망하는 많은 청년 분들의 관심 부탁드립니다. 온라인 및 전화 또는 메일 등으로 사전 참가신청하실 수 있습니다!</p> <a class="close-modal" href="#none">닫기</a> </div> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/연습용custom.js"></script> </body> </html> @charset "UTF-8"; body{ margin: 0; background-color: #fff; } a{ font-size: 15px; color: #333; list-style: none; text-decoration: none; } .container{ border: 1px solid #000; width: 1200px; } header{ display: flex; justify-content: space-between; } header > div{ border: 1px solid #000; height: 100px; } .header-logo{ width: 200px; } .navi{ width: 600px; } .menu{ padding: 0; list-style: none; margin-top: 30px; } .menu li{ float: left; width: 25%; text-align: center; box-sizing: border-box; } .menu li > a{ border: 1px solid pink; display: block; padding: 5px; transition: 0.5s; } .menu li:hover > a{ background-color: pink; color: #fff; } .sub-menu{ border: 1px solid pink; display: none; } .sub-menu a{ display: block; padding: 5px; transition: 0.5s; } .sub-menu a:hover{ background-color: palevioletred; color: #fff; } .slide{} .slide > div{ border: 1px solid #000; height: 300px; } .items{ display: flex; } .items > div{ border: 1px solid #000; height: 200px; } .news{ width: 500px; } /*tab-inner*/ .tab-inner{ width: 97%; margin: auto; margin-top: 5px; } .btn{} .btn span{ border: 1px solid #000; display: inline-block; width: 100px; margin-right: -6px; padding: 4px; text-align: center; border-radius: 7px 7px 0 0; background-color: #ddd; border-bottom: none; margin-bottom: -1px; cursor: pointer; } .btn span.active{ background-color: #fff; } .tabs{} .tabs > div{ border: 1px solid #000; height: 150px; } .tab1{} .tab1 a{ display: block; border-bottom: 1px dashed #000; padding: 5px; } .tab1 a:last-child{ border-bottom: none; } .tab1 a b{ float: right; font-weight: normal; } .tab2{ display: none; } .banner{ width: 350px; } .shortcut{ width: 350px; } footer{ display: flex; } footer > div{ border: 1px solid #000; height: 100px; } .footer-logo{ width: 200px; } .copyright{ width: 800px; } .sns{ width: 200px; } /*modal*/ .modal{ background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; } .modal-content{ background-color: #fff; width: 400px; height: 400px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .modal-content h2{ background-color: powderblue; text-align: center; } .modal-content p{ line-height: 1.5em; padding: 10px; } .close-modal{ border: 1px solid #000; padding: 5px 5px; margin-right: 30px; float: right; } /*tab-inner*/ $('.btn span:first-child').click(function(){ $('tab1').show() $('tab2').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) $('.btn span:last-child').click(function(){ $('tab2').show() $('tab1').hide() $(this).addClass('active') $(this).siblings().removeClass('active') }) 갤러리부분에 이미지도 넣어놨는데 tab2 부분이 안나타나고 tab1 부분만 그대로 나와움직이질않습니다 span부분클릭해도 tab1부분만 나와있어요 어디서부터 잘못된걸까요 전에꺼랑 비교햇을때 똑같은데 어떤게 잘못됫나요 ,,,
해결됨
[코드캠프] 시작은 프리캠프
안녕하세요 강사님! 덕분에 잘 완강해서 파이널과제까지 마쳤습니다. 뭔가 이어서 배포까지 하는 프로젝트를 하나 만들어보고 싶은데 고농축 프론트엔드 수업?이거 강의를 들으면 도움이 될까요? 학습방향이 궁금해서 여쭤봅니다! 그리고 뭔가 프로젝트 하나를 만들 때 피그마를 사용해야 하는 걸로 알고 있는데, 이건 본인이 직접 만들어서 프로젝트에서 적용하는 건가요? 아니면 프리캠프에서 했던 것 처럼 피그마 예시를 주고 거기다가 하는건가요?
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>b-2레이아웃</title> <link rel="stylesheet" href="css/b-2.css"> </head> <body> <div class="container"> <div class="header-inner"> <header> <div class="header-logo"></div> <div class="navi"> <ul class="menu"> <li> <a href="#none">menu1</a> <div class="sub-menu"> <a href="#none">sub-menu1</a> <a href="#none">sub-menu2</a> <a href="#none">sub-menu3</a> <a href="#none">sub-menu4</a> </div> </li> <li> <a href="#none">menu1</a> <div class="sub-menu"> <a href="#none">sub-menu1</a> <a href="#none">sub-menu2</a> <a href="#none">sub-menu3</a> <a href="#none">sub-menu4</a> </div> </li> <li> <a href="#none">menu1</a> <div class="sub-menu"> <a href="#none">sub-menu1</a> <a href="#none">sub-menu2</a> <a href="#none">sub-menu3</a> <a href="#none">sub-menu4</a> </div> </li> <li> <a href="#none">menu1</a> <div class="sub-menu"> <a href="#none">sub-menu1</a> <a href="#none">sub-menu2</a> <a href="#none">sub-menu3</a> <a href="#none">sub-menu4</a> </div> </li> <div class="sub-back"></div> </ul> </div> </header> </div> <div class="content-inner"> <div class="slide"> <div> <a href="#none"><img src="imges/d-1images/slider01.jpg" alt="slide1"></a> <a href="#none"><img src="imges/d-1images/slider02.jpg" alt="slide2"></a> <a href="#none"><img src="imges/d-1images/slider03.jpg" alt="slide3"></a> </div> </div> <div class="items"> <div class="news"></div> <div class="gallery"></div> <div class="shortcut"></div> </div> </div> <div class="footer-inner"> <footer> <div class="copyright"></div> <div class="sns"> <div></div> </div> </footer> </div> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script> </body> </html> @charset "UTF-8"; body{ color: #333; margin: 0; background-color: #fff; } a{ list-style: none; text-decoration: none; color: #333; } .container{} .header-inner{ background-color: #eee; } .content-inner{} .footer-inner{ background-color: #eee; } header{ width: 1200px; margin: auto; display: flex; justify-content: space-between; position: relative; } header > div{ border: 1px solid #000; height: 100px; } .header-logo{ width: 200px; } .navi{ width: 600px; } /*navigation*/ .menu{ padding: 0; list-style: none; margin-top: 70px; } .menu li { float: left; width: 25%; box-sizing: border-box; text-align: center; } .menu li > a{ border: 1px solid #000; display: block; padding: 5px; transition: 0.5s; } .menu li:hover > a{ background-color: #000; color: #fff; } .sub-menu{ display: none; } .sub-menu a{ display: block; padding: 5px; transition: 0.5s; color: #fff; } .sub-menu a:hover{ background-color: #fff; color: #000; } .sub-back{ width: 100%; height: 200px; background-color: #000; position: absolute; right: 0; top: 100%; z-index: -1; display: none; } .slide{ position: relative; height: 300px; } .slide > div{ width: 1200px; height: 300px; margin: auto; border: 5px solid #000; position: absolute; } .items{ width: 1200px; margin: auto; display: flex; } .items > div{ border: 1px solid #000; height: 200px; } .news{ width: 500px; } .gallery{ width: 350px; } .shortcut{ width: 350px; } footer{ width: 1200px; margin: auto; display: flex; } footer > div{ border: 1px solid #000; height: 100px; } .copyright{ width: 1000px; } .sns{ width: 200px; } .sns div{ border: 1px solid #000; height: 50px; } 슬라이드부분에 하다가 포지션 엡솔루트만 주면 사진기준이 이상하게되는데 뭐가잘못된건가요
해결됨
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 찾아도 안나오는데 CamelCaseToUnderscoresNamingStrategy 이걸로 바뀐 것 같네요.
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
안녕하세요. 강의 잘 보고 있습니다! 다른 분 질문에 궁금한 것이 해소되지 않아 질문드립니다. https://www.inflearn.com/course/lecture?courseSlug=%EC%8A%A4%ED%94%84%EB%A7%81%EB%B6%80%ED%8A%B8-JPA-%ED%99%9C%EC%9A%A9-1&unitId=24297&category=questionDetail&q=30892&tab=community 정적 팩토리 메소드 사용 이유중에 static 메모리에 올라가기때문에 새로운 객체를 생성하지 않는 장점이 있는 거라고 알고 있습니다. 이 예제의 경우 static을 빼도 JPA가 엔티티로 관리하면서 어차피 사용할 수 있는 부분아닌가요..? 라는 질문에서 강사님께서는 static을 빼보면 이해될 거라고 답변하셨습니다. 제가 생각하기로는 정적 팩토리 메서드 안에서 생성자를 통해 인스턴스를 생성하는 것은 똑같아 보이고, 호출할 때 new가 아닌 Order.createOrder()로 호출하는 것 외에는 차이점을 못 느꼈습니다. 조금 더 상세한 가르침을 주시면 감사하겠습니다!
미해결
처음 만난 리액트(React)
17, 17.0.0, 18.0.0 다 해봤는데 버튼은 뜨지만 눌렀을 때 글자가 바뀌지 않아요ㅠ 문제가 무엇일까요?
해결됨
백엔드 개발자에 의한, 백엔드 개발자들을 위한 프론트엔드 강의 - 기본편
안녕하세요 Thymeleaf vs HTML + RestController 주제를 듣던 중 의아한 부분이 생겨 글을 작성하게 되었습니다. 해당 강의에서 Thymeleaf 에 대한 설명을 진행하던 와중, 도중 강의가 갑자기 끝나는 듯한 느낌을 받았습니다. 강의 페이지를 보니, 이후 설명되야 할 내용처럼 보이는 것을 발견했습니다. 혹시 중간에 강의가 누락된 것인지 확인 부탁드립니다.
미해결
안녕하세요, 김영한 님. Querydsl SQLExpressions에 listagg 관련하여 질문이 있습니다. 현재 Projections.constructoer 방식으로 조회한 결과를 Dto로 받고있는데요, SQLExpressions.listagg(컬럼, ",").withinGroup().orderBy(컬럼).getValue().as("listaggs") 로 select후 Dto에서 String으로 못받는데 String으로 받으려면 어떻게 해야 될까요? 방법이 없는걸까요? 이미 같은 질문을 남긴 글이 있는데 미해결 상태라 다시 한번 글 올려 봅니다. 이방법을 사용하는 이유는 A 테이블, B 테이블이 있는데 1:N의 관계 입니다) A테이블 조회시 Response에는 B테이블의 컬럼 하나도 추가로 목록에 보여줘야 하는데 그럴때 B테이블의 해당 컬럼의 값이 다른 데이터가 2개 이상일시 A정보가 2건이 나오게 되서 (페이징 처리시에도 총 카운트와 페이징 처리가 제대로 되지 않습니다.) 한 row로 보여지게 하기 위해 사용하려 Querydsl SQLExpressions에 listagg 사용하려는데, String으로 받을수가 없더군요... 혹 Querydsl SQLExpressions에 listagg 아니더라도 다른 방법이 있을까요?
미해결
자바와 스프링 부트로 생애 최초 서버 만들기, 누구나 쉽게 개발부터 배포까지! [서버 개발 올인원 패키지]
현재 코드에서는 name을 기준으로 delete를 하는데요, findByName(name)을 이용한 코드에서 DB 안에 같은 이름의 회원이 2명 이상인 경우엔 오류가 생깁니다. 그 이유가 find는 return 개수가 1건이기 때문에 rollback 된다고 생각했습니다. 이 버그를 수정하기 위해서 deleteUser의 파라미터는 Long id 로 수정했는데, 또 안 되더라고요...? findAll을 쓰면 같은 이름을 가진 모든 회원이 삭제될 것 같고... 어떻게 하면 동명이인의 회원 중에서 내가 원하는 한 회원만 삭제할 수 있나요? + 추가 방금 다른 학생분의 질문과 답변을 읽었습니다. 같은 내용의 질문인 것 같네요! 그러면 파라미터를 Long id 로 변경하되, 현재 실습 중인 UI에서도 코드를 수정해야하는 부분이 있기에 삭제가 안 되는 게 맞다고 이해하면 될까요?
해결됨
[코드캠프] 시작은 프리캠프
안녕하세요, 강사님! 수업 너무 잘 듣고있습니다. 다름이 아니라 제가 모르고 싸이월드 만들기 피그마에서 협업 요청 버튼을 눌렀는데 어떡하죠..?ㅠㅠ 거절해주실 수 있나요..?
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
<ul class="gnb"> <div class="wrap"> 차이 무엇입니까?
해결됨
웹 애니메이션을 위한 GSAP 가이드 Part.02
안녕하세요, 애니메이션 Timeline을 기획(정의)하는 법(방식)?에 대해 문의드립니다! 섹션, "3D 텍스트효과(2)" 에서 인터벌 단위로, duration, stagger, pause, 각각의 value 계산 법을 알려주셨는데요 강좌에서 나온 예시 SVG 이미지 보면서, 저렇게 애니메이션을 정의하면 되겠다, 인사이트를 얻었습니다. 문득, 범쌤께서는 어떻게 애니메이션 flow를 정의 하시는지, 관점이나, 포인트가 궁금 해졌습니다! (이미 강의에서 SVG 이미지로 보여주셨지만, 혹시 더 있을까봐서요,,,) 강의 내용처럼, 애니메이션을 duration, stagger, pause, delay 단위로 배치하면, GSAP을 적용하는데 용이 하다 라고 이해하면 될까요?! 블럭 맞추듯 척척, 애니메이션이 구현되는 과정이 신기하네요! 감사합니다!
미해결
애플 웹사이트 인터랙션 클론!
초반부 messageA_opacity_in 을 콘솔로 찍었는데요, partScrollStart보다 currentYOffset이 작을때는 rv에 values[0] 즉 '0'을 리턴해야하는데, 그러지 않고 -1부터 0까지 쭉 커지다가 css가 적용되는 구간부터 1로 점점 커집니다... const sceneInfo = [ { //0 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-0'), messageA: document.querySelector('#scroll-section-0 .main-message.a'), messageB: document.querySelector('#scroll-section-0 .main-message.b'), messageC: document.querySelector('#scroll-section-0 .main-message.c'), messageD: document.querySelector('#scroll-section-0 .main-message.d') }, values:{ messageA_opacity: [0, 1, { start: 0.1, end: 0.2}], messageB_opacity: [0, 1, { start: 0.3, end: 0.4}] } }, { //1 type:'normal', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-1') } }, { //2 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-2') } }, { //3 type:'sticky', heightNum:5,//브라우저 높이의 배수 세팅 scrollHeight:0, //각 씬의 스크롤 높이 objs:{ container: document.querySelector('#scroll-section-3') } } ]; function calcValues(values, currentYOffset){ let rv; const scrollHeight = sceneInfo[currentScene].scrollHeight const scrollRatio = currentYOffset / scrollHeight if(values.length === 3){ // start ~ end 사이의 애니메이션 실행 const partScrollStart = values[2].start * scrollHeight; const partScrollEnd = values[2].end * scrollHeight; const partScrollHeight = partScrollEnd - partScrollStart; if(currentYOffset => partScrollStart && currentYOffset <= partScrollEnd){ rv = (currentYOffset - partScrollStart) / partScrollHeight * (values[1] - values[0]) + values[0]; } else if (currentYOffset < partScrollStart){ rv = values[0]; } else if (currentYOffset > partScrollEnd){ rv = values[1]; } } else { rv = scrollRatio * (values[1] - values[0]) + values[0]; } return rv; } function playAnimation(){ const objs = sceneInfo[currentScene].objs; const values = sceneInfo[currentScene].values; const currentYOffset = yOffset - prevScrollHeight; switch (currentScene){ case 0: let messageA_opacity_in = calcValues(values.messageA_opacity, currentYOffset) objs.messageA.style.opacity = messageA_opacity_in console.log(messageA_opacity_in) break; case 1: break; case 2: break; case 3: break; } } 도와주세요 ㅠ
