inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

텍스트박스안에서 padding-bottom 이 이렇습니다

해결됨

[코드캠프] 강력한 CSS

padding 값을 상하좌우 모두 20px 값으로 주었습니다 그런데 padding 값에 따라 위쪽, 왼쪽, 오른쪽은 모두 먹히는데 아랫쪽은 적용이 안되어서 이렇게 나오더라구요 이건 아래쪽은 이런건가요 ?

  • html/css
  • HTML/CSS
샤크 댓글 2 좋아요 0 조회수 423

Github 인증 에러 뜨시는 분들 참고해주세요.

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

Github에서 레지토리에 등록하실 때 아래와 같이 인증오류 뜨시는 분들 참고해주시면 좋을 것 같아요. remote: Support for password authentication was removed on August 13, 2021. Please use a personal access token instead. 해당 오류는 Github에서 2021년 Aug 13일부터 인증 방식이 비밀번호에서 토큰값 을 입력하는 방식으로 변경 이 되었는데요. 해결방법은 비밀번호를 쓰지 않고, 토큰 값을 입력하시면 간단하게 해결이 가능합니다. Username : Github ID (이름이 아닌 로그인 할 때 적는 ID 입력) Password : 토큰 값 입력 그렇다면 토큰이 뭐냐? 개개인의 인증에 쓰이는 고유한 값인데요 (ex. ghp_tA0QVuK5zoectiJ6bgbD...) 등 토큰은 어떻게 만들어서 입력하는데요? 아래 링크를 확인해주세요. https://dev.classmethod.jp/articles/resolving-github-token-authentication-errors/ 그리고 Password에 토큰값을 입력 해주시면 정상적으로 push가 됩니다. 끝.

  • html/css
  • nodejs
  • 머신러닝 배워볼래요?
  • node.js
  • react-native
  • tensorflow
  • 머신러닝
  • express
  • javascript
  • HTML/CSS
  • react
promotion 댓글 1 좋아요 1 조회수 881

이벤트 변형 감지 로그인창 부분 질문입니다.

해결됨

[코드캠프] 시작은 프리캠프

아이디와 비밀번호 칸에 0 이 들어가도 버튼이 작동되는것은 이해 되지만 아이디와 비밀번호 칸에 '엔터' (빈공간) 이 들어가도 버튼이 작동 됩니다. 이 빈공간의 경우도 문자열로 인식되는 것인가요 이것을 제한 하려는 경우 if (email&&pw1&&pw2) 에 어떤 식을 넣어야 가능한지 질문드리고 싶습니다.

  • html/css
  • HTML/CSS
  • javascript
킹정은 댓글 1 좋아요 0 조회수 231

탭메뉴가 실행이 안됩니다 ㅠ

미해결

