inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

splash screen 화면이 안띄워져요.

미해결

[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스

안드로이드로 실행하고 있고 앱 아이콘까지 성공하였습니다. 그런데 app. tsx에 function Section({children, title}: SectionProps): React.JSX.Element { useEffect(() => { setTimeout(() => { SplashScreen.hide(); }, 1000); }); const isDarkMode = useColorScheme() === 'dark'; 이 코드를 올리면 Cannot read property 'hide' of null 이라고 뜹니다. 그래서 시도해본 방법은 -metro 서버 연겨리도 다시해보고 -js hide 호출위치를 app()쪽에도 해보고 -mainActivity 코드에 SplashScreen.show (this); 코드가 잘 있는지 확인도 하고 -gradle.properties에 android.enableJetifier=true 추가해보고 -androidmanifest의 activity에 android:theme="@style/SplashTheme" 이 부분도 추가해보고 -styles.xml에 resource부분에 <!-- ① 스플래시 화면용 테마 --> <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- launch_screen.xml(layout) 을 배경으로 사용 --> <item name="android:windowBackground">@layout/launch_screen</item> </style> <!-- ② 앱 전체용 기본 테마 --> <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar"> <!-- 여기에 앱 전체 스타일 아이템들을 넣으세요 --> <!-- 예: 상태바 색상, 기본 버튼 스타일 등 --> </style> 이렇게도 넣어보아도 앱이 켜지려다가 바로 꺼져버립니다. 로그도 따로 안남고.. 혹시 이 부분에서 왜 이렇게 되고 해결방안이 있을까요??

  • javascript
  • react
  • node.js
  • react-native
  • typescript
이소연 댓글 2 좋아요 0 조회수 231

React 비기너: 튼튼한 기본 만들기 / 섹션 23. React Event / 2. 이벤트 핸들러 작성

미해결

React 비기너: 튼튼한 기본 만들기

버튼 컴포넌트 onClick={handleClick()} jsx 에서 위처럼 적으면 자바스크립트에서 엔진에서 즉시실행함수로 인식하는것 처럼 인식을 해서 렌더링이 되기도전에 함수를 먼저 실행해버리는 현상이 생기는 이유가 맞을까요? 결국 핸들러 함수의 기능도 하지못하고 1회용으로 즉시실행되고 소멸해버리는 함수가 되어버리는 것 같아보이는데 이에 대한 정확한 설명이 있을까요? 제가 생각한 이 부분에 보충적으로 필요한 설명을 혹시 해주실 수 있으실까요?

  • javascript
  • react
  • 객체지향
  • dom
댓글 1 좋아요 0 조회수 119

빕문 챕터 9 매서드) 문제와 풀이 2 질문

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] import java.util.Scanner; public class Empty { public static void main(String[] args) { Scanner sc = new Scanner( System.in ); int balance = 0, depositAmount = 0, withdrawAmonut = 0; int chooose; while (true) { title(); chooose = sc.nextInt(); switch (chooose) { case 1: balance = deposit(balance, depositAmount, sc); break; case 2: balance = withdraw(balance, withdrawAmonut, sc); break; case 3: printNowBalance(balance); break; case 4: endSystem(); return; default: System.out.println("올바른 선택이 아닙니다. 다시 선택해주세요."); } } } public static void title() { System.out.println("-----------------------------------"); System.out.println("1.입금 | 2.출금 | 3.잔액 확인 | 4.종료"); System.out.println("-----------------------------------"); System.out.print("선택: "); } public static int deposit(int balance, int depositAmount, Scanner sc) { System.out.print("입금액을 입력하세요: "); depositAmount = sc.nextInt(); balance += depositAmount; System.out.println(depositAmount + "원을 입금하였습니다. 현재 잔액: " + balance); return balance; } public static int withdraw(int balance, int withdrawAmount, Scanner sc) { System.out.print("출금액을 입력하세요: "); withdrawAmount = sc.nextInt(); if (balance >= withdrawAmount) { balance -= withdrawAmount; System.out.println(withdrawAmount + "원을 출금하였습니다. 현재 잔액: " + balance + "원"); } else { System.out.println(withdrawAmount + "원을 출금하려 했으나 잔액이 부족합니다."); System.out.println("최종 잔액: " + balance + "원"); } return balance; } public static void printNowBalance(int balance) { System.out.println("현재 잔액 : " + balance + "원입니다"); } public static void endSystem() { System.out.println("시스템을 종료합니다."); } } 문제풀이 2를 최대한 메서드를 활용하기위해 이런식으로 해보고 김영한선생님 코드와 비교해봤는데 살짝 다르더라고요 비교해서 장담점이 어떤 것인지 실무에서는 어떤 스타일을 선호하는지 궁금합니다!

  • java
  • 객체지향
