묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결프로그래밍 시작하기 : 웹 입문 (Inflearn Original)
이미지가 안가려지는 에러
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있* { padding: 0; margin: 0; } ul, li { list-style: none; } button.transparent { background-color: transparent; border: 0; outline: 0; cursor: pointer; } .container { width: 100%; background-color: #f0f0f0; padding: 10px; } article.card { width: 600px; margin: 20px auto; margin-bottom: 60px; background: #fff; border: 1px solid #c0c0c0; border-radius: 3px; } /* header 시작 */ article.card header { height: 40px; padding: 10px; } article.card header > div { display: inline-block; /* 수평정렬 */ vertical-align: middle; } .circle-image { height: 100%; padding: 5px; box-sizing: border-box; /* padding을 줘도 넘치지 않도록 border-box 설정 */ } .circle-image > img { height: 100%; border-radius: 50%; } .card-username { padding: 10px 0; font-weight: 900; line-height: 20px; margin-left: 5px; font-size: 13px; } .option-more { float: right; padding: 7px; } /* header 종료 */ /* content 시작 */ .card-container { padding: 5px 10px; } /* 버튼 css */ .card-buttons { padding: 0 5px; margin-top: 5px; } .card-buttons > div { display: inline-block; margin-right: 10px; } .card-buttons > div.last-card-button { float: right; margin-right: 0; } /* 좋아요 */ .card-likes { padding: 5px; font-size: 13px; font-weight: 900; } /* 본문 */ .card-content { padding: 2px 5px; font-size: 13px; } .card-content li > div { padding: 1px 0; } .card-content li > div > span { font-weight: 990; } .card-content li.comment > div > button { float: right; } .card-content li.comment > div > button > img { width: 12px; margin-right: 5px; } /* 시간 */ .card-time { padding: 3px; font-size: 11px; color: #a0a0a0; } /* 푸터*/ footer.card-comment { position: relative; height: 55px; border-top: 1px solid #e0e0e0; } footer.card-comment input { width: 100%; height: 100%; border: 0; outline: 0; padding: 0 15px; color: #606060; box-sizing: border-box; /* 넘치길래 추가함 */ } footer.card-comment > div { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); /* 위로 50퍼 올린다 */ /* 여기가 젤 어렵네 */ } footer.card-comment > div > button { color: #0095f6; opacity: 0.5; /* opacity: 투명도 */ padding: 10px 5px; } /* 케러셀*/ article.card main .carousel { width: 100%; /* 600px에 맞게 100퍼센트로 지정 */ position: relative; /* slide의 부모태그 */ } article.card main .carousel > div { overflow: hidden; /* overflow hidden을 통해 넘치는걸 가려짐 */ } article.card main .carousel ul { width: 10000px; /* 이걸 키우고 li를 고정시켜 슬라이드 될수있게 */ } article.card main .carousel ul > li { display: inline-block; } article.card main .carousel ul > li img { width: 600px; } .slide { position: absolute; top: 50%; transform: translateY(-50%); /* 헷갈리는 부분 */ padding: 10px; } .slide img { opacity: 0.75; } .slide-right { right: 0; /* 오른쪽에서 시작하도록 right 0주기 */ } .carousel footer { position: absolute; height: 20px; text-align: center; width: 100%; bottom: -20px; /* height 20px 뛰움으로써 밑으로 내렸지만 더 명세적으로 bottom: -20px*/ } .carousel footer div { width: 6px; height: 6px; background-color: #a8a8a8; /* 네모난거 4개는 상자에다 배경색을 넣은것 인디케이터 */ display: inline-block; border-radius: 50%; } .carousel footer div.active { background-color: #0095f6; } //위에까지가 css 자료 //여기부터 자바스크립트!! window.addEventListener('load', function() { var carousels = document.getElementsByClassName('carousel'); //케러셀 이벤트를 등록하는 로직 for(var i = 0; i < carousels.length; i++) { addEventToCarousel(carousels[i]); // 현재해당하는 carousels 가져옴(배열) } }); function addEventToCarousel(carouselElem) { var ulElem = carouselElem.querySelector('ul'); var liElems = ulElem.querySelectorAll('li'); //너비값 조정 var liWidth = liElems[0].clientWidth; //현재 li의 너비값 var adjustedWidth = liElems.length * liWidth; //이미지 갯수 * 너비 ulElem.style.width = adjustedWidth + 'px'; //슬라이더 버튼 이벤트 등록 , 슬라이드에 대한 객체 정보 다빼옴 var slideButtons = carouselElem.querySelectorAll('.slide'); //슬라이드 버튼 갯수만큼 반복 for (var i=0; i < slideButtons.length; i++) { slideButtons[i].addEventListener('click', createListenerSlide(carouselElem)); } } //클로저로 해서 캐러셀을 이벤트가 호출될때 바뀌지 않고 사용하기 위해 function createListenerSlide(carouselElem) { return function(event) { //event는 매개변수고 이 블록안에서 사용가능 var clickedButton = event.currentTarget;//현재 클릭한 버튼 가져오기 // 값 가져오기 var liElems = carouselElem.querySelectorAll('li'); var liCount = liElems.length; //길이는 4야 var currentIndex = carouselElem.attributes.data.value; //currentIndex : 현재 보고있는 이미지의 순번 //carouselElem의 모든 속성을 가져오고 데이터를 가져오겠다 //슬라이드 버튼 체크 right값을 포함하는지 //-1해주는이유는 4개일경우 마지막은 3이 마지막이기때문 if(clickedButton.className.includes('right') && currentIndex < liCount - 1) { currentIndex ++; scrollDiv(carouselElem, currentIndex); //위에서 3이라면 ++되므로 4번의 위치로 스크롤을 조정해주는 역할 } else if(clickedButton.className.includes('left') && currentIndex > 0) { currentIndex --; //0이면 왼쪽으로 못넘김 scrollDiv(carouselElem, currentIndex); } //인디케이터 업데이트 updateIndicator(carouselElem, currentIndex); //슬라이드 버튼 보여줌 여부 업데이트 updateSlideButtonvisible(carouselElemm, currentIndex, liCount); //새롭게 보여지는 이미지 인덱스 값을 현재 data 값으로 업데이트 carouselElem.attributes.data.value = currentIndex; } } //다음으로 이동할 매개변수로 nextIndex 이용 function scrollDiv(carouselElem, nextIndex) { var scrollable = carouselElem.querySelector('div');//오버플로 히든되는 var liWidth = scrollable.clientWidth;//div의 사이즈 600이라 600이올거임 var newLeft = liWidth * nextIndex; //2번을 하야된다 하면 1200px이 움직일것 scrollable.scrollTo({left: newLeft, behavior: 'smooth'}); } function updateIndicator(carouselElem, currentIndex) { var indicators = carouselElem.querySelectorAll('footer > div'); for (var i = 0; i < indicators.length; i++) { if (currentIndex == i) { indicators[i].className = 'active'; } else { indicators[i].className = ''; } } } function updateSlideButtonvisible(carouselElem, currenIndex, liCount) { var left = carouselElem.querySelector('.slide-left'); var right = carouselElem.querySelector('.slide-right'); if (currenIndex > 0) { left.style.display = 'block'; } else { left.style.display = 'none'; } if(currenIndex < liCount - 1) { right.style.display = 'block'; } else { right.style.display = 'none'; } } 현재 에러 1.이미지가 한개만 보여야하는데 가려지지않는다 2.자바스크립트를 통해 다음사진으로 넘겨지지만 네번째 사진이 보여지지않고 세번째사진도 넓이에 맞지않다. 어느 코드에서 문제가 있는걸까요 선생님 ㅜㅜ
-
해결됨실전! 스프링 부트와 JPA 활용2 - API 개발과 성능 최적화
mapping 사용법
사용 에디터: VSCode V6 Flat 버전을 할 때에 mapping에서 toList()가 먹지를 않습니다. 정확한 에러는 toList() 메소드가 없다고 메소드를 만들어 달라고 합니다. mapping 사용법에는 Map<City, Set<String>> lastNamesByCity = people.stream().collect( groupingBy(Person::getCity, mapping(Person::getLastName, toSet()))); 위와 같이 to타입()으로 쓰는 것 같은데 왜 toList() 타입이 적용 안되는지 모르겠습니다. OrderApiController @GetMapping("/api/v6/orders") public List<OrderQueryDto> ordersV6() { List<OrderFlatDto> flats = orderQueryRepository.findAllByDto_flat(); return flats.stream() .collect(Collectors.groupingBy(o -> new OrderQueryDto(o.getOrderId(), o.getName(), o.getOrderDate(), o.getOrderStatus(), o.getAddress()), Collectors.mapping(o -> new OrderItemQueryDto(o.getOrderId(), o.getItemName(), o.getOrderPrice(), o.getCount()), toList()))).entrySet().stream() .map(e -> new OrderQueryDto(e.getKey().getOrderId(), e.getKey().getName(), e.getKey().getOrderDate(), e.getKey().getOrderStatus(), e.getKey().getAddress(), e.getValue())) .collect(Collectors.toList()); } OrderFlatDto package jpabook.jpashop.repository.order.query; import java.time.LocalDateTime; import jpabook.jpashop.domain.Address; import jpabook.jpashop.domain.OrderStatus; import lombok.Data; @Data public class OrderFlatDto { private Long orderId; private String name; private LocalDateTime orderDate; private OrderStatus orderStatus; private Address address; private String itemName; private int orderPrice; private int count; public OrderFlatDto(Long orderId, String name, LocalDateTime orderDate, OrderStatus orderStatus, Address address, String itemName, int orderPrice, int count) { this.orderId = orderId; this.name = name; this.orderDate = orderDate; this.orderStatus = orderStatus; this.address = address; this.itemName = itemName; this.orderPrice = orderPrice; this.count = count; } } OrderQueryDto package jpabook.jpashop.repository.order.query; import java.time.LocalDateTime; import java.util.List; import jpabook.jpashop.domain.Address; import jpabook.jpashop.domain.OrderStatus; import lombok.Data; import lombok.EqualsAndHashCode; @Data @EqualsAndHashCode(of = "orderId") public class OrderQueryDto { private Long orderId; private String name; private LocalDateTime orderDate; private OrderStatus orderStatus; private Address address; private List<OrderItemQueryDto> orderItems; public OrderQueryDto(Long orderId, String name, LocalDateTime orderDate, OrderStatus orderStatus, Address address) { this.orderId = orderId; this.name = name; this.orderDate = orderDate; this.orderStatus = orderStatus; this.address = address; } public OrderQueryDto(Long orderId, String name, LocalDateTime orderDate, OrderStatus orderStatus, Address address, List<OrderItemQueryDto> orderItems) { this.orderId = orderId; this.name = name; this.orderDate = orderDate; this.orderStatus = orderStatus; this.address = address; this.orderItems = orderItems; } } OrderQueryRepository public List<OrderFlatDto> findAllByDto_flat() { return em.createQuery("select new jpabook.jpashop.repository.order.query.OrderFlatDto(o.id, m.name, o.orderDate, o.status, d.address, i.name, oi.orderPrice, oi.count)" + " from Order o" + " join o.member m" + " join o.delivery d" + " join o.orderItems oi" + " join oi.item i", OrderFlatDto.class) .getResultList(); }
-
미해결인공지능 기초수학
강의교안좀 부탁드립니다
제가 기초가 부족해 교안이 필요할 거 같습니다 zentle10@naver.com 부탁좀 드릴게요
-
미해결[코드팩토리] [초급] Flutter 3.0 앱 개발 - 10개의 프로젝트로 오늘 초보 탈출!
에러가 발생하여 질문 작성합니다.
정상적인 실행이 안 되어 위 두 이미지 내용처럼 gradle 버전을 변경하였더니 정상 실행되었습니다. 다만 하단 이미지와 같이 경고문구가 발생합니다. 위 경고문구를 확인 후 어떻게 해결해야 경고문구가 사라지는에 대한 답변을 듣고 싶습니다. 감사합니다.
-
미해결@시코 - Java 제대로 배우기 (완전 기초)
정리차원에서 듣고있습니다.
강의퀄리티가 매우 훌륭하다고 생각합니다. 강의자체는 비기너용으로 나온듯한데 혹시 차후에 중급이상의 강의를 만드실 계획이 있으신가요?
-
미해결[개정판 2023-11-27] Spring Boot 3.x 를 이용한 RESTful Web Services 개발
Spring boot 2.6.5 버전 validation적용이 안됩니다.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 기존 질문 답변 참고해서 해봤는데, @Past, @Size, @Validation의 임포트 및 에러발생도 없지만 실제 postman에서 테스트 시 오류가 리턴되지 않네요.
-
미해결C# 윈폼_ 응용프로그램 개발(.NetFramework)
Windows Forms Designer가 지원되지 않습니다
솔루션을 생성했는데 Form1.cs 를 강의 화면처럼 디자인 화면으로 볼 수가 없습니다. public partial class Form1 : Form { public Form1() { InitializeComponent(); } } 코드만 보이고 Designer를 누르면 위와 같이 "Windows Forms Designer is not supported for projects targeting .NET Core" 라는 메시지만 나옵니다. .NET 6.0 버전이고 편집기는 Rider 사용중입니다.
-
해결됨[리뉴얼] React로 NodeBird SNS 만들기
폼 만들때 실무에선
안녕하세요 제로초님 실무에서 여러 인풋 요소가있는 폼을 만들때 formik이나 react-form-hook 같은 라이브러리를 사용하는 것을 선호하는 편이신가요?? 아니면 라이브러리를 쓰지 않고 직접 코드를 짜는 것을 선호하시나요!!?
-
미해결JIRA를 활용해 더 효과적으로 프로젝트 협업하기
Jira에서 총무팀과 같이 이슈타입을 정의해서 만들면 에픽 유형은 어떻게 사용하나요?
Jira에서 총무팀과 같이 이슈타입을 정의해서 만들면 에픽 유형은 어떻게 사용하나요?
-
미해결[입문] Qt 6 프로그래밍 1편
hello world 실행결과
강사님 hello world 실행에서 전 강사님처럼 실행 결과가 따로 창에서 뜨지 않는데 어떻게 하면 강사님 처럼 따로 콘솔창에서 결과 뜰까요? 저는 그냥 application Ouput 이라는 창에서 결과가 뜹니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
함수 밑에 return 과 console.log 들어가는 것의 차이는 무엇 인가요?
const dd = function (a){ console.log(~~~); } 실행 : dd(~~~) 이것과 const dd = function (a){ return(~~~); } 실행 : dd(~~~) 이것의 차이가 뭔가요?
-
미해결혼자 공부하는 머신러닝+딥러닝
심층 신경망 옵티마이저
케라스가 다양한 종류의 경사 하강법 알고리즘을 제공하고 이들을 옵티마이저라고 부른다. - 옵티마이저 기본값 = 'rmsprop' - 그 외 다양한 옵티마이저 알고리즘 : sgd, Adagrad, Adam...etc 여기까지는 이해를 했는데, "가장 기본적인 옵티마이저가 확률적 경사 하강법인 SGD이고, 기본 경사 하강법 옵티마이저는 모두 SGD 클래스에서 제공한다." 이 부분이 이해되질 않습니다. 1. RMSprop, SGD, Adagrad, Adam 모두 동일선상의 알고리즘 아닌가요? 아니면 기본 경사 하강법 옵티마이저(SGD, 모멘텀, 네스테로프 모멘텀)와 적응적 학습률 옵티마이저(RMSprop, Adagrad, Adam)를 각각 다른 옵티마이저 그룹으로 나누어 생각해야 하나요?
-
미해결R로 하는 웹 크롤링 - 입문편
readHTMLTable error
엔제리너스 클롤링 과정 중에 htmltab으로 에러가 나서 XML을 설치한 후에 설치한 후에 for문 안에서 readHTMLTable을 불러 왔습니다. 그런데 이것도 에러가 생겨서 더이상 진행을 하지 못했습니다. 이런 경우 어떤 패키지를 새로 설치해야 하는 건지, 다른 코드를 짜야 하는 건지 궁금합니다.
-
미해결Vue.js 시작하기 - Age of Vue.js
vue 개발자도구에서 event탭이 나오지 않습니다
안녕하세요 강사님 따라하는와중에 개발자도구에서 event탭을 전혀 못찾겠습니다..ㅜㅜ 어찌저찌 찾아서 확인은 했는데 강사님과 같은 내용이 나오지 않아 더 당황스럽네요.. 이게 맞는건가요?
-
미해결FreeRTOS 프로그래밍
2. stackoverflow 질문입니다..
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 강사님 강의 잘듣고 있습니다. 강의를 따라가다가 질문이 있어 드립니다. stackoverflow detect 기능에서 config.h의 defien을 2로 변경을 하고 save를 했는데 task.c if문에서 활성화가 안되는건 어떤이유인가요? 강의하고는 별도로 언어적인 질문입니다만 질문을 드립니다. 그래서 Putty에서 안나오는건지 아님 detect를 못한건지 확인이 되네요..
-
미해결[왕초보편] 앱 8개를 만들면서 배우는 안드로이드 코틀린(Android Kotlin)
강사님 혹시 gui냐 손코딩이냐 프로그램 만드는건 프로그래머 스타일인가요??
강사님 안녕하세요. 궁금한게 있어서 질문드립니다. 1. fragment 이해에서요. 위아래 버튼 누르면 match_parent 가 되는데 코딩으로 하시는게 스타일인지 궁금해서 질문드립니다. 디자인은 손코딩대신 gui 방식으로 클릭을하면 디자인이 더 쉬워지고 순서도를 짜는데 더 집중할수 있지 않을까 궁금해서 질문드립니다. 2. 프래그먼트가 웹으로 치면 html처럼 한페이지 역할을 한다고 생각하면 될까요? 그래서 페이지수 늘리고 싶으면 프레그먼트를 많이 생성해서 각각 다른 프래그먼트로 연결 시켜주는 식으로 하면 된다고 생각하면 될까요? 트리 구조식으로 여러번 연결 시켜주는것도 가능하지 않을까요?? 3. 그러면 프래그먼트하고 엑티비티는 웹사이트 어플을 만들때 어떤식으로 구성하면 이상적일까요?? 미리 답변 감사드립니다.
-
해결됨게임 프로그래머 취업 전략 가이드
재지원 관련 문의입니다.
안녕하세요 Rookiss 선생님! 재지원 및 이력서 관련 질문입니다. 1. 몇몇 게임 관련 커뮤니티를 보면 재지원하면 쳐다보지도 않고 탈락이다 이런말이 있던데 재지원해도 괜찮을까요? 괜찮다면 쿨타임은 어느정도 기간이 적절하다고 보시나요? 2. 면접과 취업은 상대적이고 내가 잘해야 된다고 하셨는데요. 제 개인적인 바람은 수시채용으로 욕심이지만 빠른시일 내에 취업하는 것입니다. 물론 책임은 모든 책임은 저에게 있고 제가 남들보다 잘해야 붙기 때문에 최대한 경쟁력을 갖추는게 답이겠지만, 아무래도 경험이 많으신 선생님께 여쭤봅니다. MMORPG c++ 강의에서 패킷자동화 쯤 파이썬 툴을 사용하실 때 이정도면 서버 포트폴리오로 차고 넘친다고 하셨습니다. 파이썬 툴 사용전 까지 포트폴리오를 적용하여 제출 VS 끝까지 수강하여 제출 어느게 낫다고 보시나요?
-
미해결최신 SwiftUI와 UIKit과 함께하는 올인원 iOS 앱 개발 강의
Windows에서도 수업 내용 실습을 무리 없이 진행 가능한가요?`
맥북을 가지고 있지 않은데 ios 개발을 해보고 싶어서 강의를 결제했습니다. Window에서도 강의 실습이 가능한가요?
-
미해결코어 자바스크립트
this는 전역 객체를 가리킨다?
안녕하세요. this는 전역 객체를 가리키는 게 맞는데 왜 console.log(this)를 하면 undefined가 나올까요?? console.log를 console이라는 객체에서 log라는 메서드를 호출하여 여기서 this는 console이라는 객체를 가리키기 때문일까요?? 그래도 console이라는 객체의 정보가 나와야할 것 같은데 undefined가 나와서 헷갈리는 것 같습니다.
-
해결됨AWS 바로 시작하기
EIP 요금
AWS 탄력적 IP 질문있습니다. EIP 하나정도 인스턴스 ENI에 연결하면 무료라고 들었는데, NAT 게이트웨이에 연결하면 추가요금이 발생하나요?