[2026년 출제기준] 웹디자인개발기능사 실기시험 완벽 가이드

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="css/style2.css"> </head> <body> <div class="container"> <header> <div class="header-logo"> <a href="#"><img src="img/logo.png" alt=""></a> </div> <div class="navi"> <ul class="menu"> <li> <a href="#">MENU-1</a> <div class="sub-menu"> <a href="#">sun-menu1</a> <a href="#">sun-menu2</a> <a href="#">sun-menu3</a> <a href="#">sun-menu4</a> </div> </li> <li> <a href="#">MENU-2</a> <div class="sub-menu"> <a href="#">sun-menu1</a> <a href="#">sun-menu2</a> <a href="#">sun-menu3</a> <a href="#">sun-menu4</a> </div> </li> <li> <a href="#">MENU-3</a> <div class="sub-menu"> <a href="#">sun-menu1</a> <a href="#">sun-menu2</a> <a href="#">sun-menu3</a> <a href="#">sun-menu4</a> </div> </li> <li> <a href="#">MENU-4</a> <div class="sub-menu"> <a href="#">sun-menu1</a> <a href="#">sun-menu2</a> <a href="#">sun-menu3</a> <a href="#">sun-menu4</a> </div> </li> </ul> </div> </header> <div class="slide"> <div> <a href="#"><img src="img/slide1.jpg" alt=""></a> <a href="#"><img src="img/slide2.jpg" alt=""></a> <a href="#"><img src="img/slide3.jpg" alt=""></a> </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">공지사항</div> <div class="tab2">갤러리</div> </div> </div> </div> <div class="banner"> <a href="#"><img src="img/banner_img.jpg" alt=""></a> </div> <div class="shortcut"> <a href="#"><img src="img/shortcut_img.jpg" alt=""></a> </div> </div> <footer> <div class="footer-logo"> <a href="#"><img src="img/logo2.png" alt=""></a> </div> <div class="copy"> COPYRIGHTⓒ by JUST Shop. ALL RIGHTS RESERVED </div> <div class="sns"> <a href="#"><img src="img/sns1.png" alt=""></a> <a href="#"><img src="img/sns2.png" alt=""></a> <a href="#"><img src="img/sns3.png" alt=""></a> </div> </footer> </div> <script src="script/jquery-1.12.4.js"></script> <script src="script/custom.js"></script> </body> </html> @charset "utf-8"; .container{ width: 1200px; margin: auto;}a{ text-decoration: none; color: #333;}header{ height: 100px; position: relative; z-index: 1;}header>div{ height: 100px; /* border: 1px solid red; /}.header-logo{ width: 200px; float: left;}.navi{ width: 800px; float: right;}.menu{ margin-top: 30px; list-style: none; / border: 1px solid #000; / padding: 0;}.menu>li{ / border: 1px solid #000; / 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{ border: 1px solid #000; background-color: #fff; display: none;}.sub-menu>a{ display: block; padding: 5px; transition: 0.5s;}.sub-menu>a:hover{ background-color: #000; color: #fff;}.slide{ position: relative; height: 300px; width: 1200px; / border: 1px solid red; / overflow: hidden;}.slide>div{ position: absolute; top: 0; left: 0; font-size: 0; animation: slide 10s linear infinite; }@keyframes slide { 0% {top: 0;} 30% {top: 0;} 35% {top: -300px;} 65% {top: -300px;} 70% {top: -600px;} 95% {top: -600px;} 100% {top: 0;}} .items{ overflow: hidden;}.items>div{ height: 200px; float: left; / border: 1px solid red; / box-sizing: border-box;}.news{ width: 400px;}.tab-inner{ width: 95%; margin: auto;}.btn{}.btn>span{ border: 1px solid #000; padding: 5px; width: 130px; display: inline-block; text-align: center; border-radius: 5px 5px 0 0; background-color: #ddd; margin-right: -5px; border-bottom: none; margin-bottom: -1px; cursor: pointer;}.btn>span:active{ background-color: #fff;}.tabs{}.tabs>div{ border: 1px solid #000; height: 160px;}.tab1{}.tab2{ display: none;} .banner{ width: 400px;}.shortcut{ width: 400px;} footer{}footer>div{ height: 100px; / border: 1px solid red; */ float: left; box-sizing: border-box;}.footer-logo{ width: 200px; line-height: 130px;}.copy{ width: 800px; line-height: 100px; text-align: center;}.sns{ width: 200px; line-height: 140px; text-align: center;} $('.menu>li').mouseover(function(){ $(this).children('.sub-menu').stop().slideDown() }) $('.menu>li').mouseout(function(){ $(this).children('.sub-menu').stop().slideUp() }) $('.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')})

  • html/css
  • HTML/CSS
  • 웹-디자인
  • 웹 디자인
  • jquery
기쁜 돌고래 댓글 1 좋아요 1 조회수 373

엔터티 설게시 주의점 setter 리팩토링

미해결

실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발