정의석 댓글 1 좋아요 0 조회수 119

Tooltip-useSyncExternalStore()에 함수 넘기는 방식에 대해...

해결됨

[React / VanillaJS] UI 요소 직접 만들기 Part 1

안녕하세요! 항상 유익한 강의를 제공해 주셔서 감사드리며, 강의를 통해 UI를 다양한 방법으로 구현하는 법과 요구 사항의 디테일한 부분을 어떻게 처리해야 하는지에 대해 많은 것을 배우고 있습니다. 조심스럽게 여쭤보고 싶은 점이 있어 글을 남깁니다. 혹시 시간이 괜찮으시면 선생님의 고견을 듣고 싶습니다. - tooltip의 react 버전 viewportContext.tsx에서 useSyncExternalStore()사용부분 useSyncExternalStore를 통해 외부요소의 변화를 구독할 수 있게, 첫번째 인자로 subscribe를 넘기고 해당 상태를 컴포넌트와 동기화 할 수 있도록 두번째 인자로 getViewportRect를 넘기고 있습니다. 첫번째 인자인 subscribe는 함수의 참조를 넘기는데, 두번째 인자인 getViewportRect는 "getViewportRect()"로 값을 넘기고 있어, 이 부분에서 조금 의문이 생겨 아래와 같이 수정하면 어떨까 생각했습니다. useSyncExternalStore의 두번째 인자에도 함수의 참조를 넘기도록 수정하여 react에게 제어권을 넘기고, getViewportRect에서 리턴된 함수는 stored값을 기억할 수 있도록 즉시실행함수로 만드는 방식입니다. const getViewportRect = (() => { let stored: Rect = DefaultRect; return () => { const el = typeof document !== 'undefined' && document.scrollingElement; if (!el) return stored; const { left, top, width, height } = el.getBoundingClientRect(); const newRect = { left, top, width, height, scrollHeight: el.scrollHeight }; if (newRect && !isSameRect(stored, newRect)) stored = newRect; return stored; }; })(); //1. 즉시실행함수로 수정 const ViewportContextProvider = ({ children }: { children: ReactNode }) => { const viewportRect = useSyncExternalStore(subscribe, getViewportRect); //2.두 인자 모두 참조만 넘기도록 수정 return ( <ViewportContext.Provider value={viewportRect}> {children} </ViewportContext.Provider> ); }; 이렇게 수정하는 것이 더 나은 방법일지 여쭙고 싶습니다. useStyleView.ts에서 useLayoutEffect의 의존성배열에 참조 자료형 넣는 것 viewportRect가 객체인데, 이를 의존성배열에 그대로 넣는것이 괜찮은지 궁금합니다. const viewportRect = useViewportRect(); //객체 useLayoutEffect(() => { ... }, [viewportRect, wrapperRef, targetRef, position]); viewportRect에서 개별 값만 분리해서 넣는 방법도 고려해 보았습니다. const { top, left, width, height } = useViewportRect(); //생각해본 버전 useLayoutEffect(() => { ... }, [top, left, width, height, wrapperRef, targetRef, position]); 강의자료에 완성코드가 있다고 하는 걸 어디서 본 것도 같은데... 제가 어디있는지 찾지를 못해서... 🥲 강의 내용만 보고 작성한 코드임을 양해 부탁드립니다. 🙇‍♀

  • react
  • typescript
  • dom
  • ui
  • vanilla-js
