172만명의 커뮤니티!! 함께 토론해봐요.
미해결
처음 만난 리액트(React)
안녕하세요 헷깔리는게 있어서 질문을 드립니다. JSX 사용시에 XSS 방지가 된다고 말씀해주셨는데 JSX 문법 사용하지 않고 createElement 사용하더라도 방지가 되는 것 아닌가요? + 제가 생각했던 것은 JSX 가 내부적으로 createElement 를 호출하고 createElement 메소드 내에서 escape 가 일어나는 것 아닌가 했는데, chatGPT 한테 물어본 결과 JSX 문법을 사용하면 createElement 를 호출 하기 전에 escape 을 완료하는 것으로 이해를 하였습니다. 이렇게 이해하는 것이 맞을까요..?
해결됨
반응형 웹사이트 포트폴리오(Architecture Agency)
< 모바일 네비게이션 퍼블리싱 - 모바일트리거, GNB 보이기 감추기> 수업중에 /* Trigger */ .trigger { display: block; width: 24px; height: 14px; position: absolute; right: 20px; top: 20px; } .trigger span { position: absolute; height: 1px; width: 100%; background-color: #000; transition: 0.5s; } .trigger span:nth-child(1) { top: 0; } .trigger span:nth-child(2) { top: 50%; width: 80%; } .trigger span:nth-child(3) { top: 100%; } 이미 .trigger 위치 잡을때 position: absolute를 썼기 때문에 추가로 relative 중복 설정이 불가하면, 어떻게 .trigger가 부모이고 .trigger span이 자식요소가 되서 span이 위치를 잡을 수 있나요?
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
안녕하세요.. 궁금한점이 있어서 질문드립니다.. 밀리의 서재 홈페이지에서 검사를 눌러봤는데 div 다음 data-v-003e81a0 이 부분은 어떤 걸 의미하는지요? 속성명="값" 이렇게 안쓰고 저렇게 쓸 수도 있나요? 그리고 p태그 아래에 글자들에 쌍 따옴표로 묶어준 것도 왜 인지 궁금합니다.. 검사 화면에는 쌍따옴표가 있는데 실제 화면에는 쌍따옴표가 안뜨는건 왜 그럴까요..? https://www.millie.co.kr/v3/brand/update?utm_source=google&utm_medium=cpc&utm_campaign=pc&utm_content=brand&utm_term=%2B%EB%B0%80%EB%A6%AC%EC%9D%98%2B%EC%84%9C%EC%9E%AC%2B&gad_source=1&gclid=Cj0KCQiA-62tBhDSARIsAO7twbb3uOaPxtCl7MI2dexTMHLKLnXTEK9kaIQLua7WRA7sAHVtG_zOt70aAqWJEALw_wcB 그리고 여기서 쓰신 확장 프로그램 이름도 알려주실수 있으실까요..?
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] 값타입 @MappedSuperclass의 차이가 무엇인가요? BaseEntity를 @MappedSuperclass로 놓고 상속받아서 여러 속성을 한꺼번에 갖는것과 값타입 클래스를 @Embeddable로 설정해서 위임하는 것의 차이가 궁금합니다. 둘다 여러 속성들을 동시에 관리해서 다른 테이블의 속성으로 사용하기 위한 목적이라면 하나만 있으면 될 것 같은데, 왜 굳이 2개 모두 필요한가요?
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
선생님.. 텍스트 복사하러 넷플릭스 사이트에 갔는데.. 궁금한 것이 생겨서 여쭤봅니다.. https://www.netflix.com/kr/ newletter div 부분에 원래 클릭 하지않으면 아래 화면이 뜨고 이메일을 입력하려면고 클릭하면 아래 화면처럼 placeholder가 사라지고 background 텍스트가 되는것 같은데.. 이렇게 만들려면 어떻게 하면 되나요..?
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
안녕하세요. 기본 키 맵핑에서 GenerationType.IDENTITY 관련 부분 질문드립니다. GenerationType.IDENTITY는 PK를 입력하지 않아도 auto increment라고 해서 저절로 생성되는 거 아닌가요? 그런데 이런 에러가 떴습니다. ERROR: NULL not allowed for column "ID"; SQL statement: 답변 부탁드리겠습니다. 감사합니다! package hellojpa; import javax.persistence.*; @Entity public class Member { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) private Long id; @Column(name = "name") private String username; public Member() { // 기본 생성자가 하나 있어야 함 } public Long getId() { return id; } public void setId(Long id) { this.id = id; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } } package hellojpa; import javax.persistence.EntityManager; import javax.persistence.EntityManagerFactory; import javax.persistence.EntityTransaction; import javax.persistence.Persistence; import javax.transaction.Transaction; public class JpaMain { public static void main(String[] args) { EntityManagerFactory emf = Persistence.createEntityManagerFactory("hello"); // EntityManagerFactory는 application 로딩 시점에 딱 하나만 만들어놔야 한다. // Transaction 단위로 EntityManager를 만든다. EntityManager em = emf.createEntityManager(); // 쉽게 생각하면 데이터베이스 connection을 하나 받았다고 생각할 수 있음. EntityTransaction tx = em.getTransaction(); tx.begin(); try{ Member member = new Member(); member.setUsername("Opeahchsdf"); em.persist(member); tx.commit(); } catch (Exception e) { tx.rollback(); } finally { em.close(); // 끝나면 반드시 닫아줘야 함 } emf.close(); } } <?xml version="1.0" encoding="UTF-8"?> <persistence version="2.2" xmlns="http://xmlns.jcp.org/xml/ns/persistence" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/persistence http://xmlns.jcp.org/xml/ns/persistence/persistence_2_2.xsd"> <persistence-unit name="hello"> <properties> <!-- 필수 속성 --> <property name="javax.persistence.jdbc.driver" value="org.h2.Driver"/> <property name="javax.persistence.jdbc.user" value="sa"/> <property name="javax.persistence.jdbc.password" value=""/> <property name="javax.persistence.jdbc.url" value="jdbc:h2:tcp://localhost/~/test"/> <property name="hibernate.dialect" value="org.hibernate.dialect.H2Dialect"/> <!-- 옵션 --> <property name="hibernate.show_sql" value="true"/> <property name="hibernate.format_sql" value="true"/> <property name="hibernate.use_sql_comments" value="true"/> <property name="hibernate.hbm2ddl.auto" value="create" /> </properties> </persistence-unit> </persistence>
미해결
[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
안녕하세요, 알고리즘 개선하기 강의를 들은 이후, 새로 짜여진 알고리즘의 원리(?)에 대해 공부하는 중입니다. 그런데, select 부분에 대한 이해가 어려워 질문 올려봐요 ㅠㅠ answer.addEventListener("click", function(){ //'answer' 버튼을 클릭했을 때 4 var children = document.querySelectorAll('.answerList'); for(let i = 0; i < children.length; i++){ children[i].disabled = true; // 버튼 비활성화 children[i].style.WebkitAnimation = "fadeOut 0.5s"; // 0.5초동안 main 섹션이 사라지면 children[i].style.animation = "fadeOut 0.5s" // 사용자가 어떤 한 버튼만 클릭해도, 다른 버튼들은 다 무시가 되고 모든 버튼들이 사라진다. } setTimeout(() => { var target = qnaList[qIdx].a[idx].type; // 우리가 선택한 버튼이 가지고 있는 타입이 target에 할당됨. //버튼을 클릭하는 순간에 바로 값 증가 for(let i = 0; i < target.length; i++){ select[target[i]] += 1; // 이 반복문이 돌고나면 사용자가 버튼을 클릭하였을 때, 12간지의 순서대로 해당하는 type의 값이 1씩 증가 } for(let i = 0; i < children.length; i++){ children[i].style.display = 'none'; // 버튼이 보이지 않게 } goNext(++qIdx); console.log(target); console.log(children.length); },450); //450 경과 시 }, false); 저는 이 for문 안에 들어있는 select[target[i]] += 1; 이 부분을 이해하기 위해 calResult() 부분에 console.log(select); 를 작성하였고, 임의로 선택된 모든 버튼에 대한 select 값을 받을 수 있었습니다. // console.log(select); [2, 4, 3, 4, 4, 3, 4, 4, 2, 5, 1, 6] 우선 저는 처음에 이 숫자들이 select 값이라는 것은 알고 있었으나 진짜 무엇을 의미 하는 지 알 수 없어 수기로 디버깅을 해보았습니다. 모든 버튼에 대한 type 값을 추적해가며 적어보았는데 qIdx 선택한 버튼 type 0 a [1, 2, 4, 9] 1 c [7, 4, 9, 11] 2 b [7, 9 ,11] 3 c [0, 3, 6, 5] 4 c [2, 5, 8] 5 b [0, 3, 6, 10] 6 a [1, 7, 11] 7 c [1, 7, 11] 8 b [1, 3, 6, 11] 9 a [4, 9, 11] 10 c [2, 5, 8] 11 a [3, 6, 4, 9] 선택한 버튼에 대한 type 값의 누계를 도출해보니 [2, 4, 3, 4, 4, 3, 4, 4, 2, 5, 1, 6] // select console에 제가 요청했던 select 값과 동일한 배열이 나왔습니다. 또한 0~11까지의 띠 순서 그대로 오름차순으로 배정된 것을 발견할 수 있었습니다. 제가 부족한 지식을 동원하여 생각한 바로는 type 값을 누계할 때 오름차순으로 정렬하라는 어떤 메세지가 있지 않으면 [4, 2, 3, 4, 4, 3, 1, 4, 2, 6, 4, 5] 이런식으로 순서에 상관없이 해당 값에 대한 누계만 select 에 담길 것으로 예상하였으나 오름차순으로 배열이 정리되어 정렬 원리가 궁금하였습니다. select[target[i]] += 1; 이 부분에서 자동으로 저희가 선택한 버튼들의 type 을 select 배열에 넣을 때, 각 누계 값이 0 부터 11까지의 오름차순으로 자동 정렬되나요? const select = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]; 아니면 저희가 초반에 select 에 0값으로 총 12개의 빈자릿수를 만들어 주었을 때부터 각 자리당 0부터 11까지의 인덱스 주소가 자동 배정되는 건가요? 아니면 이 배열(select)의 정렬방식에 대하여 놓친 부분이 있을까요? 도와주세요 ㅠㅠ
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
제이 쿼리 연결, 제일 처음 강의에서 파일을 왜 새로 만들고, 왜 첫번째 파일 이름은 3.2어쩌구고 Custom파일에 왜 쓰는건지, 연결은 아래 바디 맨 마지막에 3.어쩌고를 먼저 쓰고 그 다음에 custom 쓰라는 부분만 이해하고 인터넷 찾아보니 무슨 링크를 찾아서 넣고 뭐 방법이 여러가지인데 무슨 말인지 당췌 이해가 안갑니다… 설명이 좀 필요할 것 같아요…도와주세요
미해결
빠르게 훑는 HTML + CSS 기초
top 2px left 4px 를 주는데 안에 폰트어썸 아이콘이 움직이는게 아니라 체크박스가 통으로 움직입니다.
미해결
풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
모던 HTML/CSS 로 상용화도 가능한 반응형 모던 웹페이지만들기 11(9:37) 내용중 인터넷 익스플로러 호환성을 위해 width:240px 대신 max-width:240px를 사용하고 flex-shrink:0;을 설정하셨는데 인터넷 익스플로러가 사용되지 않는 현 시점에서 <link rel="short icon" type="image/x-icon" href="img/fun-coding.ico" /> 이와 같이 익스플로러의 호환성을 고려하는 행위가 현업에서 필요한지 궁금합니다!
해결됨
실전! 스프링 데이터 JPA
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 예 [질문 내용] 여기에 질문 내용을 남겨주세요. 안녕하세요 영한님. 이번 강의도 잘 수강한 학생입니다. 강의 내용과 공식 문서를 참고하며 간단한 게시글 리포지토리를 만들어보고자, 아래처럼 작성했었습니다. public interface BoardRepository { Long save(final Board board); ... } @Repository @RequiredArgsConstructor public class BoardJpaRepositoryImpl implements BoardRepository { private final BoardJpaRepository boardJpaRepository; ... } public interface BoardJpaRepository extends JpaRepository<Board, Long> { } 강의 내용대로 스프링 데이터 JPA인 BoardJpaRepository에 Impl을 붙인 BoardJpaRepositoryImpl을 만들었는데, 아래와 같이 순환 참조 문제가 발생했습니다. The dependencies of some of the beans in the application context form a cycle: boardController defined in file [/Users/hyunjoonchoi/Desktop/2024/2024-mju-mentoring/build/classes/java/main/com/mju/mentoring/board/controller/BoardController.class] ↓ boardService defined in file [/Users/hyunjoonchoi/Desktop/2024/2024-mju-mentoring/build/classes/java/main/com/mju/mentoring/board/service/BoardService.class] ┌─────┐ | boardJpaRepositoryImpl defined in file [/..../build/classes/java/main/com/mju/mentoring/board/infrastructure/BoardJpaRepositoryImpl.class] └─────┘ Action: Relying upon circular references is discouraged and they are prohibited by default. Update your application to remove the dependency cycle between beans. As a last resort, it may be possible to break the cycle automatically by setting spring.main.allow-circular-references to true. 그런데 이름을 BoardRepositoryImpl, JpaBoardRepositoryImpl 등 다른 이름으로 하니까 순환 참조 문제가 해결되더라구요 이에 대해서 다른 외국 개발자 분들도 이슈로 올리고, 그것들을 찾아봤으나 메인테이너 분이 @Lazy를 사용하거나 ObjectProvider를 사용해야 한다고 말씀해주시는 것 밖에 없었습니다. 공식 문서 ( https://docs.spring.io/spring-data/jpa/docs/1.5.0.RELEASE/reference/html/repositories.html#repositories.create-instances )를 보면 스프링 데이터 JPA + Impl로 할 시 자동으로 스프링 데이터 JPA의 구현체로 인식한다고 되어 있는 것 같은데, 이런 순환 참조 이슈가 발생한 원인을 알 수 있을까요? 이를 해결해보고자 스프링 데이터 JPA 레포지토리에 직접 이슈로 남기고 ( https://github.com/spring-projects/spring-data-jpa/issues/3320 ) 답변을 받았긴 했습니다만, 여전히 다른 이야기를 하시는 것 같아 영한 님께도 문의드리고 싶습니다!
미해결
HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)
안녕하세요.. MP4 영상 소스에는 검정화면이 없는 것 같은데, 소스에 넣으면 검정 화면이 나타나는 것 같습니다,.. 인터넷이 느려서 그런걸까요..? 영상이 반복되면서 다시 시작할 때 검정화면이 잠깐 나오는 것을 혹시 없애는 방법이 있을까요?
해결됨
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
//상품 추천 api (feat: tensoflow) app.get("/products/:id/recommendation", (req, res) => { const { id } = req.params; //findOne으로 req을 통해 받아온 param값 id에 맞는 상품을조회한다. models.Product.findOne({ where: { id, }, }) .then((product) => { //id와 일치하는 상품에서 type값을 뽑아서, const type = product.type; //type값과 일치하는 상품들을 모두찾는다. models.Product.findAll({ where: { type, id: { //기준이되는 id와 일치하지않는 데이터만찾겠다. //예를들어 id가4번일때 4번을제외한 4번과 같은type의 상품만 보여줘야하는데 //4번도 함께 추천이되니, 4번을 제외하게해준다. [models.Sequelize.Op.ne]: id, }, }, }).then((products) => { res.send({ products, }); }); }) .catch((error) => { console.error(error); res.status(500).send("에러가 발생했습니다.."); }); }); server.js 에서 추천api를 작성하고 웹에서 확인하려고하면 에러내용 TypeError: Cannot read properties of null (reading 'type') at /Users/kimsehun/Desktop/market-prj/h-market-server/server.js:191:28 이런 에러가발생합니다. models-product.js module.exports = function (sequelize, DataTypes) { const product = sequelize.define("Product", { name: { type: DataTypes.STRING(20), allowNull: false, }, price: { type: DataTypes.INTEGER(10), allowNull: false, }, seller: { type: DataTypes.STRING(30), allowNull: false, }, description: { type: DataTypes.STRING(300), allowNull: false, }, imageUrl: { type: DataTypes.STRING(300), allowNull: true, }, soldout: { type: DataTypes.INTEGER(1), allowNull: false, defaultValue: 0, }, type: { type: DataTypes.STRING(50), allowNull: true, }, }); return product; }; 계속보고있는데, findOne부분에서 where을 통해 id값에 해당하는 상품을 못찾아서 product에 데이터가 담기지않아서, type을 못불러오는거같은데. 뭐가문제일까요??
미해결
java spring 을 사용하려고합니다 근데 이때
미해결
자바 ORM 표준 JPA 프로그래밍 - 기본편
Parent class @Id @GeneratedValue private Long id; private String name; @OneToMany(mappedBy = "parent",cascade = CascadeType.ALL) private List<Child> childList = new ArrayList<>(); public void addChild(Child... childArray) { for (Child child : childArray) { child.setParent(this); childList.add(child); } } Child class @Setter @Id @GeneratedValue private Long id; private String name; @ManyToOne @JoinColumn(name = "PARENT_ID") private Parent parent; Main 메서드 Parent parent = new Parent(); Child child = new Child(); Child child1 = new Child(); parent.addChild(child, child1); em.persist(parent); em.flush(); em.clear(); Parent findParent = em.find(Parent.class, parent.getId()); Child findChild = findParent.getChildList().get(0); em.remove(findChild); tx.commit(); Main메서드에서 findParent에서 자식 리스트를 가져와 첫번째 자식을 삭제해도 db에는 여전히 child, child1이 남아있는데 혹시 왜 그런지 알 수 있을까요?
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
다른 수강생분들에게도 문제 해결에 도움을 줄 수 있도록 좋은 질문을 남겨봅시다 :) 1. 질문은 문제 상황을 최대한 표현해주세요. 2. 구체적이고 최대한 맥락을 알려줄 수 있도록 질문을 남겨 주실수록 좋습니다. 그렇지 않으면 답변을 얻는데 시간이 오래걸릴 수 있습니다 ㅠㅠ ex) A라는 상황에서 B라는 문제가 있었고 이에 C라는 시도를 해봤는데 되지 않았다! 3. 먼저 유사한 질문이 있었는지 꼭 검색해주세요! 상품상세페이지 구현-2 마지막에 보면 css를 적용하고자, product폴더내에 Index.css를 만드는데, Index.js에 css를 import하지 않고 넘어가서 상세페이지구현-3 영상에서는 그냥 css를 적용하고 적용되는 모습이 영상에 담겨있습니다. 원래 자동으로 Import 되는게 아니라면, 이부분에 대한 추가적인 제안이 필요할거같습니다. import "./index.css";
미해결
실전! Querydsl
querydsl이 지원 중단되었다고 들었는데, 계속 사용할 메리트가 있을까요? 궁금해서 여쭤봅니다!
해결됨
김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음
========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 강의를 보다가 문득 궁금한 부분이 생겨서 질문 드립니다. int의 경우 오버플로우가 발생하면 Long 형으로 형 변환을 하면 된다고 하셨는데 double을 사용하다가 오버플로우가 발생한다면 어떻게 처리를 하는지 궁금해져서 질문드립니다. 혹시 double형을 사용하면서 오버플로우가 발생하는 상황 자체가 잘 못 된것일까요?
미해결
반응형 웹사이트 포트폴리오(Architecture Agency)
items에 div를 사용했기때문에 CSS작성시 그러한 것 때문에 이왕이면 다른 태그가 좋다고 하는 부분은 이해가 됐어요~ 혹시나 dl dt dd 태그를 이용을 안하신건 이유가 있으실까요? div를 사용해도 되고 어느것도 괜찮다고 하셨는데 dl이 있는데 이용하지 않고 span태그와 h3를 이용하신 이유가 있을 것 같아서요.
미해결
비전공자를 위한 진짜 입문 올인원 개발 부트캠프
import { API_URL } from "./config/constants.js"; import avatarImg from "./assets/icons/avatar.png"; import React from "react"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity, Alert, } from "react-native"; import { GestureHandlerRootView } from "react-native-gesture-handler"; import Carousel from "react-native-reanimated-carousel"; import axios from "axios"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; import "dayjs/locale/ko"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function App() { const [products, setProducts] = React.useState([]); const [banners, setBanners] = React.useState([]); React.useEffect(() => { axios .get(`${API_URL}/products`) .then((result) => { const products = result.data.products; setProducts(products); }) .catch((error) => { console.log("error :", error); }); axios .get(`${API_URL}/banners`) .then((result) => { const banners = result.data.banners; setBanners(banners); }) .catch((error) => { console.log("error :", error); }); }, []); return ( <GestureHandlerRootView> <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} sliderWidth={Dimensions.get("window").width} itemWidth={Dimensions.get("window").width} itemHeight={200} renderItem={(obj) => { return ( <TouchableOpacity onPress={() => { Alert.alert("배너 클릭"); }} > <Image style={styles.bannerImage} source={{ uri: `${API_URL}/${obj.item.imageUrl}` }} resizeMode="contain" /> </TouchableOpacity> ); }} /> <Text style={styles.headline}>판매되는 상품들!</Text> <View style={styles.productList}> {products.map((product, index) => { return ( <View key={index} style={styles.productCard}> {product.soldout === 1 && <View style={styles.productBlur} />} <View> <Image style={styles.productImg} source={{ uri: `${API_URL}/${product.img_url}`, }} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price}원</Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={avatarImg} /> <Text style={styles.productSellerName}> {product.seller} </Text> </View> <Text style={styles.productDate}> {dayjs(product.created_at).fromNow()} </Text> </View> </View> </View> ); })} </View> </ScrollView> </View> </GestureHandlerRootView> ); } const styles = StyleSheet.create({ headline: { fontSize: 24, fontWeight: "800", marginTop: 10, marginBottom: 10, }, container: { flex: 1, backgroundColor: "#fff", paddingTop: 32, margin: 10, }, productCard: { width: "100%", borderColor: "rgb(230,230,230)", borderWidth: 1, borderRadius: 16, backgroundColor: "white", marginBottom: 10, }, productBlur: { position: "absolute", top: 0, bottom: 0, right: 0, left: 0, backgroundColor: "#ffffffaa", zIndex: 999, }, productImg: { width: "100%", height: 210, }, productContents: { padding: 8, }, productSeller: { flexDirection: "row", }, productAvatar: { width: 24, height: 24, }, productFooter: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginTop: 12, }, productName: { fontSize: 14, }, productPrice: { fontSize: 16, fontWeight: "600", marginTop: 8, }, productSellerName: { fontSize: 14, }, productDate: { fontSize: 14, }, productList: { alignItems: "center", }, bannerImage: { width: "100%", height: 200, }, }); 어떤 오류메세지도 뜨지않고, 에뮬레이터에 화면이 출력되지않는 문제가 발생합니다. Carousel을 적용하기전에는 화면 잘 출력되었는데, Carousel을 적용하니 화면이 출력되지않네요.. Error: PanGestureHandler must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized. See https://docs.swmansion.com/react-native-gesture-handler/docs/installation for more details. 이러한 오류가 발생해서 GestureHandlerRootView 태그로 최상단에 묶어주니 저 오류는 사라졌는데, 애뮬레이터의 화면이 출력되지 않는 문제가 발생합니다. 서버는 잘 연결되어있는걸 확인햇습니다.. 뭐가문제일까요