안녕하세요! 영한님 강의 질 좋은 강의 너무 감사하게 보고 배우고 있습니다! 다름이 아니라, 엔터티 설계시 주의점 강의에서 setter를 사용하지 않기위해서 엔터티 설정을 아래와 같이 코드 수정을 해보았는데 이렇게 하는 게 더 안전한 방법인가요?? 실무에서도 이렇게 사용하는지 매우 궁금합니다..! Order 엔터티 public class Order{ ... public void addOrderItem(OrderItem orderItem){ orderItems.add(orderItem); // orderItem.setOrder(this); OrderItem.builder() .order(this) .build(); } public void setDelivery(Delivery delivery){ this.delivery = delivery; // delivery.setOrder(this); Delivery.builder() .order(this) .build(); } } OrderItem 엔터티 ... @NoArgsConstructor public class OrderItem { ... @Builder public OrderItem(Order order){ this.order = order; } }

  • spring-boot
  • spring
  • 웹앱
  • JPA
  • jpa
  • 웹앱
  • java
윤수정 댓글 1 좋아요 2 조회수 584

3.0 querydsl

미해결

실전! Querydsl

선생님이 올린 3.0 + querydsl로 다시 gradle했는데 Gradel -> other -> complieQuerydsl이 없는데 상관없는건가요?

  • JPA
  • jpa
  • java
kim1234123 댓글 2 좋아요 0 조회수 1291

4092 Error

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

8080으로 안되서 검색해서 이것저것 해봐도 안되길래 8090으로 하니까 되는데 8090을 써도 상관 없나요?

  • html/css
  • HTML/CSS
  • 머신러닝 배워볼래요?
  • node.js
  • tensorflow
  • react
  • 머신러닝
  • nodejs
  • react-native
  • javascript
  • express
exwhite 댓글 2 좋아요 1 조회수 577

@JoinColumn(name="parent_id")

미해결

실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] @JoinColumn(name="parent_id") 의 parent_id 는 어디서의 column을 의미하는건가요?? @Column(name="parent_id") 부분이 없는거 같은데 어디서 parent_id의 컬럼이 만들어져서 이것과 join을 하는건지 궁금합니다.

  • JPA
  • java
  • 웹앱
  • spring-boot
  • 웹앱
  • jpa
  • spring
ak4686 댓글 2 좋아요 1 조회수 767

Member 객체 질문입니다.

해결됨

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요 Member 객체에 대하여 질문 있습니다. 테스트 코드의 경우 Member member = new Member(); 이런식으로 Member 인스턴스를 생성해서 member.setName("spring"); 이런식으로 쓰이는건 이해가 되는데요 Member 클래스 에서나 MemoryMemberRepository 에서나 따로 member라는 참조변수로 Member()라는 인스턴스(Member member = new Member();와 같은것들)를 생성하지 않았는데 바로 아랫줄에서 member.setId(++sequence);가 쓰일수 있는건지 궁금합니다.

  • spring
  • mvc
  • spring-boot
  • MVC
  • java
gago86 댓글 1 좋아요 0 조회수 458

주문취소 order.cancel 호출 시 배송부분 검증 로직 때 연관관계가 Lazy라 delivery는 null 아닌가요?

해결됨

실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발

안녕하세요 강의 잘듣고있습니다. 주문서비스에서 cancel이 발생하면 위 Order 엔티티에서 delivery 객체 배송상태 검증 부분이 있는데 Order 와 Delivery 연관관계 매핑시 FetchType.LAZY로 설정되어있으니 잘못검증되는건 아닌가요? jpql로 fetch join으로 가져와야 하는 케이스아닌가해서요

  • JPA
  • spring
  • 웹앱
  • java
  • jpa
  • spring-boot
  • 웹앱
김태훈 댓글 2 좋아요 2 조회수 493

header 의 CSS 값 중 left:0 으로 설정한 부분이 잘 이해가 되지 않습니다.

해결됨

풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]