이레 댓글 3 좋아요 0 조회수 265

이미지 리사이징 현상 막기

해결됨

(2025) MBTI 테스트 기반 수익형 웹사이트 만들기 - <코딩 배워 사업하자>

선생님! AWS에 이미지 호스팅 서비스 관련해서 궁금한게 있습니다. 제가 테스트를 해봤는데 썸네일 이미지 크기(가로/세로)에 상관없이 실제 운영 환경에는 동일한 크기의 썸네일 이미지로 보여지더라구요. 그러면 이게 AWS 이미지 호스팅 할 때 이미지 크기를 리사이징해서 조절해주는 작업이 일어나는거라고 저는 추측하고 있는데요. 만약 이런 작업이 일어난다면 결국 AWS에 불필요한 작업으로 인한 비용이 발생이 되는거라서... 혹시 이미지 사이즈 크기에 대한 팁이 있을까요?

  • react
  • aws
  • Google-Analytics
  • cloudflare
  • adsense
  • 수익화
asd 댓글 1 좋아요 0 조회수 167

@modal/(i) 로 생성/파일이동 후, 무한 GET 출력

미해결

Next + React Query로 SNS 서비스 만들기

강의의 3분 정도 쯤에, (beforeLogin)/i 폴더와 파일들을 (beforeLogin)/@modal/(i) 로 복사 한 후 http://localhost:3000/i/flow/login 접속시 무한 GET 접속 시도가 터미널 창에 보입니다. 이때, <Link href ="login" className ={styles.login}>로그인</Link> 입니다. 그런데, <Link href ="/i/flow/login" className ={styles.login}>로그인</Link> 변경하면, http://localhost:3000/i/flow/login 접속시, 터미널 창에서는 무한 GET 접속시도는 사라집니다. 어떻게 해서 이렇게 되는지요?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
강진모 댓글 2 좋아요 0 조회수 165

인터셉팅 라우트 설명

미해결

Next + React Query로 SNS 서비스 만들기

강의 50초 정도에, i, login, page.tsx는 {children}에서 렌더링, 여기는 (@modal 의 하위 폴더와 파일 선택) {modal}에서 되죠? 라고 설명하시는 부분이 이해가 안됩니다. 저는, app/(beforeLogin)/layout.tsx 의 {children}은 app/(beforeLogin)/page.tsx 를 가져오는 것이고, {modal}은 @modal 폴더의 page.tsx (default.tsx, i/flow/login/폴더로 리다이렉션) 를 찾는 것으로 이했습니다. 여러 폴더를 모두 보여준다고 설명하신듯하여, 이해가 안되네요.

  • react
  • next.js
  • react-query
  • next-auth
  • msw
강진모 댓글 2 좋아요 0 조회수 101

React 비기너: 튼튼한 기본 만들기 / 섹션22. 이벤트 핸들러 강의 / Content Attribute와 IDL Attribute 사용 방식에 대한 질문드립니다

미해결

React 비기너: 튼튼한 기본 만들기

