inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

코드 작성 후, 리로드하면 웹브라우저에서 코딩이 그대로 실행됨

미해결

컴퓨터, 웹, 코딩, 프로그래밍의 시작 - Web1

처음에는 태그 자동완성도 되고 리로드도 정상적으로 실행됐습니다. 그런데 수강 중 실습하면서 코딩 작성하다가 알림창이 떠서 확인도 안하고 클릭했더니 다음부턴 태그 자동완성도 안되고, 웹브라우저로 리로드하면 원본 코드 그대로 나타납니다... visual studio code 삭제 이후 재설치해봤는데도 똑같은 상태라서 어떻게 해야할지 모르겠습니다.

  • html/css
  • HTML/CSS
민지 댓글 0 좋아요 0 조회수 341

브라우저 사이즈에 따라 위치값이 달라지는건 왜일까요..?

미해결

인터랙티브 웹 개발 제대로 시작하기

안녕하세요 전진 3D스크롤 예제를 이리저리 수정해보고 있는데요. 옆면 벽에 더해 위쪽 벽도 만들어보고 싶어서 수정하고 있습니다. 브라우저 사이즈가 작을때는 정상적입니다.. 근데 브라우저를 최대화하면... 이렇게 위쪽 벽이 튀어나가버립니다.. html은 실습예제에서 양쪽벽과 위쪽벽만 빼고 삭제했습니다.. <div class="world"> <div class="stage"> <div class="house"> <section class="wall wall-left"></section> <section class="wall wall-right"></section> <section class="wall wall-upper wall-upper-left"></section> <section class="wall wall-upper wall-upper-right"></section> </div> </div> </div> css는 body world stage house wall는 실습예제와 크게 다른점이 없구요.. body { height: 100vh; font-family: 'Apple SD Gothic Neo', 'Roboto', 'Noto Sans KR', NanumGothic, 'Malgun Gothic', sans-serif; color: #555; background: #555; } .world { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; perspective: 100vw; } .stage { position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; transform-style: preserve-3d; } .house { width: 100vw; height: 100vh; transform: translateZ(-500vw); transform-style: preserve-3d; } .wall { position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; } 옆벽과 위쪽벽만 아래처럼 만들어놨습니다.. .wall-right { background:#6b68ff55; width: 1000vw; transform: rotateY(90deg) translateZ(-400vw) } .wall-upper-left { height: 1000vw; background: #00000055; transform: rotateX(90deg) translateZ(500vw) } 둘다 길이가 1000vw라서 브라우저 가로사이즈에 따라 달라질 요인은 없는거같은데... 왜 그럴까요?ㅠㅠ 세로로는 브라우저 크기에 영향을 안받고, 오직 가로크기가 변하면 저렇게 어긋나버립니다..

  • html/css
  • javascript
  • 인터랙티브-웹
  • 인터랙티브-웹
  • HTML/CSS
때찌 댓글 1 좋아요 0 조회수 637

Event handler 질문입니다.

미해결

처음 만난 리액트(React)

변수 handleConfirm의 Arrow function이 실행하는 것은 어떤걸 받아서 무엇을 하는 건가요? prevIsConfirmed이 뭘 하는 녀석인지 모르겠습니다.

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

조건(where)을 포함한 일대다(1:N) 페이징 쿼리 질문

미해결

실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화

안녕하세요. 영한님 20만 수강생 진심으로 축하드립니다.^^🎉 프로젝트 도중에 막혀서 강의를 👀복습하던 중 질문드립니다..! (영한님 강의 덕분에 저도 이러한 고민을 하게되다니... 감사의 말씀 드립니다.😊) 페이징이 가능하고 item.name 으로 order 를 조회하려고 하면 어떠한 방식으로 코드를 작성 해야할까요? 일단 제가 생각한 방법은 다음과 같습니다. V3.1 적용 요구사항은 회원( member ), 결제( payment ), 배송( delievery ), 주문 상품( orderItem )을 포함해서 페이징이 되도록 주문( order )을 조회하고, 조건으로 상품 이름( item.name )으로 조회가 가능 해야 하는 것 입니다. orderItem 은 일대다 관계 이기 때문에 페이징이 불가합니다. 그래서 V3.1의 방법인 hibernate.default_batch_fetch_size 을 이용하여 IN 쿼리로 orderItem 을 조회하려고 합니다. 이렇게 하면 페이징이 가능하도록 order 는 조회할수는 있지만, item.name 을 조건으로 조회 할 수는 없습니다. V5 적용 그래서 V5에서 알려주신 방법을 사용했습니다. order 와 orderItem 을 분리한다. order 을 이용하여 orderItem 을 조회한다.(추가로 item.name 조건도 넣는다.) 조회한 결과를 하나의 List 으로 만든다. List 을 다시 Page 로 변환한다. public Page<AdminOrderListQueryDto> findOrdersByAdmin(Pageable pageable, OrderSearchCondition condition) { // 주문 전체 조회 List<AdminOrderListQueryDto> content = queryFactory .select(new QAdminOrderListQueryDto(order.id, order.status.stringValue(), order.safeKingPayment.amount, order.createDate, order.merchantUid, new QAdminOrderListPaymentQueryDto(order.safeKingPayment.status.stringValue()), new QAdminOrderListMemberQueryDto(order.member.name), new QAdminOrderListDeliveryQueryDto(order.delivery.receiver, order.delivery.status.stringValue())) ) .from(order) .leftJoin(order.safeKingPayment, safekingPayment) .leftJoin(order.delivery, delivery) .leftJoin(order.member, member) .where( orderBetweenDate(condition.getFromDate(), condition.getToDate()), deliveryStatusEq(condition.getDeliveryStatus()), paymentStatusEq(condition.getPaymentStatus()) ) .orderBy(order.createDate.desc()) .fetch(); // 주문 아이디 저장 List<Long> orderIds = content.stream() .map(o -> o.getId()) .collect(Collectors.toList()); // 상품명으로 검색 조건 Map<Long, List<AdminOrderListOrderItemQueryDto>> orderItemMap = findOrderItemMap(orderIds, condition.getKeyword()); // 주문객체에 주문 상품컬렉션 저장 content.forEach(o -> o.setOrderItems(orderItemMap.get(o.getId()))); // 주문상품이 null이 아닌 컬렌션으로 구성 List<AdminOrderListQueryDto> resultContent = content.stream() .filter(o -> o.getOrderItems() != null) .collect(Collectors.toList()); // List를 Page로 변환 PageRequest pageRequest = PageRequest.of(pageable.getPageNumber(), pageable.getPageSize()); int start = (int) pageRequest.getOffset(); int end = Math.min(start + pageRequest.getPageSize(), resultContent.size()); if(start > end) { throw new OrderException("데이터가 없습니다. 관리자에게 문의하세요."); } return new PageImpl<>(resultContent.subList(start, end), pageRequest, resultContent.size()); } private Map<Long, List<AdminOrderListOrderItemQueryDto>> findOrderItemMap(List<Long> orderIds, String keyword) { // 주문 상품 검색(item.name 조건 포함) List<AdminOrderListOrderItemQueryDto> orderItems = queryFactory.select(new QAdminOrderListOrderItemQueryDto(orderItem.order.id, orderItem.id, orderItem.item.name)) .from(orderItem) .leftJoin(orderItem.item, item) .where( orderItem.order.id.in(orderIds), keywordContains(keyword) ) .fetch(); // Map 으로 변환 Map<Long, List<AdminOrderListOrderItemQueryDto>> orderItemMap = orderItems.stream() .collect(Collectors.groupingBy(orderItemQueryDto -> orderItemQueryDto.getOrderId())); return orderItemMap; } // 아이템이름 포함 조건 private BooleanExpression keywordContains(String keyword) { return hasText(keyword) ? item.name.contains(keyword) : null; } 이러한 방식을 사용하는게 맞을까요? 🤔 감사합니다.^^

  • spring
  • spring-boot
  • java
  • jpa
  • JPA
  • spring-boot
개발하는쿼카 댓글 1 좋아요 2 조회수 1249

안녕하세요 야생형 코스 관련 질문 드립니다.

해결됨

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

안녕하세요. 오늘도 질문을 남기러 왔습니다. 자주 올려서 죄송합니다ㅠ 저는 이제 국비지원학원에서 JSP + SERVLET을 기반으로하는 팀 프로젝트를 마치고 스프링 강의에 들어갑니다. 학원 강의를 따라가기 위해, 김영한 강사님의 스프링 입문, 스프링 핵심 원리(기본편) 강의로 스프링을 예습을 해둔 상태입니다. 원래대로라면 다음 강의로 스프링 MVC 1편을 들을 예정이었지만, 강사님 조언에 따라서 야생형 코스를 밟고자합니다! 저 같은 상황이라면 바로 JPA 활용 1편으로 넘어가면 되는게 맞을까요? 학원 커리큘럼이 mybatis 기반이라 JPA를 선행학습하는게 맞나 고민이 생겨서 질문 드립니다 ㅠㅠ...

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

Integer.parseInt,와 Integer.valueof 의 차이가 궁금합니다.

미해결

나도코딩의 자바 기본편 - 풀코스 (20시간)

int i = Integer.parseInt("93"); System.out.println(i); int i = Integer.valueOf("93"); System.out.println(i); 두 개다 93으로 출력이 되는데 둘 다 맞는 문법인가요? 문자를 정수로 바꿔준다는 기능은 똑같은거 같은데.. 차이가 뭔지 잘 모르겠습니다..

  • 객체지향
  • oop
  • java
cjygisa 댓글 1 좋아요 0 조회수 6125

백엔드 개발자 커리큘럼이 어떻게 되나요?? (인프런강의)

미해결

강의가 다양해서 어느 순서로 공부해야하는지 잘 모르겠습니다. 인프런 내에서 들을 수 있는 강의로 커리큘럼을 짜주세요. 혼자서 개인프로젝트 만들 수 있는 수준으로 커리큘럼 짜고 싶습니다.

  • 백엔드
  • 자바
  • java
  • 스프링
쿠루 댓글 0 좋아요 0 조회수 555

38강 질문

미해결

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

안녕하세요 강의 잘 듣고 있습니다. 강의를 듣다 질문이 있어서 글 남깁니다! profiles 설정을 할때 인텔리제이 무료 버전이라 add vm options 를 -Dspring.profiles.active=local 로 설정하면 local로 설정할 수 있다고해서 이런식으로 일단 profiles를 local로 설정했는데 홈페이지 실행 후 접속하니 mysql에서의 정보가 그대로 남아있습니다. local설정을 잘 했는데 h2에 연결이 안되는거 같은데 원인이 무었일까요? 그리고 h2사이트에 접속해 강의 내용대로 connect를 하니 접속이 안됩니다...

  • java
  • spring
  • aws
  • spring-boot
  • mysql
  • jpa
  • JPA
오늘내일 댓글 1 좋아요 1 조회수 447

DB 값 질문

해결됨

실전! 코틀린과 스프링 부트로 도서관리 애플리케이션 개발하기 (Java 프로젝트 리팩토링)

안녕하세요 코틀린강의부터 코프링까지 잘 듣고 있습니다. 바로 질문 드리자면,! 1.saveUserTest2라는 테스트케이스를 한 개 더 만들어서 모든 테스트를 진행 시킨다면, saveUserTest는 통과하지만 saveUserTest2는 DB데이터가 2개 가 있어서 통과되지 못 합니다. 이럴 때는 어떻게 해야 독립적으로 DB값을 가지게 할 수 있나요? @Transactional 쓰는 rollback된다고 얼핏 들은 거 같은데 잘 모르겠네요.. 2.실제 h2 DB에는 유저가 2명이 저장이 되어 있는데 테스트환경에서는 0명인 이유는 @SpringBootTest 어노테이션이 실제 실행환경과 완전히 독립된 환경을 만들어 주어서 그런 건가요? 감사드립니다.

  • refactoring
  • spring
  • spring-boot
  • kotlin
  • 리팩토링
  • java
차가운물 댓글 1 좋아요 1 조회수 485

Authorization Code 궁금증이 있습니다.

해결됨

스프링 시큐리티 OAuth2

안녕하세요 선생님 강의 잘 듣고 있습니다 Authorization Code 요청하기 강의를 듣고 궁금한점이 생겨서 질문 올립니다 이번 강의의 핵심은 임시코드 발급하기 였습니다 클라이언트가 keyCloak 와 연동해서 어떻게 redirect uri 를 만들고 어떻게 요청을 하고 인증이 완료 되는것도 같이 해보았습니다 다만 저는 좀 궁금한게 선생님이 총 2개의 로그인 방식을 보여주셨다고 생각합니다 이 링크를 클릭했을때의 방식 다른 방식은 세션을 완전히 제거한 이 화면에서 로그인 하는 방식을 보여주셨습니다 여기선 궁금한건 이번강의 주제는 임시코드를 발급받는 Filter 에 대해서 공부중인데 첫번째 스크린샷에서는 선생님이 말씀하신 대로 OAuth2AuthorizationRequestRedirectFilter 에서 잘 요청이 들어옵니다 requset 가 "/oauth2/authorization"; 들어오기 떄문인데 두번쨰 스크린샷에서는 전혀 이 필터를 태우지 않습니다 저는 임시코드 발급이라고 하길래 지금 할려는 스크린샷 1 , 2 두 행동 모두가 임시코드를 발급받기 위한 행동으로 알고 있습니다 그런데 첫번째 스크린샷은 OAuth2AuthorizationRequestRedirectFilter 필터를 태우고 두번째 스크린샷은 OAuth2LoginAuthenticationFilter 이 필터를 태우고 있습니다 이 앞의 configure 강의에서도 요청 순서 말씀하시면서 OAuth2AuthorizationRequestRedirectFilter 가 먼저 요청을 받아서 임시코드를 받아오고 그 다음 OAuth2LoginAuthenticationFilter 가 진행된다 라고 하셔서 제가 지금 혼동이 오는거 같습니다. 앞의 부분에서 제가 놓친 부분이 있을까요 선생님?

  • java
  • spring
  • spring-boot
  • oauth
김동연 댓글 1 좋아요 0 조회수 419

실전예제 4 - 상속관계 매핑 11:05

해결됨

자바 ORM 표준 JPA 프로그래밍 - 기본편

안녕하세요. 실전예제 4 - 상속관계 매핑 11:05 부분에서 'json으로 말아넣는다'는 의미가 어떻게 넣는다는 의미인가요?

  • jpa
  • java
  • JPA
댓글 1 좋아요 2 조회수 536

서비스 운영 중에 @MappedSuperclass 확장 가능 여부

해결됨

자바 ORM 표준 JPA 프로그래밍 - 기본편

안녕하세요. @MappedSuperclass 어노테이션을 사용하는 BaseEntity 클래스는 아래와 같은 필드를 갖고 있습니다. CREATEDBY CREATEDDATE LASTMODIFIEDBY LASTMODIFIEDDATE 여기서 궁금한 점이 하나 생겼는데요. 만약 처음에 100개의 클래스 중 100개 클래스 모두가 BaseEntity 클래스를 상속받아서 공통 필드를 사용하고 있습니다. 그런데 운영중에 100개 중 50개의 클래스에서만 사용하는 공통 필드가 추가되면 이런 경우에는 어떻게 처리하면 좋을까요? 자바에서 상속은 1개만 할 수 있어서 고민이 됩니다. 50개의 클래스에 노가다로 필드를 입력해야 좋을지,,

  • jpa
  • java
  • JPA
kekekiki 댓글 1 좋아요 0 조회수 512

백틱 내부 색상

미해결

처음 만난 리액트(React)

선생님처럼 백틱 내부 문자 색상이 원래 색처럼 나오게 하려 어떻게 해야하나요? 같은색이라 구분이 잘되게 보고 싶은데

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

단위심화 강의 중 질문 있습니다.

해결됨

[코드캠프] 강력한 CSS

안녕하세요 단위심화 강의 중 두 번째 실습 과정 중, 두 번째 줄에 사진이 3장밖에 안 들어가는데 왜 그런건가요..?? flex-wrap: wrap; 까지 적용시켰는데 되지 않네요. 보시는 바와 같이 윗줄은 4장이 출력 되는데, 밑줄은 3장만 출력이 됩니다. 제가 작성한 코드는 html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>06-02-calc2</title> <link rel="stylesheet" href="./index.css"> </head> <body> <div class="container"> <div class="sidebar"> <ul> <li>메뉴1</li> <li>메뉴2</li> <li>메뉴3</li> <li>메뉴4</li> </ul> </div> <div class="contents"> <div class="item">상품</div> <div class="item">상품</div> <div class="item">상품</div> <div class="item">상품</div> <div class="item">상품</div> <div class="item">상품</div> <div class="item">상품</div> </div> </div> </body> </html> css * { box-sizing: border-box; } .container { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; } .sidebar { width: 170px; background-color: orange; padding: 5px 15px; } .sidebar ul { width: 100%; padding: 0; } .sidebar ul li { list-style: none; padding: 5px 0; color: #ffffff; border-bottom: 1px dashed rgba(255,255,255,0.3); /* 메뉴 사이 구분선*/ } .contents { width: calc(100% - 170px); display: flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; } .item { width: 24%;/ height: 180px; background-image: url("../img/dochihello.jpg"); }

  • html/css
  • HTML/CSS
liltjay 댓글 1 좋아요 0 조회수 369

스프링 부트 3.0 + Querydsl 설정 관련

미해결

실전! Querydsl

안녕하세요! 강의 잘 듣고 있습니다 감사합니다. 강의를 따라가다가 잘 안되는 부분이 있어서 질문글 하나 남겨봅니다. Gradle -> Tasks -> build -> clean Gradle -> Tasks -> other -> compileQuerydsl 실행 시에 정상적으로 Q타입 클래스가 생성이 됩니다. 그런데 이후에 테스트 코드를 돌려보면 이런 오류가 뜹니다. 이것저것 해보다가 build파일이 없는 상태에서(삭제 후에) 테스트를 돌리면 돌아가긴 합니다. 정상적으로 빌드해서 돌려보고 싶은데 설정을 어떻게 바꿔야 할까요? https://drive.google.com/file/d/1H7Sz9Z994odDceIhuTp9S4bpfvhDjxAr/view?usp=sharing 구글 드라이브 링크입니다.

  • jpa
  • JPA
  • java
댓글 2 좋아요 1 조회수 4407

슬라이드

미해결

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

안녕하세요 슬라이드가 안되서 확인 부탁드립니다 <!DOCTYPE html> <html lang="ko"> <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="images/logo.png" alt="로고"></a> </div> <div class="navi"></div> </header> <div class="slide"> <a href="#"><img src="images/img1.png" alt="img1"></a> <a href="#"><img src="images/img2.png" alt="img2"></a> <a href="#"><img src="images/img3.png" alt="img3"></a> </div> <div class="items"> <div class="news"></div> <div class="banner"> <a href="#"><img src="images/banner.jpg" alt="배너"></a> </div> <div class="shortcut"> <a href="#"><img src="images/shortcut.jpg" alt=""></a> </div> </div> <footer> <div class="footer-logo"> <a href="#"><img src="images/logo.png" alt="로고"></a> </div> <div class="copy"> <span>COPYRIGHTⓒ by JUST Shop. ALL RIGHTS RESERVED</span> </div> <div class="sns"> <a href="#"><img src="images/sns1.jpg" alt="sns1"></a> <a href="#"><img src="images/sns2.jpg" alt="sns2"></a> <a href="#"><img src="images/sns3.jpg" alt="sns3"></a> </div> </footer> </div> </body> </html>@charset "utf-8"; .container{ width: 1200px; margin: auto; border: 1px solid red; } header{ height: 100px; } header>div{ height: 100px; } .header-logo{ width: 200px; float: left; } .navi{ width: 600px; float: right; } .slide{ height: 300px; position: relative; overflow: hidden; } .slide>div{ font-size: 0; position: absolute; top: 0; left: 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; width: 400px; box-sizing: border-box; } .news{} .banner{} .shortcut{} footer{ overflow: hidden; } footer>div{ height: 100px; float: left; box-sizing: border-box; } .footer-logo{ width: 200px; } .copy{ width: 800px; line-height: 100px; text-align: center; } .sns{ width: 200px; line-height: 140px; text-align: center; } 그리고 푸터 부분에 텍스트는 line-height할때 높이값을 기존 높이와 동일한 사이즈로 하면되는데 이미지는 왜 기존 높이 사이즈로 하면 안되는걸까요??

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

인프런 블로그 작성

미해결

자바스크립트 : 기초부터 실전까지 올인원

인프런 블로그에 학습일기로 해당 강의 속 문제와 문제풀이 내용을 공개로 올려도 되나용??

  • html/css
  • HTML/CSS
  • javascript
한지수 댓글 1 좋아요 1 조회수 503

값 타입을 불변 객체로 만드는 것과 변경 감지랑은 관련 없는 걸까요?

해결됨

자바 ORM 표준 JPA 프로그래밍 - 기본편

안녕하세요, 값 타입을 불변 객체를 만들 때 궁금한 점이 생겨 질문드립니다. 상황을 가정해서 질문드리겠습니다. 상황 값 타입을 불변 객체로 만들어서 값을 수정하기 위해, 새로운 불변 객체를 만들어 엔티티의 필드값을 변경합니다. 질문 위 상황에서 "JPA 관점에서는 어쨌든 컬럼값이 변경되어야 하니까 변경 감지는 계속 일어나고 있다." 처럼 이해해도 괜찮을까요?

  • jpa
  • java
  • JPA
동해물과백두산이마르고닳도록 댓글 1 좋아요 0 조회수 437

인기 태그

인프런 TOP Writers

주간 인기글