[모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지 만들기3] 12:10 부분에서, header 의 CSS 값 중 top :0 인 것은 이해가 되는데, left :0 으로 설정한 이유는 잘 모르겠습니다. 이미 width:100% 로 설정해서 좌우에 딱 맞게 설정된것으로 이해했는데, 여기에다가 또 left:0 을 해서 중앙이 아닌 좌측 정렬을 하는 이유가 있는걸까요?

  • html/css
  • HTML/CSS
  • es6
  • javascript
김지환 댓글 1 좋아요 0 조회수 307

fixde문제인가요?

미해결

모바일 웹 퍼블리싱 포트폴리오 with Figma

마지막 goods- detail페이지 문의인데요 아래와 보시다 시피 fixed주고나서 저렇게 뛰어나왔어요 box-sizing: border-box 줘도 안먹히고요 width:값을 335px로 줄이면 딱맞는데 원래 fixed 주고 box-sizing: border-box 안먹히는건가요 ?? html도 아래 good-order-info는 goods-detail-content밖으로 밖으로 잘 분리되어 있는데요~~ .goods-order-info { background-color: #fff; border-radius: 10px 10px 0 0; box-shadow: 0 -5px 5px rgba(0, 0, 0, 0.05); padding: 20px; position: fixed; bottom: 0; width: 375px; border: 1px solid red; box-sizing: border-box; } .goods-order-info

  • html/css
  • 모바일-디자인
  • HTML/CSS
  • 모바일-디자인
  • figma
  • 포트폴리오
  • jquery
  • 포트폴리오
비타민걸 댓글 1 좋아요 1 조회수 280

중첩 객체 조회 관련

미해결

실전! Querydsl

안녕하세요! querydsl 강의를 보고 실무에 적용 하던 중 중첩 객체에 대해서 한번의 join query로 만들 수 없을지 궁금하여 질문 드립니다. 만약, A -< B -< C (-< 은 one to many 를 의미) 관계를 가진 객체가 있다고 할 때 selectFrom(A) .leftJoin(A.B) .leftJoin(A.B.C) .where(A.id.eq(1)) .fetch(); 위 코드의 반환 값이 아래와 같기를 희망 하는데요 A = { id: 1, Bs: [ { id : 1, Cs : [ { id: 1 } ] } ] } oneToMany를 조인 하게 되면, SQL은 many의 row를 반환하게 되면서, A객체가 B의 갯수만큼 반환 되게 됩니다. group by등을 통해 해결 하려 했을 때는, oneToMany 컬렉션들이 모두 불러와지지 않는것을 확인 하였고, group by를 활용 하지 않고, 모든 row를 불러와서 aggregate하는 방식으로 코드를 구현 했습니다. 매번 쿼리문을 작성할 때 마다 aggregate하는 코드를 작성하는 것은 옳지 않을 것 같아, 혹시 더 나은 방법이 있을지 문의 드립니다. 혹시 중첩 쿼리를 join 으로 모두 찾아 객체에서 맵핑하려는 시도가 bad practice라면 쿼리 숫자가 늘어나더라도, findByAId, findByBId 등의 방식으로 여러번 쿼리를 하고, 중간에 캐시 레이어를 두는것이 더 나을지도 궁금 합니다. 항상 좋은 강의 감사합니다 :)

  • jpa
  • JPA
  • querydsl
  • java
뜨어어 댓글 3 좋아요 2 조회수 954

마지막 강의 js파일로 바꿀 시 스크롤 프레임 렉? 버벅임?

미해결

애플 웹사이트 인터랙션 클론!

마지막 강의에서 올리신 js파일로 바꾸니 애니메이션이 들어가있는 section 0, 2에서 터치패드로 스크롤 시 멈추는 부분에서 몇프레임 앞뒤 왔다갔다 하는 현상이 좀 심하게 발생합니다. 이전만큼 부드럽게 진행이 되지 않고 좀 간격이 넓게 스크롤 되는 느낌입니다. 이미지 로딩 후 정렬 때문에 이렇게 되는건가요? 아니라면 혹시 팁을 좀 주실 수 있나요? 다시 확인해본 바 새로고침을 하면 이러한 문제가 사라지긴 합니다만 원인을 잘 모르겠네요. 좀 더 알아보겠습니다. 제가 진행한 파일입니다! https://leealvinlee.github.io/Leeum_Maurizio_Catellan/

  • html/css
  • 인터랙티브-웹
  • 웹-디자인
  • 웹 디자인
  • javascript
  • 인터랙티브-웹
  • svg
  • HTML/CSS
  • 클론코딩
  • 클론코딩