안녕하세요. 항상 좋은 인사이트와 경험을 공유해주셔서 감사드립니다. 최근 프론트엔드 개발을 공부하면서 "Content Attribute"와 "IDL Attribute"의 사용 방식에 대해 고민하게 되었습니다. 이를 정리해보면서 나름대로 다음과 같은 결론에 이르렀습니다. Content Attribute는 변하지 않는 어트리뷰트 값이나 리소스를 표현할 때 사용하고, 그 외, 동적으로 핸들링이 필요한 경우에는 IDL Attribute를 사용하는 것이 맞다고 이해하고 있습니다. 이러한 개념을 공부하면서, 현업에서 다양한 코드들을 보게 되었는데요, 특히 주니어 개발자분들이 작성한 코드에서는 Content Attribute를 많이 사용하는 반면, 시니어 개발자나 CTO급 분들의 코드에서는 Content Attribute 사용이 상대적으로 적고, 대부분 IDL Attribute를 적극적으로 사용하는 모습을 많이 볼 수 있었습니다. 이런 현상을 보며 자연스럽게 궁금증이 생겼습니다. 왜 경험 많은 개발자일수록 Content Attribute 사용이 줄어드는 걸까? Content Attribute 방식과 IDL Attribute 방식에 대해 어떻게 생각하시고, 어떤 기준으로 선택하시는지 궁금합니다. 혹시 이 부분에 대해 간단히 의견을 들려주실 수 있다면 큰 도움이 될 것 같습니다. (물론 바쁘시다면 답변 주시지 않아도 괜찮습니다! 이렇게 질문을 정리하는 과정만으로도 많은 공부가 되고 있습니다.) 읽어주셔서 감사합니다. 좋은 하루 되세요.

  • javascript
  • react
  • 객체지향
  • dom
댓글 1 좋아요 0 조회수 89

sunriseData 코드

미해결

