inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

브라우저를 줄일 때 화면 깨짐

해결됨

반응형 웹사이트 포트폴리오(App Official Landing Website)

pc버전에서 브라우저 화면을 줄일 때 저렇게 화면이 깨지는데 실제 다른 웹 사이트 처럼 화면을 줄여도 안 깨질려면 max-width 768 버전 말고 max-width 1200도 같이 만들어줘야 하나요?

  • HTML/CSS
  • jquery
  • 반응형-웹
길 산 댓글 2 좋아요 1 조회수 673

Naver Login시 권한에 대해 질문이 있습니다

미해결

스프링 시큐리티 OAuth2

CustomAuthorityMapper 클래스에서 강사님과 코드는 동일하나 authorities가 넘어올시에 위와 같이 넘어옵니다. 그래서 강사님 영상과 다르게 ROLE_USER만이 authority에 대해서 담기게 되고 위의 사진은 hasRole 권한을 해제하여 찍어본것입니다. /api/user에 진입이 불가합니다 코드는 동일한데 뭐가 문제일까요,,,? 강사님의 네이버 로그인시는 response를 안벗기고도 진입이 가능해서 질문드립니다 package io.security.oauth2.sociallogin; import lombok.RequiredArgsConstructor; import org.springframework.security.core.GrantedAuthority; import org.springframework.security.core.authority.SimpleGrantedAuthority; import org.springframework.security.core.authority.mapping.GrantedAuthoritiesMapper; import java.util.Collection; import java.util.HashSet; import java.util.Set; public class CustomAuthorityMapper implements GrantedAuthoritiesMapper { private String prefix = "ROLE_"; @Override public Set<GrantedAuthority> mapAuthorities(Collection<? extends GrantedAuthority> authorities) { HashSet<GrantedAuthority> mapped = new HashSet<>(authorities.size()); for (GrantedAuthority authority : authorities) { mapped.add(mapAuthority(authority.getAuthority())); } return mapped; } private GrantedAuthority mapAuthority(String name) { if(name.lastIndexOf(".") > 0){ int index = name.lastIndexOf("."); name = "SCOPE_" + name.substring(index+1); } if (!this.prefix.isEmpty() && !name.startsWith(this.prefix)) { name = this.prefix + name; } return new SimpleGrantedAuthority(name); } }

  • java
  • spring
  • spring-boot
  • oauth
hangs0908 댓글 2 좋아요 0 조회수 592

일대다 패치 조인 사용 시, 뻥튀기가 되지 않는 문제

