172만명의 커뮤니티!! 함께 토론해봐요.
미해결
자바(Java) 알고리즘 문제풀이 입문: 코딩테스트 대비
앞 문제에서 Collection.sort를 쓰면 문제에서 효율적이지 못하다는 댓글을 봐서 처음부터 Array.sort를 해서 정렬하는 방법을 생각을 못했는데 어떤 문제에선 사용하고 사용하지말고 구분이잘 안되는데 이럴땐 어떻게 하나요...
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
안녕하세요. 우측고정 네비게이션에서 'Sub-menu' 부분에 높이 200px을 줬는데 크기 늘어나지 않아 문의 드립니다. <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>C2_세로슬라이드, 네비(왼쪽개별우측고정)</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="left"> <header> <div class="header-logo"></div> <div class="navi"> <ul class="menu"> <li> <a class="open-modal" href="#none">협회소개</a> <div class="sub-menu"> <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> </div> </li> <li> <a href="#none">홍보마당</a> <div class="sub-menu"> <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">Q&A</a> <a href="#none">사진갤러리</a> <a href="#none">공지사항</a> </div> </li> </ul> </div> </header> </div> <div class="right"> <div class="slide"> <div class="slide-items"> <a class="slide-item" href="#none"><img src="images/slide-01.jpg" alt="slide-01"></a> <a class="slide-item" href="#none"><img src="images/slide-02.jpg" alt="slide-02"></a> <a class="slide-item" href="#none"><img src="images/slide-03.jpg" alt="slide-03"></a> </div> </div> <div class="items"> <div class="news"></div> <div class="gallery"></div> <div class="shortcut"></div> </div> <footer> <div class="copyright"></div> <div class="footer-content"> <div class="sns"></div> <div class="family-site"></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 { margin: 0; background-color: #fff; color: #333; font-size: 15px; } a { text-decoration: none; color: inherit; } /* Entire Layout */ .container { display: flex; } .container > div { border: 1px solid #000; } .left { width: 200px; } .right { width: 800px; } header { position: relative; z-index: 1000; } header > div { border: 1px solid red; } .header-logo { height: 100px; } .navi { height: 400px; } /* Slide */ .slide { position: relative; width: 800px; height: 350px; overflow: hidden; } .slide > div { border: 1px solid #000; height: 350px; } .slide-items { font-size: 0; position: absolute; top: 0; left: 0; } .items { display: flex; } .items > div { border: 1px solid #000; height: 200px; } .news { width: 300px; } .gallery { width: 250px; } .shortcut { width: 250px; } footer { display: flex; } footer > div { border: 1px solid #000; height: 100px; } .copyright { width: 600px; } .footer-content { width: 200px; } .footer-content div { border: 1px solid #000; height: 50px; } .sns {} .family-site{} /* Navigation */ .menu { width: 90%; margin: auto; list-style: none; padding: 0; padding-top: 10px; position: relative; } .menu li { text-align: center; border: 1px solid #000; } .menu li > a { padding: 5px; display: block; border: 1px solid #000; transition: 0.5s; } .menu li:hover > a { background-color: #000; color: #fff; } .sub-menu { display: none; width: 100%; height: 200px; position: absolute; top: 0; left: 100%; } .sub-menu a { padding: 6px; display: block; background-color: #000; color: #fff; transition: 0.5s; } .sub-menu a:hover { background-color: #fff; color: #000; } /* Slide */ // setInterval(콜백함수, 시간) // animate({속성값}, 콜백함수) setInterval(function(){ $('.slide-items').animate({top: '-350px'}, function(){ $('.slide-items').css({top: 0}) $('.slide-item:first-child').appendTo('.slide-items') }) }, 3000) /* Navigation */ $('.menu li').mouseenter(function(){ $(this).children('.sub-menu').stop().slideDown() }) $('.menu li').mouseleave(function(){ $(this).children('.sub-menu').stop().slideUp() })
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
안녕하세요. B4 실습 중에 안되는 기능이 있어 문의 드립니다. appendTo 기능이 작동하지 않습니다. 어떻게든 해결 해보려고 클래스네임, 점 하나까지 다 확인 했는데 도저히 모르겠어서 질문 남겨요. 되던게 안되니까 너무 당황스러워요... <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>B4_슬라이드 최종본</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="header-inner"> <header> <div class="header-logo"></div> <div class="navi"></div> </header> </div> <div class="content-inner"> <div class="slide"> <div class="slide-items"> <a class=".slide-item" href="#none"><img src="images/slide-01.jpg" alt="slide-01"></a> <a class=".slide-item" href="#none"><img src="images/slide-02.jpg" alt="slide-02"></a> <a class=".slide-item" href="#none"><img src="images/slide-03.jpg" alt="slide-03"></a> </div> </div> <div class="items"> <div class="news"></div> <div class="gallery"></div> <div class="banner"></div> </div> </div> <div class="footer-inner"> <footer> <div class="footer-content"> <div class="footer-menu"></div> <div class="copyright"></div> </div> <div class="family-site"></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 { margin: 0; background-color: #fff; color: #333; font-size: 15px; } a { text-decoration: none; color: inherit; } /* Entire Layout */ .container {} .header-inner { background-color: #eee; display: flex; justify-content: center; } header { border: 1px solid #000; display: flex; justify-content: space-between; width: 1200px; } header > div { border: 1px solid #000; height: 100px; } .header-logo { width: 200px; } .navi { width: 600px; } .content-inner {} /* Slide */ .slide { position: relative; width: 1200px; height: 300px; margin: auto; } .slide > div { border: 1px solid #000; } .slide-items { width: 3600px; font-size: 0; position: absolute; top: 0; left: 0; } .items { width: 1200px; display: flex; margin: auto; } .items > div { border: 1px solid #000; height: 200px; } .news { width: 400px; } .gallery { width: 400px; } .banner { width: 400px; } .footer-inner { background-color: #ddd; display: flex; justify-content: center; } footer { display: flex; } footer > div { border: 1px solid #000; height: 100px; } .footer-content { width: 1000px; } .footer-content > div { border: 1px solid #000; height: 50px; } .footer-menu {} .copyright {} .family-site { width: 200px; } /* slide */ // setInterval(콜백함수, 시간) // animate({속성값}, 콜백함수) setInterval(function(){ $('.slide-items').animate({left: '-1200px'}, function(){ $('.slide-items').css({left: 0}) $('.slide-item:first-child').appendTo('.slide-items') }) }, 3000)
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
애니메이션 효과 animation: slide 10s linear infinite;로 주라고 하셨는데 어떤 강의에선 .animate 속성으로 주라고 하는데 무슨 차이이고 어느 것이 맞습니까?
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
현재 E1 실습 중에 안되는 부분이 있어 문의 드립니다. CSS에서 'shortcut-01' 이미지 조절 중인데 사이즈가 안줄어들어요.ㅠㅠ 왜이럴까요..? <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>E1_최종본_영상시청</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="container"> <div class="main-content"> <div class="left"> <header> <div class="header-logo"> <a href="#none"><img src="images/header-logo.png" alt="header-logo"></a> </div> <div class="navi"></div> <div class="spot-menu"> <a href="#non3">로그인</a> <span>l</span> <a href="#non3">회원가입</a> </div> </header> </div> <div class="content"> <div class="shortcut"> <a class="shortcut-image" href="#none"><img src="images/shortcut-01.png" alt="shortcut-01"></a> <h3>얼리버드 선착순 할인 이벤트, 신규강의 최대 30% 할인</h3> <p>12월은 사랑의 달~ 코딩웍스에서 여러분께 사랑을 뿌려요~ 12월 개강반을 12월 06일까지 접수하는 분들께는 15%~ 20% 의 얼리버드 할인을 제공합니다.<br>더불어 소중한 리뷰를 꼼꼼히 남겨주시는 분들을 뽑아 더 큰 적립금을 추가지급해 드릴 예정이오니 리뷰도 놓치지 마시고 작성해주세요~^^<br> <b>기간: 2022년 12월 18일~ 12월 25일</b></p> <a href="#none"><img src="images/shortcut-02.png" alt="shortcut-02"></a> </div> <div class="news"></div> <div class="gallery"></div> <div class="banner"> <a href="#none"><img src="images/banner-01.png" alt="banner-01"></a> <a href="#none"><img src="images/banner-02.png" alt="banner-02"></a> <a href="#none"><img src="images/banner-03.png" alt="banner-03"></a> <a href="#none"><img src="images/banner-04.png" alt="banner-04"></a> </div> </div> <div class="right"> <div class="slide"> <div class="slide-image"> <div class="slide-items"> <a class="slide-item" href="#none"><img src="images/slide-e-01.jpg" alt="slide-e-01"></a> <a class="slide-item" href="#none"><img src="images/slide-e-02.jpg" alt="slide-e-02"></a> <a class="slide-item" href="#none"><img src="images/slide-e-03.jpg" alt="slide-e-03"></a> </div> </div> </div> </div> </div> <footer> <div class="footer-logo"> <a href="#none"><img src="images/footer-logo.png" alt="footer-logo"></a> </div> <div class="footer-content"> <div class="footer-link"> <a href="#none">기업소개 제휴 및 입점 문의</a> <a href="#none">개인정보처리방침</a> <a href="#none">이메일무단수집거부</a> <a href="#none">사이트맵</a> <a href="#none">인재채용</a> </div> <div class="copyright"> <p>상호 : (주)코딩웍스 | 대표자 : 홍길동 | 개인정보관리책임자 : 성춘향 부장 사업장주소 : 경기도 남양주시 별내동 1234 코딩웍스 빌딩 6층 (주)코딩웍스</p> </div> </div> </footer> </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; color: #333; font-size: 15px; } a { text-decoration: none; color: inherit; } /* Entire Layout */ .container {} .main-content { display: flex; } .main-content > div { border: 1px solid #000; } .left { width: 200px; } .content { width: 400px; } .right { width: calc(100% - 600px); } header {} header > div { border: 1px solid red; } .header-logo { height: 100px; } .navi { height: 400px; } .spot-menu { height: 50px; text-align: center; } .content {} .content > div { border: 1px solid blue; } /* Shortcut */ .shortcut { height: 150px; display: flex; } .shortcut .shortcut-image { height: 80px; } /* News & gallery */ .news { height: 250px; } .gallery { height: 250px; } .banner { height: 150px; display: flex; } .banner img { width: 100% } /* Slide */ .slide { display: flex; } .slide-image { flex: 1; height: calc(100vh - 120px); position: relative; overflow: hidden; } /* Slide Animation */ .slide-items { width: 300%; height: inherit; font-size: 0; position: absolute; } .slide-items a { display: inline-block; height: inherit; width: calc(100% / 3); } .slide-items a img { width: 100%; height: inherit; object-fit: cover; } footer { display: flex; } footer > div { border: 1px solid green; height: 120px; } .footer-logo { width: 200px; } .footer-content { width: calc(100% - 200px); } .footer-content div { border: 1px solid #000; height: 60px; } .footer-link {} .footer-link a:after { content: 'l'; margin-left: 5px; } .footer-link a:last-child::after { display: none; } .copyright {}
미해결
따라하며 배우는 HTML, CSS
영상 자료를 다운받았는데 1쪽만 보이고 나머지는 보이지가 않습니다.
해결됨
실전! 스프링 데이터 JPA
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 1. 스프링 데이터 JPA 가 지원하는 save를 호출하면 flush()가 나가는건가요 아니면 save를 하고 bulkAgePlus()를 호출하면서 bulkAgePlus() 에 있는 JQPL이 실행되서 flush() 가 나가는건가요 ? bulkAgePlus()를 실행하면 JPQL 실행이되고, JPQL 이 실행이 되면 flush() 가 호출이 되는데 이때 SQL쿼리문이 DB에 전송이대서 DB에는 업데이트가 되어있지만 영속성 컨텍스트는 업데이트가 안되기 때문에 clear()를 해주는게 맞는건가요 ?
해결됨
웹 애니메이션을 위한 GSAP 가이드 Part.02
// const { chars } = new SplitText('.stage h1', { type: 'chars' }); function splitTextChars(elem) { const textElem = document.querySelector(elem); const letters = textElem.textContent.split(''); let newHTML = ''; letters.forEach(letter => { newHTML += /* HTML */ ` <div style="position:relative; display:inline-block">${letter}</div>`; }); textElem.innerHTML = newHTML; return [...document.querySelectorAll(`${elem} div`)]; } const chars = splitTextChars('.stage h1'); 복습중에 유료플러그인이나 라이브러리 없이 써보고싶어서 만들어봤습니다 ! 맞는 코드인지는 모르겠지만 혹시 참고하실분이 계실까 싶어 남겨둘게요 !ㅎㅎ
미해결
처음 만난 리액트(React)
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. node.js 설치를 완료했는데 버전이 안나오는데 왜 그런건가요?
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
nodemon : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\~~~~~\AppData\Roaming\npm\nodemon.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies( https://go.microsoft.com/fwlink/?LinkID=135170 ) 를 참조하십시오. 위치 줄:1 문자:1 + nodemon + ~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess 이런거 뜨면 https://velog.io/@kimy/VS-CODE-supervisor-nodemon-%EC%98%A4%EB%A5%98-ps1-%ED%8C%8C%EC%9D%BC%EC%9D%84-%EB%A1%9C%EB%93%9C%ED%95%A0-%EC%88%98-%EC%97%86%EC%8A%B5%EB%8B%88%EB%8B%A4 이 방법대로 참조하세요 혹시 안되시는분들
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
저 강의에서는 vpm init 등등을 활용해 노드js 기타등등을 생성하셨는데 이번강의에선 깃허브에서 다운을 통해 선생님께서 이미 준비하신 node.js파일들을 제공받았는데.. 만약 제가 스스로 혼자서 셋팅하고 만들어보고 싶은 경우에는 어찌해야 할까요...? 아니면 그냥 선생님이 만들어주신 저 다운패키지들을 활용해도 별 문제 없을까요...?
미해결
실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
안녕하십니까 영한님. 영한님 덕분에 JAVA Spring 기반 백엔드 개발의 시작을 할 수 있었고, 이제는 5개월 차 스타트업 백엔드 개발자로써 커리어를 시작하게 되었습니다. 현업에 와서는 오히려 취준생 때 보다 더 많은 고민을 하게 되느데요, 질문 1. 그중 최근에 CRUD의 각 상황별 API 응답을 어떻게 보내는게 적절할지, 질문 2. 그리고 ResponseDto를 어떻게 구성하는것이 적절할지에 대한 고민을 팀장님과 함께 하고있어서, 영한님의 생각을 여쭙고자 질문글을 올리게 되었습니다. 답변 해주시면 정말 감사할 거 같습니다! Q1. 생성, 조회 , 수정, 삭제 API의 응답을 각각 어떻게 보내시는지 여쭤보고 싶습니다. 가장 먼저 조회의 경우는 말 그대로 path의 Entity 및 관련된 Entity 정보를 조합하여 응답 DTO로 변환하여 보내고 있습니다. 그런데 나머지 Write Operation에 대한 응답을 어디까지 보내야 하냐가 이슈 입니다. 예를들면 엔티티의 생성의 경우 엔티티의 응답 DTO를 보내면 - 프론트에서 별도의 조회 API 호출 없이 바로 프론트가 화면에 뿌려줄 수 있으니깐 저는 생성의 경우에도 조회와 마찬가지로 Entity의 정보를 조합하여 응답 DTO로 변환하여 보내고 있었습니다. 그런데 이러한 부분이 Command Query Sperate 원칙에 어긋나는것 같아, 영한님께서는 혹시 생성한 Entity의 Key만 보내시는지, 아니면 Entity의 정보를 DTO로 변환하여 보내시는지 궁금합니다. 만약 Entity의 Id만 보내신다면 이후에 별도로 조회API를 호출해야 하고 그 또한 비용일텐데 이러한 부분은 어떻게 하시는지 여쭤보고 싶습니다. 이제 수정 API인데요, 제가 다룬 비즈니스 로직의 경우 수정 비즈니스 로직이 다양하고 , 각 비즈니스 로직의 경우 다뤄지는 Entity의 종류가 다른 경우였습니다. (중심 Entity는 동일하지만, 연관된 Entity를 누구까지 건드리냐의 차이) 그래서 하나의 통일된 응답으로 보내기 모호한 점이 첫 번째 이유이고, 애초에 수정 후에 프론트 화면에서 그 엔티티의 정보를 보여줄 필요가 없어서 라는 두번째 이유에 의해서 에초에 엔티티의 Id값도 보내지 않고 있었는데요, 이 수정 API의 응답을 영한님은 어떻게 진행하지는지 그 이유가 궁금합니다. 마지막으로 삭제의 경우는 정말, 프론트에게 보낼 응답이 없어도 되는 경우 라고 생각했는데요, 팀장님의 의견은 만약에 나중에 삭제한 Entity를 복구하는 요구사항이 추가되는것을 고려하여 Id 정도는 넘기자는 의견을 내어주셨습니다. 마찬가지로 삭제의 경우도 어떤식으로 수행하시는지 그 이유가 궁금합니다. Q3. 마지막으로 Entity의 ResponseDto의 필드를 어떤식으로 구성하시는지 궁금합니다 예를들면 저의 경우는 API는 프론트와 서버 간의 스펙이라고 생각하고, Entity의 단건조회의 경우는 단건 조회용 ResponseDto를, 전체조회의 경우는 전체 조회용 SummaryResponseDto를 별도로 만들어서 사용하고 있었습니다. 저희 팀장님 께서는 프론트쪽도 일을 해오시다가 , 백엔드쪽 분야로 전향하신 케이스 인데요, 그렇다 보니 어떻게 해야 프론트의 생산성이 올라가는지를 고려하시는 분이셨고, 팀장님의 생각은 서버에서 넘겨주는 응답에 일관성이 있어야 그 응답을 사용하는 프론트 측도 학습이 되고 놓치는 부분 없이 생산성이 올라간다 는 의견이셨습니다. 그래서 Entity별로 당장 사용하지 않더라도 가능한 모든 필드를 담은 ResponseDto를 하나만 만들고, 해당 ResponseEntity의 조합으로 각 API별 응답 Dto를 만들어서 사용하면 , 프론트 측 에서는 일관성 있는 응답값을 사용할 수 있다는 의견이셨습니다. 물론 이 방법이 네트워크 패킷의 양을 쓸데없이 증가시킨다는 것을 알고 계시면서도, 생산성에 큰 영향을 미치는 부분이라고 생각하셨습니다. 예를들어 다음과 같이 각 Entity의 응답 Dto의 조합별로 API의 ResponseDto를 만들 수 있습니다. ResponseDto{ UserDto{ id : 1, name : “aaa” … // User엔티티의 거의 모든 필드 } ItemDto{ id : 2, name : “bbb”, … // Item엔티티의 거의 모든 필드 } } 저는 이러한 부분에 대해 생각해 본 적이 없이, 그냥 제가 “해당 API를 호출하는 화면에서 필요한 정보들만을 담아 (혹은 여러 화면에서 쓰인다면 여러개를 고려) ResponseDto를 각각 만들어서” 넘겼는데요 영한님께서는 이러한 ResponseDto를 구성하는 부분에 있어서 상황별로 필드를 재구성 하여 ResponseDto를 정의하여 사용하시는 편 인지 (SummaryResponseDto 등의 별도 Dto에 사용될 Entity의 필드들을 풀어서 정의하시는지) 아니면 생산성을 고려하여 각 Entity별 Dto를 만들고, 이들을 조합하여 ReponseDto를 정의하시는 편 이신지 , 혹은 다른 규칙이 있으신지 궁금합니다. 물론 그렇다고 , 팀장님의 의견에서 전체조회시 사용하는 DTO와 단건조회시 사용하는 DTO가 동일하더라도, 전체조회 후 단건조회를 할때 단건조회 API를 호출하지 말고 기존 Front가 가지고 있는 값을 쓰지는 말자는 의견 이십니다 (단건조회API는 별도로 호출해야 한다) 그저 핵심은 프론트가 다루는 ResponseDto의 일관성을 위해서 입니다 (결론은 생산성을 위해) 긴글 읽어주셔서 감사합니다. 항상 건강하셨으면 좋겠고, 다음 강의들도 손꼽아 기다리고 있습니다!
미해결
비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
module.exports = { jwtsecret : "jwt_secret_key_9312", host : "3.38.61.157", user : "root", port : "3306", password : "~~~", detabase : "enrolment", }; 이렇게 하고 index.js를 해줬는데 선생님처럼 aws아이피는 안 뜨고 그냥 PS C:\Users\YOONJUNHO\Documents\Test\Node-Template-For-Food-Map-main> node index.js 2023-11-15 02:38:07 info: undefined - API Server Start At Port 3000 이것만 뜨는데 이것도 연결된건가요?
미해결
[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드
안녕하세요. '왼쪽 개별 네비게이션' 완료 후 CSS만 변경해 '우측고정 네이게이션'을 만드는 와중에 잘 안되는게 있어 질문 드립니다. '세로 기본형' 일때는 호버가 잘 되었는데 CSS 변경 후 sub-menu 가 고정이 되지도 않고 호버도 되지 않아요... 영상 보면서 마크업 비교 해봐도(1시간째...ㅠㅠ) 틀린 부분이 없는데 작동되지 않아 답답합니다.뭐가 잘못 되었을까요? <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>D1</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div class="contaniner"> <div class="main-content"> <div class="left"> <header> <div class="header-logo"></div> <div class="navi"> <!-- Navigation --> <ul class="menu"> <li> <a href="#none">MENU-1</a> <div class="sub-menu"> <a href="#none">SUB-MENU-1</a> <a href="#none">SUB-MENU-2</a> <a href="#none">SUB-MENU-3</a> <a href="#none">SUB-MENU-4</a> </div> </li> <li> <a href="#none">MENU-2</a> <div class="sub-menu"> <a href="#none">SUB-MENU-1</a> <a href="#none">SUB-MENU-2</a> <a href="#none">SUB-MENU-3</a> <a href="#none">SUB-MENU-4</a> </div> </li> <li> <a href="#none">MENU-3</a> <div class="sub-menu"> <a href="#none">SUB-MENU-1</a> <a href="#none">SUB-MENU-2</a> <a href="#none">SUB-MENU-3</a> <a href="#none">SUB-MENU-4</a> </div> </li> <li> <a href="#none">MENU-4</a> <div class="sub-menu"> <a href="#none">SUB-MENU-1</a> <a href="#none">SUB-MENU-2</a> <a href="#none">SUB-MENU-3</a> <a href="#none">SUB-MENU-4</a> </div> </li> </ul> <!-- Navigation --> </div> <div class="spot-menu"></div> </header> </div> <div class="right"> <div class="slide"> <div class="slide-image"></div> <div class="slide-banner"></div> </div> <div class="items"> <div class="shortcut"></div> <div class="news-gallery"></div> </div> </div> </div> <footer> <div class="footer-logo"></div> <div class="copyright"></div> <div class="sns"></div> </footer> </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; color: #333; } a { text-decoration: none; color: inherit; } /* Entire Layout */ .container {} .main-content { display: flex; } .main-content > div { border: 1px solid #000; } .left { width: 200px; } .right { width: calc(100% - 200px); } /* Header */ header {} header > div { border: 1px solid red; } .header-logo { height: 100px; } .navi { height: 400px; } .spot-menu { height: 50px; } /* Slide */ .slide { height: 400px; position: relative; } .slide-image { border: 1px solid #000; height: 400px; } .slide-banner { width: 150px; height: 300px; position: absolute; top: 0; right: 0; } /* shortcut */ .shortcut { border: 1px solid #000; height: 200px; } /* Nesw & gallery */ .news-gallery { border: 1px solid #000; height: 250px; } /* footer */ footer { display: flex; } footer > div { border: 1px solid #000; height: 100px; } .footer-logo { width: 200px; } .copyright { width: calc(100% - 430px); } .sns { width: 230px; } /* Navi gation */ .menu { padding: 0; list-style: none; width: 90%; margin: auto; margin-top: 15px; position: relative; } .menu li { 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 { border: 1px solid #000; display: none; position: absolute; top: 0; left: 100%; width: 100%; height: 200px; background-color: #000; } .sub-menu a { display: block; padding: 5px; transition: 0.5s; color: #fff; } .sub-menu a:hover { background-color: #fff; color: #000; } /* Navigation */ $('.menu li').mouseenter(function(){ $(this).children('.sub-menu').stop().slideDown() }) $('.menu li').mouseleave(function(){ $(this).children('.sub-menu').stop().slideUp() })
미해결
실전! 웹사이트제작! Step by Step! (대방산업_InteractiveWeb)
강사님, 안녕하세요. 슬라이드 안 find out more 버튼 스크롤 애니메이션이, 가운데 정렬로 올라가는게 아니라, 오른쪽으로 치우쳐있다 가운데로 올라갑니다. css에선 left:50%; 되어 있던데 왜 그럴까요?? (올려놓으신 수업 파일도 똑같은 현상입니다.)
해결됨
처음 만난 리액트(React)
안녕하세요 🙂 React 첫 인강을 소플님의 강의로 시작했습니다. 소플님의 인강을 들으면서 유튜브에 올라오는 React 사이드 프로젝트들을 따라하고 있는데 component관련에서 궁금한 사항이 생겨서 늦게나마 질문을 올립니다. 예시) Main component 안에 Button // List // Write 3개의 component가 있다고 가정한다면 소플님은 먼저 3개의 작은 component들을 만들고 조합하여 Main component를 완성한다고 말씀하셨습니다.(재사용성 떄문) 그런데 어떤분들은 먼저 Main component에서 3개의 작은 component 내용들을 전부다 쓰고 마지막에 3개를 분리하여 각각 해당 component들에 나눠담으시던데 먼저 큰 컴포넌트를 레이아웃을 구성해서 작은 컴포넌트에 나눠 담는게 맞는건지 작은 컴포넌트들을 조합해서 큰 컴포넌트를 만드는게 맞는건지 알 수 있을까요? React 처음으로 완강했는데 너무 유익한 강의였습니다 감사합니다:)
미해결
Colini 웹개발 가이드
다음 영상이 git 실습이 되어야할 것 같은데 혹시 동영상은 따로 없는 걸까요?
미해결
유튜브에서 본 대로 인텔리제이에서 작성한 프로젝트를 깃허브에 올리려고 하는데, 깃허브 로그인 시에 저런 에러창이 뜹니다. 어떤 프로그램을 더 설치하거나 해야 할까요...?
미해결
실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발
[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 일단은 해결 했습니다. findAllString 이용하는데 Order를 얘가 모르는 거 같아서.. String jpql = "select o From jpabook.jpashop.domain.Order o join o.member m"; 이렇게 패키지경로까지 다 명시해줬더니 인지를 하더라구요.. 안 그러면 org.hibernate.query.sqm.UnknownEntityException: Could not resolve root entity 'Order' at org.hibernate.query.hql.internal.SemanticQueryBuilder.visitRootEntity(SemanticQueryBuilder.java:1960) ~[hibernate-core-6.2.13.Final.jar:6.2.13.Final] at org.hibernate.query.hql.internal.SemanticQueryBuilder.visitRootEntity(SemanticQueryBuilder.java:253) ~[hibernate-core-6.2.13.Final.jar:6.2.13.Final] ............... 얘가 이렇게 Order 인지 못한다고 오류가 뜹니다.. 원래 엔티티는 그냥 @Entity 등록 하면 알아서 인지 되는걸로 알고 있었는데.. 왜 이런 걸까요? package jpabook.jpashop.domain; import jakarta.persistence.*; import lombok.AccessLevel; import lombok.Getter; import lombok.NoArgsConstructor; import lombok.Setter; import java.time.LocalDateTime; import java.util.ArrayList; import java.util.List; @Entity(name = "orders") @Getter @NoArgsConstructor(access = AccessLevel.PUBLIC) public class Order { @Id @GeneratedValue @Column(name = "order_id") private Long id; @ManyToOne(fetch = FetchType.LAZY) @JoinColumn(name = "member_id") private Member member; @OneToMany(mappedBy = "order", cascade = CascadeType.ALL) private List<OrderItem> orderItems = new ArrayList<>(); @OneToOne(fetch = FetchType.LAZY, cascade = CascadeType.ALL) @JoinColumn(name = "delivery_id") private Delivery delivery; private LocalDateTime orderDate; @Enumerated(EnumType.STRING) private OrderStatus status; public void changeMember(Member member){ this.member = member; member.getOrders().add(this); } public void addOrderItem(OrderItem orderItem){ orderItems.add(orderItem); orderItem.setOrder(this); } private void setOrderDate(LocalDateTime orderDate) { this.orderDate = orderDate; } public void changeDelivery(Delivery delivery){ this.delivery = delivery; delivery.setOrder(this); } private void setStatus(OrderStatus status) { this.status = status; } public static Order createOrder(Member member, Delivery delivery, OrderItem... orderItems){ Order order = new Order(); order.changeMember(member); order.changeDelivery(delivery); for (OrderItem orderItem : orderItems) { order.addOrderItem(orderItem); } order.setStatus(OrderStatus.ORDER); order.setOrderDate(LocalDateTime.now()); return order; } public void cancel(){ if(delivery.getStatus() == DeliveryStatus.COMP){ throw new IllegalStateException("이미 배송완료된 상품은 취소가 불가능합니다."); } this.setStatus(OrderStatus.CANCEL); for (OrderItem orderItem : orderItems) { // orderItem.getItem().removeStock(orderItem.getCount()); orderItem.cancel(); } } public int getTotalPrice(){ int totalPrice = 0; for( OrderItem orderItem : orderItems){ totalPrice += orderItem.getTotalPrice(); } return totalPrice; } }
미해결
SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma
질문 주실 때 항상 2가지를 지켜주세요. 브라우저 화면 캡쳐해서 올ㄹ기 HTML+SCSS+JS 코드 캡쳐 말고 텍스트로 붙여넣기 하기 만약 코드를 캡쳐해서 올리시면 제가 코드의 오류를 찾는게 너무 어렵습니다. 반드시 텍스트로 붙여넣기 해주세요. 커리큘럼 하단의 자료소스를 다운받았습니다. 풀어서보니 퍼블소스, pc소스만 있던데 모바일웹 소스가 없습니다. 어디서 다운받아야 하는지요. 퍼블리싱 할때도 모바일웹 소스가 있어야 하는거 아닌가 해서요.