[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스

2분 22초에서 return 문 앞에 const sunriseData = weatherData ? new Date(weatherData.sys.sunrise); 이렇게 코드를 적었는데 이후의 코드에서는 갑자기 보이지 않아 이 코드는 어디가고 이후의 return 앞에는 이 코드가 오게 되었는지 궁금합니다. const formatTime = timestamp => { const date = new Date((timestamp - 9 * 3600) * 1000); // UTC timestamp에 9시간 추가 return date.toLocaleTimeString([], {hour: '2-digit', minute: '2-digit'}); // 로컬 시간으로 포맷 }; 제가 이해할 때는 sunriseData가 wetherData의 unixtime을 현재 우리가 보는 시간으로 바꾸어 저장하는 것인데... 아래의 formatTime은 sunriseData를 대체한 코드인가요?(시차도 적용한?)

  • javascript
  • react
  • node.js
  • react-native
  • typescript
이소연 댓글 2 좋아요 0 조회수 82

React 비기너: 튼튼한 기본 만들기 / 섹션22. 이벤트 핸들러 / 3. 이벤트 핸들러: 콘텐트 속성 7:00

미해결

React 비기너: 튼튼한 기본 만들기

p id =one onclick=show() 1. five 오브젝트를 클릭할때 one onclick 이벤트삭제 2. five 오브젝트를 클릭할때 one onclick null 로 재할당 2번을 쓰게 되는 경우가 어떤경우가 일까요? 1번방법이 일반적으로 쓰게될 것 같다는 생각이 듭니다

  • javascript
  • react
  • 객체지향
  • dom
댓글 1 좋아요 0 조회수 95

npm_access_token 오류

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

npm_access_token 오류 어떻게 해결하나요 ㅠ ㅠ

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
yoonseong 댓글 2 좋아요 0 조회수 142

CascadeType.ALL vs orphanRemoval=true

해결됨

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

둘의 차이를 테스트 해본 결과 아래와 같은 결과가 나왔습니다. CascadeType.REMOVE 의 경우는 findParent.getChildList().remove(0) 를 해도 자식이 삭제가 안 되고 orphanRemoval = true 는 삭제가 된다. (대신, CascadeType.PERSIST 가 있어야지만 됨) 여기서 의문인 점이 있습니다. orphanRemoval = true 의 경우 왜 CascadeType.PERSIST 가 있을 때만 그렇게 작동하나요?

  • java
  • jpa
조태준 댓글 1 좋아요 0 조회수 146

엔진 말고 추가 기능이 들어간다면 처리 방법

미해결

김영한의 실전 자바 - 중급 1편

========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 현재 자동차에 엔진만 사용되기 때문에 내부 클래스로 넣었는데, 만약 차량 실내 작업(계기판 켜지기, 엠비언트 라이트 점등) 클래스가 하나가 더 있다면 inner 클래스를 두개 만드는게 맞는걸까요? .. 아니면 엔진, 실내 작업 두개를 따로 독립적으로 만드는게 나은걸까요? 문의 드립니다~

  • java
  • 객체지향
slow 댓글 1 좋아요 0 조회수 123

스레드 대기 ReentrantLock 설명부분

미해결

김영한의 실전 자바 - 고급 1편, 멀티스레드와 동시성

1. 강의 내용과 관련된 질문인가요? 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? 예 [질문 내용] 강의에서 ReentrantLock의 대기큐에서 관리할때 BLOCKED가아닌 WAITING에서 락획득을 대기한다고했는데 찾아봤을때 lock.lock()실행시에는 락을 얻기위해서 BLOCKED 상태이고 condition.await()실행되어야 WAITING상태로 기다리는걸로 알고있는데 혹시 잘못된 강의설명인지 궁금합니다.

  • java
  • 객체지향
  • 동시성
  • multithread
  • thread
김태언 댓글 2 좋아요 0 조회수 190

HTTP 서버3 - 기능 추가는 url경로를 바꿀때마다 새로운 소켓과 연결하는건가요?

미해결

김영한의 실전 자바 - 고급 2편, I/O, 네트워크, 리플렉션

안녕하세요 코드를 쳐보다가 궁금증이 생겼습니다. 지난번 채팅프로그램은 클라이언트가 서버에 연결되면 연결된 클라이언트와 서버 소켓이 /exit할때까지 끊기지 않았는데요 이번 예시에서는 사용자가 /, /site1, /site2, /search?q=hello 이렇게 각각의 다른 url로 이동할때마다 서버와 클라이언트의 연결이 새로되고 소켓도 새로 생성되는건가요?

  • java
  • 네트워크
  • 객체지향
한조 댓글 1 좋아요 0 조회수 115

react 에서 css불러오기 오류

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

import "./Main.css";나 import "../Main.css"; 둘다 해봤는데 css를 컴포넌트로 불러오기 오류떠요 ㅠㅠ

  • javascript
  • react
  • node.js
H Hun 댓글 1 좋아요 0 조회수 148

emotion대신 tailwind를 사용하는 이유가 뭔가요?

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

이전 버젼의 강의에서는 emotion을 쓰고 본 강의에서는 tailwind를 쓰는데 저는 emotion이 가독성도 좋고 사용하기 편안하다는 느낌을 받았는데요 새로 생긴 강의에서는 tailwind를 사용하는 이유가 뭘까요?

  • react
  • react-native
  • 하이브리드-앱
지성 댓글 1 좋아요 0 조회수 373

dynamic= "auto"으로 설정했을 경우 동적인 페이지로 설정

해결됨

한 입 크기로 잘라먹는 Next.js

제목 그대로 export const dynamic = "auto"; 로 설정을 해도 해당 페이지가 정적인 페이지임에도 동적인 페이지로 빌드되는데 이게 맞을까요?

  • react
  • typescript
  • next.js
어차피 마늘 댓글 3 좋아요 0 조회수 234

30강 질문

미해결

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

repository를 user를 다룰때는 repository라는 패키지를 따로 만들어서 했는데, 지금 강의의 book에 관한 repositorty를 따로 만들지 않고 인터페이스만 객체와 같은 패키지에 만들어서 extends로 jpa를 받기 때문에 따로 만들 필요가 없어서 이렇게 만든거라고 이해 했는데 맞게 이해한걸까요? 즉, jpa를 익스텐즈한 인테페이스 덕분에 따로 sql문법을 작성하지 않았다는 말이 맞을까요?> 추가로 왜 객체가 있는 패키지에 인터페이스를 만드는 이유가 띠로 있나요?

  • java
  • spring
  • aws
  • mysql
  • spring-boot
  • jpa
성장하자 댓글 1 좋아요 0 조회수 101

인기 태그

인프런 TOP Writers

주간 인기글