fruitpigfoot 댓글 2 좋아요 0 조회수 1059

CommentListItem의 props에 대한 질문입니다.

미해결

처음 만난 리액트(React)

강의에서 CommentListItem 컴포넌트를 만든 후에 CommentList 컴포넌트를 만들었는데, CommentListItem에서 comment를 props로 받는건 CommentList에 map에서 comments에서 배열을 하나씩 뽑을 때 사용할 이름 comment를 생각해두고 CommentListItem가 comment로 명명한 props를 받는건가요? 그리고 map에서 사용할 comment 처럼 쓰이는 것들도 그냥 변수라고 부르나요? index가 key 값으로 사용되지 않았는데 존재 이유는 무엇인가요?

  • html/css
  • HTML/CSS
  • javascript
  • react
exwhite 댓글 1 좋아요 0 조회수 513

선생님 질문 있습니다.

미해결

자바와 스프링 부트로 생애 최초 서버 만들기, 누구나 쉽게 개발부터 배포까지! [서버 개발 올인원 패키지]

이번 강의에서 질문이 있는 부분은 get /user 부분의 controller에서 User에 대한 리스트를 그냥 반환하지 않고 UserResponse라는 DTO를 통해 리스트를 반환하신 이유에 대해 궁금합니다. 스프링부트 프레임워크에서 강제하는 부분인건가요?

  • mysql
  • java
  • spring
  • aws
  • jpa
  • JPA
  • spring-boot
이종민 댓글 4 좋아요 7 조회수 770

js 파일로 따로하면

해결됨

[코드캠프] 시작은 프리캠프

안녕하세요 강사님 질문이 있습니다. 인증번호 전송하는 예시를 html내부에 js 태그로, 퀴즈를 거의 비슷하게 맞춰서 완료하긴 했는데, 이를 js 확장자로 파일을 2개 나눠서 진행해봤는데 뭐가 문제인지 잘 작동하지 않습니다. 단순히 제가 뭐를 잘못 입력한건지 아니면 이렇게 2개 나눠서 하는게 안되는건지 궁금합니다!!

  • html/css
  • javascript
  • HTML/CSS
rntqhdl10 댓글 1 좋아요 0 조회수 394

아톰 에디터 설치

미해결

[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기

atom.io로 들어가면 자꾸 이런 화면이 나오네요! 어떻게 해야 강의에서 보여주시는 화면으로 들어갈 수 있나요? ㅠㅠㅠ

  • html/css
  • bootstrap
  • HTML/CSS
  • javascript
태보미 댓글 1 좋아요 2 조회수 966

Grid 수직정렬 문의

미해결

CSS Flex와 Grid 제대로 익히기

안녕하세요. 영상 잘 보고 있습니다. 문의드리고 싶은 내용은 다음과 같습니다. 3행 1열 의 부모 컨테이너와 자식요소 (.logo, .search-bar, .banner) 일때 .container { display: grid; grid-template-columns : 20% 1fr 20%; } @media (max-width: 600px) { // 에서 1행 3열로 변동하게 된다면 #header{ display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr 1fr 1fr; } .logo, .search-bar, .banner{ grid-column: 1/2; grid-row: 1/2; } } 자식요소에 grid-column: 1/2; grid-row: 1/2; 적용시키는게 일반적인 방법인가요?

  • html/css
  • flex
  • HTML/CSS
돈 많은 백수이고 싶다 댓글 1 좋아요 0 조회수 1098

인기 태그

인프런 TOP Writers

주간 인기글