미해결

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

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] 아래 처럼 print를 찍었을 때, 저는 id 1과 2가 두 개가 나오지 않습니다. 관련 코드는 아래 첨부하겠습니다. 강의대로 똑같이 했는데, 왜 1개씩만 나오는지 모르겠습니다.. distinct를 넣었을 때와 안넣었을때의 결과가 같습니다. DB에서는 4개로 나오는데 Postman이랑 콘솔에서는 2개로 난오네요.. [v3 적용 시] package jpabook.jpashop2.api; import jpabook.jpashop2.domain.Address; import jpabook.jpashop2.domain.Order; import jpabook.jpashop2.domain.OrderItem; import jpabook.jpashop2.domain.OrderStatus; import jpabook.jpashop2.repository.OrderRepository; import jpabook.jpashop2.repository.OrderSearch; import lom bok.Data; import lombok.Getter; import lombok.RequiredArgsConstructor; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RestController; import java.time.LocalDateTime; import java.ut il.List; import java.util.stream.Collector s; import stati c java.util.stream.Collectors. toList ; @RestController @RequiredArgsConstructor public class OrderApiController { private final OrderRepository orderRepository; @GetMapping("/api/v1/orders") public List<Order> ordersV1(){ List<Order> all = orderRepository.findAllByString(new OrderSearch()); for (Order order : all) { order.getMember().getName(); // 프록시 객체 초기화 order.getDelivery().getAddress(); List<OrderItem> ord erItems = order.g etOrderItems(); orderItems.stream().forEach(o -> o.getItem().getName()); } return all; } @GetMapping("/api/v2/orders") public List<OrderDto> ordersV2(){ List<Order> orders = orderRepository.findAllByString(new OrderSearch() ); List<OrderDto> collect = orders.stream() .map(o -> new OrderDto(o)) .collect( toList ()); return collect; } @GetMapping("/api/v3/orders") public List<OrderDto> ordersV3(){ List<Order> orders = orderRepository.findAllWithItem(); for (Order order : orders) { System. out .println("order ref= " + order + " id=" + o rder.getId()); } List<OrderDto> collect = orders.stream() .map(o -> new OrderDto(o)) .collect( toList ()); return collect; } @Data static class OrderDto{ private Long orderId; private String name; private LocalDateTime orderDate; private OrderStatus orderStatus; private Address address; // VO는 그대로 사용해도 되지만, (VO는 객체이기 때문에, 안에 값이 변하면 다른 객체로 판단) private List<OrderItemDto> orderItems; // 엔티티는 DTO로 다시 한번 래핑이 필요하다. public OrderDto(Order order) { orderId = order.getId(); name = order.getMember().getName(); orderDate = order.getOrderDate(); orderStatus = order.getStatus(); address = order.getDelivery().getAddress(); orderItems = order.getOrderItems().stream() .map(orderItem -> new OrderItemDto(orderItem)) .collect( toList ()); } } @Data static class OrderItemDto { // OrderItem에서 필요한 값만 다시 추출 private String itemName; // 상품명 private int orderPrice; // 주문 가격 private int count; // 주문 수량 public OrderItemDto(OrderItem orderItem) { itemName = orderItem.getItem().getName(); orderPrice = orderItem.getOrderPrice(); count = orderItem.getCount(); } } } public List<Order> findAllWithItem() { return em.createQuery("select o from Order o" + " join fetch o.member m" + " join fet ch o.deliv ery d" + " join fetch o.orderItems oi" + " join fetch oi.item i", Order.class) .getResultList(); }

  • java
  • spring
  • spring-boot
  • jpa
rr8602 댓글 1 좋아요 3 조회수 1041

결과 쿼리 개수가 맞지 않아서 문의 드립니다.

미해결

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

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] [간단한 주문 조회 V3: 엔티티를 DTO로 변환 -패치 조인 최적화] 강의에서 5분 50초 쯤에 v2를 돌려봤을 때, 강사님은 쿼리가 5번 나오는데, 저는 계속 7번이 나오더라구요... order가 처음에 주문 2개를 만들어서 이미 영속성 상태라 그 다음에는 1차 캐시에서 가져오는 것으로 보여 쿼리는 생성이 안되어야 한다고 생각이 드는데, 왜 계속 order 쿼리가 2번 더 나오는 걸까요...? [Query] 2023-10-25T21:54:33.448+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select o1_0.order_id, o1_0.deliver_id, o1_0.member_id, o1_0.order_date, o1_0.status from orders o1_0 join member m1_0 on m1_0.member_id=o1_0.member_id fetch first ? rows only 2023-10-25T21:54:33.449+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473449 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 join member m1_0 on m1_0.member_id=o1_0.member_id fetch first ? rows only select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 join member m1_0 on m1_0.member_id=o1_0.member_id fetch first 1000 rows only; 2023-10-25T21:54:33.450+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select m1_0.member_id, m1_0.city, m1_0.street, m1_0.zipcode, m1_0.name from member m1_0 where m1_0.member_id=? 2023-10-25T21:54:33.451+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473451 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select m1_0.member_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name from member m1_0 where m1_0.member_id=? select m1_0.member_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name from member m1_0 where m1_0.member_id=1; 2023-10-25T21:54:33.451+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select d1_0.delivery_id, d1_0.city, d1_0.street, d1_0.zipcode, d1_0.status from delivery d1_0 where d1_0.delivery_id=? 2023-10-25T21:54:33.451+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473451 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status from delivery d1_0 where d1_0.delivery_id=? select d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status from delivery d1_0 where d1_0.delivery_id=1; 2023-10-25T21:54:33.452+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select o1_0.order_id, o1_0.deliver_id, o1_0.member_id, o1_0.order_date, o1_0.status from orders o1_0 where o1_0.deliver_id=? 2023-10-25T21:54:33.452+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473452 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 where o1_0.deliver_id=? select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 where o1_0.deliver_id=1; 2023-10-25T21:54:33.453+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select m1_0.member_id, m1_0.city, m1_0.street, m1_0.zipcode, m1_0.name from member m1_0 where m1_0.member_id=? 2023-10-25T21:54:33.453+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473453 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select m1_0.member_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name from member m1_0 where m1_0.member_id=? select m1_0.member_id,m1_0.city,m1_0.street,m1_0.zipcode,m1_0.name from member m1_0 where m1_0.member_id=2; 2023-10-25T21:54:33.453+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select d1_0.delivery_id, d1_0.city, d1_0.street, d1_0.zipcode, d1_0.status from delivery d1_0 where d1_0.delivery_id=? 2023-10-25T21:54:33.454+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473454 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status from delivery d1_0 where d1_0.delivery_id=? select d1_0.delivery_id,d1_0.city,d1_0.street,d1_0.zipcode,d1_0.status from delivery d1_0 where d1_0.delivery_id=2; 2023-10-25T21:54:33.454+09:00 DEBUG 37176 --- [nio-8080-exec-3] org.hibernate.SQL : select o1_0.order_id, o1_0.deliver_id, o1_0.member_id, o1_0.order_date, o1_0.status from orders o1_0 where o1_0.deliver_id=? 2023-10-25T21:54:33.454+09:00 INFO 37176 --- [nio-8080-exec-3] p6spy : #1698238473454 | took 0ms | statement | connection 11| url jdbc:h2:tcp://localhost/~/jpashop2 select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 where o1_0.deliver_id=? select o1_0.order_id,o1_0.deliver_id,o1_0.member_id,o1_0.order_date,o1_0.status from orders o1_0 where o1_0.deliver_id=2; [OrderSimpleApiController] package jpabook.jpashop2.api; import jpabook.jpashop2.Repository.OrderRepository; import jpabook.jpashop2.Repository.OrderSearch; import jpabook.jpashop2.domain.Address; import jpabook.jpashop2.domain.Order; import jpabook.jpashop2.domain.OrderStatus; import lomb ok.Data; import lombok.RequiredArgsConstructor; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RestController; import java.time.LocalDateTime; import java.util .List; import ja va.util.stream.Collectors; /** * X To One (컬렉션 X) * Order * Order -> Member * Order -> Delivery */ @RestController @RequiredArgsConstructor public class OrderSimpleApiController { private final OrderRepository orderRepository; @GetMapping("/api/v1/simple-orders") public List<Order> ordersV1(){ List<Order> all = orderRepository.findAllByString(new OrderSearch()); for (Order order : all) { order.getMember().getName(); // Lazy 강제 초기화 order.getDelivery().getAddress(); // Lazy 강제 초기화 } return all; } @GetMapping("/api/v2/simple-orders") public List<SimpleOrderDto> ordersV2(){ // Order 2개 List<Order> orders = orderRepository.findAllByString(new Order Search()); List<SimpleOrderDto> result = orders.stream() .map(o -> new SimpleOrderDto(o)) // map : a -> b로 치환 .collect(Collectors. toList ()); return result; } @GetMapping("/api/v3/simple-orders") public List<SimpleOrderDto> ordersV3() { List<Order> orders = orderRepository.findAll WithMemberDel ivery(); List<SimpleOrderDto> result = orders.stream() .map(o -> new SimpleOrderDto(o)) .collect(Collectors. toList ()); return result; } @Data static class SimpleOrderDto{ // API 명세서 private Long orderId; private String name; private LocalDateTime orderDate; private OrderStatus orderStatus; private Address address; public SimpleOrderDto(Order order) { orderId = order.getId(); name = order.getMember().getName(); orderDate = order.getOrderDate(); orderStatus = order.getStatus(); address = order.getDelivery().getAddress(); } } } [OrderRepository] ... public List<Order> findAllWithMemberDelivery() { return em.createQuery("select o from Order o" + " join fetch o.member m" + " join fet ch o.deliv ery d", Order.class) .getResultList(); }

  • java
  • spring
  • spring-boot
  • jpa
rr8602 댓글 2 좋아요 0 조회수 654

스프링 사용 중 생기는 오류

미해결

안녕하세요 spring tools4를 설치하였고 돌아가는지 확인하고 싶어 확인하는 도중에 오류가 걸려서 글 올립니다. java는 11로 사용하였고 demo1는 local로 실행했을 때 Exception in thread "main" java.lang.UnsupportedClassVersionError: org/springframework/boot/SpringApplication has been compiled by a more recent version of the Java Runtime (class file version 61.0), this version of the Java Runtime only recognizes class file versions up to 55.0 오류가 떠서 java버전이 다르다는 것을 알기는 알아냈지만 인터넷으로 검색한 방법을 다 써봐도 해결이 안됐습니다. 사용한 방법은 build path에서 jre system library로 해보았고 installed jres도 제대로 해두었습니다. compiler에도 11로 표시하였는데 혹시 다른 추가적이 방법이 있을까요

  • spring
  • java
  • springboot
박수현 댓글 1 좋아요 0 조회수 889

개발자도구

해결됨

반응형 웹사이트 포트폴리오(Architecture Agency)

개발자도구에서 모바일 버전으로 볼때 계속 인터넷 연결없음으로 나옵니다 ㅠㅠ 그리고 폴더에 있는 index파일을 누르면 사진과 같이 기본 셋팅만 나오는데 왜 그런지 알 수 있을까요?

  • HTML/CSS
  • jquery
  • 웹-디자인
  • 반응형-웹
오잉 댓글 6 좋아요 2 조회수 539

안녕하세요 강사님

미해결

UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략

이번에 업데이트 해주신 gsap 수업자료에 json 파일은 vscode를 사용해야지만 확인이 가능한건가요? 이전 영상과는 수업자료가 조금 다른거같아 질문드립니다.

  • HTML/CSS
  • 포트폴리오
  • 반응형-웹
  • gsap
  • scrolltrigger
아장 댓글 3 좋아요 0 조회수 329

내용정리 화면은 어디서 볼수있나요?

미해결

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

화면에서 보여주시는 내용정리된 노트?는 어디서 볼수있나요?

  • java
  • spring
  • mvc
  • spring-boot
박예슬 댓글 0 좋아요 0 조회수 737

태그 id, class 에 관한 질문

해결됨

실전! 웹사이트제작! Step by Step! (한국소비자원 소비자시대- 레이아웃제작 기초)

안녕하세요! 수업 잘 듣고 있습니다. 너무 기초적인 질문이라 조금 꺼려졌는데 그래도 스스로 해결되지 않아서 질문드려요. id 태그는 "id는 원칙상, 하나의 id 당 하나의 태그 에만 적용" 한다고 공부했었는데 이와 같은 식으로 하나의 id가 여러 태그에 적용될 수 있는 것을 발견했습니다. 여러 id가 하나의 태그에는 적용되지 않는 것은 확인했습니다. 보통 다른 글에는 태그마다 전부 다른 id를 사용하였습니다. 제가 저 문장을 잘못 이해한 것인지 궁금합니다. (일반적으로 id는 유일한 태그에 사용하고 class 태그를 여러 묶었을 때 사용하는 것인가요?)

  • HTML/CSS
김태현 댓글 1 좋아요 0 조회수 359

h2 버그인가요?

해결됨

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

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 저는 ddl auto를 create로 하고 시퀀스 전략 했을 때, persist 안하고 봐도 시퀀스가 그냥 1, 증가가 50입니다.. 그 다음 persist를 한번 해 봤더니, next value for member_seq를 한번만 호출했습니다. 근데 persist 2번 이상하면, next value for member_seq를 2번 호출합니다. 시퀀스의 현재값도 101번이 됩니다. 뭔가 JPA쪽에서 놓친건가요..? 아니면 제가 뭔가 강의에서 놓친건가요? 그렇게 현재값 101번 만든 후, 이번엔 dll.auto 를 none으로 해서 다시 돌려봤더니 다서 persist 해서 테이블에 저장해서 나온 건 52부터 찍힙니다. persist 안한 것 persist 1번 next value for member_seq 한번 호출 persist 2번 호출 next value for member_seq가 두번 호출 됍니다. 그런데.. 이 상태에서 ddl.auto 를 none으로 하고 다시 한번 로직을 실행해 봤더니.. 어.. 제 생각이 맞다면 101부터 id가 매겨져야 할 것 같은데.. 어.. public static void main(String[] args) { EntityManagerFactory emf = Persistence.createEntityManagerFactory("hello"); EntityManager em = emf.createEntityManager(); EntityTransaction tx = em.getTransaction(); tx.begin(); try{ Member member1 = new Member(); member1.setUsername("A"); Member member2 = new Member(); member2.setUsername("B"); Member member3 = new Member(); member3.setUsername("C"); em.persist(member1); em.persist(member2); // em.persist(member3); tx.commit(); } catch (Exception e){ tx.rollback(); } finally { em.close(); } emf.close(); } 사용 버전 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>jpa-basic</groupId> <artifactId>ex-hello-jpa</artifactId> <version>1.0-SNAPSHOT</version> <properties> <maven.compiler.source>17</maven.compiler.source> <maven.compiler.target>17</maven.compiler.target> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> </properties> <dependencies> <dependency> <groupId>org.hibernate.orm</groupId> <artifactId>hibernate-core</artifactId> <version>6.2.9.Final</version> </dependency> <dependency> <groupId>com.h2database</groupId> <artifactId>h2</artifactId> <version>2.1.214</version> </dependency> </dependencies> </project>

  • java
  • jpa
궁금이 댓글 3 좋아요 1 조회수 968

scss 히스토리 파일

미해결

SCSS(SASS)+FLEX 실전 반응형 웹 프로젝트 with Figma

style.scss가 사진처럼 여러 파일로 히스토리가 남게 저장됩니다. 삭제를 해도 watch css를 하면 다시 파일이 만들어지는데.. 아예 히스토리 안남게 하는 방법이 있을까요 ?

  • HTML/CSS
  • javascript
  • sass
  • jquery
  • scss
김수미 댓글 2 좋아요 1 조회수 477

인라인 요소, 블록 요소

해결됨

따라하며 배우는 HTML, CSS

인라인 요소는 블록 요소를 포함하면 안된다고 알고 있습니다. 브라우저 종류 및 버전마다 특정 요소가 출력이 안되는 경우가 있다고 들었는데, 최근의 경우에는 대부분 정상적으로 출력되는 경우가 많다고 들었습니다. 이 부분에서 궁금한 점이 생겼습니다. 사용자가 어떤 브라우저를 사용할지 모르기 때문에, 유효성을 지켜야 된다고 생각해도 괜찮을까요? 정상적으로 출력되는 브라우저는 유효성을 어기더라도, 사용자의 편의상 출력을 허용하도록 하는걸까요?

  • HTML/CSS
김주원 댓글 1 좋아요 0 조회수 313

max-width에 관해서

미해결

입문자를 위한 반응형 웹 기초 강의

안녕하세요 강사님, <div id='parents'> <div id='child'></div> </div> 여기서 이 밑 두 코드의 차이점을 알 수 있을까요? <style> #parents { width: 50%; } #child { max-width: 100%; } </style> <style> #parents { width: 50%; } #child { width: 100%; } </style>

  • HTML/CSS
  • javascript
  • 반응형-웹
rlawlsgus125 댓글 1 좋아요 0 조회수 480

welcome-heading 부분이 왜 저렇게 위치되는지 모르겠습니다.

미해결

반응형 웹사이트 포트폴리오(App Official Landing Website)

블록요소기 때문에 슬라이드 밑줄에 위치되어야 하는걸로 아는데 왜 슬라이드와 겹쳐서 저렇게 페이지 맨 상단 왼쪽에 위치되는지 모르겠습니다.

  • HTML/CSS
  • jquery
  • 반응형-웹
김지안 댓글 1 좋아요 1 조회수 363

gsap.set() vs gsap.default()

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.02

gsap.set(), gsap.default() 두 가지 모두 트윈의 값을 미리 셋팅하는 역할을 하는데 어떤 상황에서 어떤 것을 사용해야할지 감이 잡히지 않습니다.

  • HTML/CSS
  • javascript
  • 인터랙티브-웹
  • gsap
류지25 댓글 1 좋아요 1 조회수 383

dragger에서 #timeline이 드래그 되는 이유

해결됨

웹 애니메이션을 위한 GSAP 가이드 Part.02

const dragger = Draggable.create('#playhead', { type: 'x', cursor: 'pointer', trigger: '#playhead', // #playhead bounds: { minX: 0, maxX }, onDrag(e) { // console.log(e); animation.pause(); animation.progress(this.x / maxX); }, }); 트리거를 #timeline으로 할 경우 타임라인드래그로 플레이헤드가 제어되는데이렇게 수정하면 안되나요?

  • HTML/CSS
jay k 댓글 1 좋아요 1 조회수 254

video 크기

미해결

실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)

안녕하세요. 위 화면처럼 contents부분의 들어간 video가 옆에 세로 스크롤이 생깁니다. 처음엔 가로, 세로 스크롤이 다 생겨서 다시했더니 이번엔 세로 스크롤이 생기네요. 강의를 더 가면 object-fit: cover;로 맞추던데.. 그렇게 해도 스크롤은 사라지지 않아요. 지금은 우선 여기까지 진도를 나갔지만.. 처음 진도를 나갈땐 visual title의 font-size: 70px;도 먹지않아 글씨가 작았는데.... 왜 그럴까요?

  • HTML/CSS
  • jquery
  • 인터랙티브-웹
  • 반응형-웹
최은석 댓글 1 좋아요 0 조회수 286

아이콘 부분

해결됨

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

아이콘 부분이 너무 다닥다닥 붙어있는데 조금 띄우려면 어떻게 해야하나요ㅠㅠ

  • HTML/CSS
  • javascript
김서연 댓글 1 좋아요 0 조회수 284

9장 Conditional Rendering 실습 질문있습니다

해결됨

처음 만난 리액트(React)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. [Toolbar.jsx] [LandingPage.jsx] [index.js] [결과창] 올려주신 영상과 동일하게 작업을 진행했다고 생각하는데 결과창에서 버튼을 선택해도 상태가 변경되지 않습니다. 어떤 부분이 문제일까요?? react 버전은 18입니다

  • HTML/CSS
  • javascript
  • react
이동훈 댓글 1 좋아요 1 조회수 419

영상 오류 확인 요청 드립니다.

해결됨

UIUX 디자이너 취업을 위한 웹 포트폴리오 제작 : 퍼스널 브랜딩 전략

섹션 14 5차_업데이트(고정된 섹션에 하위 섹션 올라오는 인터렉티브) ScrollTrigger 실무활용_ScrollTrigger Script적용 영상 오류 확인 요청 드립니다. 4분 37초 정도 부터 30분 50초 정도 까지 블랙 화면(소리 X)으로 나옵니다. 확인 후 회신 부탁 드립니다.

  • HTML/CSS
  • 포트폴리오
  • 반응형-웹
  • gsap
  • scrolltrigger
suda111 댓글 3 좋아요 1 조회수 391

인기 태그

인프런 TOP Writers

주간 인기글