inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

ReactDOM.render .createRoot 질문 드립니다.

미해결

처음 만난 리액트(React)

ReactDOM.render( <React.StrictMode> <CommentList /> </React.StrictMode>, document.getElementById('root') ) 위 내용대로 npm start해서 띄우면 React 18버전부터는 React.createRoot를 사용하라고 나오네요. .render대신에 .createRoot로 사용하면 될까여? 만약 .createRoot로 사용시 예제 간단히 알려주시면 감사하겠습니다.

  • HTML/CSS
  • javascript
  • react
Minkoo Lee 댓글 2 좋아요 1 조회수 569

강의를 보고 똑같이 코드를 쳤는데 a태그가 밑으로 떨어집니다 ㅠㅠ

미해결

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

■ 공지사항,갤러리가 별도로 구성되어있는 강의를 듣고있는데 news 클래스 아래로 a태그가 떨어집니다 ㅠㅠ 혹시 잘못된 부분이 있는걸까요? <body> <section class="items"> <article class="news"> <div class="tab-inner"> <div class="btn"> <span>공지사항</span> </div> <div class="tab"> <a href="#none"> 문자발송서비스 <b>2024.03.06</b> </a> <a href="#none">문자발송서비스 <b>2024.03.06</b> </a> <a href="#none">문자발송서비스 <b>2024.03.06</b> </a> <a href="#none">문자발송서비스 <b>2024.03.06</b> </a> <a href="#none">문자발송서비스 <b>2024.03.06</b> </a> </div> </div> </article> <article class="gallery">갤러리</article> <article class="now">바로가기</article> </section> </body> <css> * { padding: 0; margin: 0; position: relative;} a { color: inherit; text-decoration: none; display: inline-block;} ul,li,ol { list-style: none;} /*와이어프레임정렬*/ .items { border: 3px solid blue; max-width: 1200px; margin: 0 auto; display: flex; } .items div { height: 200px; } .news { width: 350px; background-color: lightblue;} .news .tab-inner { border: 5px solid salmon; } .news .tab a { border: 3px solid slateblue; } .gallery { width: 500px; background-color: coral;} .now { width: 350px; background-color: lightseagreen;} /*tab content*/ -출력화면-

  • HTML/CSS
  • jquery
  • 웹-디자인
dusal 댓글 1 좋아요 1 조회수 211

반복문 문제3 369게임

미해결

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

1부터 50까지 369결과 프린트인데 왜 숫자 2인데 박수 짝치죠?

  • HTML/CSS
  • javascript
­김연성 댓글 1 좋아요 0 조회수 494

강의 순서 질문드립니다.

미해결

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

선생님 안녕하세요. 수강생입니다.수업은 섹션1부터 차근 차근 따라가면 될까요? 안배우고, 몰랐던 부분들이 등장해서 인강을 어디서부터 어떻게 들으면 될지 여쭈어 봅니다.(비전공자라 코딩 지식이 아예 없습니다.)

  • HTML/CSS
  • jquery
  • 웹-디자인
강은지 댓글 1 좋아요 1 조회수 262

display flex 질문,,

미해결

모바일 웹 퍼블리싱 포트폴리오 with Figma

안녕하세요 ! gnb부분 하다가 헷갈리는게 있어서요 .. gnb 부분엔 flex를 줘서 가로배치 1/5한 건 이해했는데, .gnb a 위아래 여백이 남았어서 그 여백을 없애려면 .gnb a에 display : flex를 주어야한다고 하셨는데 왜 flex를 주면 위아래 여백이 사라지고 딱 맞게 배치가 되는건지 이해가 잘 안가서요 ㅠ..! 말로 설명이 가능하실까 모르겠지만 일단 남겨봅니다!

  • HTML/CSS
  • jquery
  • 모바일-디자인
  • figma
  • 포트폴리오
예림 댓글 1 좋아요 1 조회수 218

다시 질문 드립니다 ㅠㅠ CSS 키프레임 애니메이션 활용한 실전 예제 제작 01(원형 크기 변경 로딩 애니메이션)

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>도형 로딩 애니메이션</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="loading"> <span></span> <span></span> <span></span> </div> </body> </html> /* Google Web Font */ @import url('http://fonts.googleapis.com/css?family=Raleway&display=swap'); body { font-family: 'Raleway', sans-serif; line-height: 1.5em; margin: 0; font-weight: 300; display: inline; justify-content: center; align-items: center; height: 100vh; } a { text-decoration: none; } .loading {} .loading span { display: inline-block; width: 20px; height: 20px; background-color: gray; border-radius: 50%; animation: loading 1s linear infinite; } .loading span:nth-child(1) { animation-duration: 0s; background-color:crimson; } .loading span:nth-child(2) { animation-duration: 0.2s; background-color:dodgerblue; } .loading span:nth-child(3) { animation-duration: 0.4s; background-color:royalblue; } @keyframes loading { 0% { opacity: 0; transform: scale(0.5); } 50% { opacity: 1; transform: scale(0.5); } 100% { opacity: 0; transform: scale(0.5); } } 이렇게 작성했는데 go live 화면에선 이렇게 뜨고 애니메이션이 안나와요.. ㅠㅠ 뭐가 문제일까요??? 몇주동안 안되요..

  • HTML/CSS
  • jquery
SH 댓글 1 좋아요 0 조회수 362

도형 로딩 애니메이션 질문입니다

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>도형 로딩 애니메이션</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="loading"> <span></span> <span></span> <span></span> </div> </body> </html> /* Google Web Font */ @import url('http://fonts.googleapis.com/css?family=Raleway&display=swap'); body { font-family: 'Raleway', sans-serif; line-height: 1.5em; margin: 0; font-weight: 300; display: flex; justify-content: center; align-items: center; height: 100vh; } a { text-decoration: none; } .loading {} .loading span { display: inline-block; width: 20px; height: 20px; background-color: gray; } .loading span:nth-child(1) {} .loading span:nth-child(2) {} .loading span:nth-child(3) {} 지금 이 상태인데 화면에 아무것도 나타나지 않습니다. 이렇게 뜨는데 뭐가 문제일까요?

  • HTML/CSS
SH 댓글 3 좋아요 1 조회수 256

도형 로딩 애니메이션 질문입니다

미해결

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

이렇게 뜨는데 뭐가 문제일까요.. go live 화면에서도 안보이고 문제가 뭔지 모르겠어요 ㅠ

  • HTML/CSS
  • jquery
댓글 1 좋아요 1 조회수 175

수업 소스 다운로드 어디서 받을수 있나요?

해결됨

순수 html/css/js만을 활용한 반응형웹 제작[실전편] 부트캠프

영상 수업 소스 다운로드는 어디서 받을수 있나요? 영상 수업 동일하게 코딩해도 오류가 나거나 정상적으로 출력되지 않아..

  • HTML/CSS
  • 인터랙티브-웹
  • 반응형-웹
동주 댓글 1 좋아요 1 조회수 431

현재 강의 Express 프레임워크 사용하기 를 듣고 있는데요

해결됨

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

이전 강의인 그랩 마켓 서버 구축하기 에서는 node_modules가 없었는데 이번 강의부터는 생성 되어있습니다. 생성 과정을 건너뛰셨다면 어디서 확인할 수 있는지는 강의에 포함시켜주시는게 맞는거 같습니다.

  • HTML/CSS
  • javascript
  • react
  • node.js
  • react-native
  • 머신러닝
  • express
  • tensorflow
최지혁 댓글 2 좋아요 2 조회수 323

props에 대해 궁금한 점이 있습니다.

미해결

처음 만난 리액트(React)

우선 좋은 강의를 무료로 제공해 주신다는 점에 매우 감사드립니다 🙂 다름이 아니라 props에 대해 궁금한 점이 있어서 글 남깁니다. function SampleComponent(props) { return ( <div> <div>{props.name}</div> <div>{props.age}</div> </div> ); } 만약 위와 같이 코드를 작성했다고 하면, 이 컴포넌트를 사용할 때 아래와 같이 사용할 것으로 예상됩니다. root.render( <React.StrictMode> <SampleComponent name={'kim'} age={12} /> </React.StrictMode> ); 근데 만약 코드가 매우 길어지고, props로 넘겨야 하는 것들이 많아진다고 가정해 보겠습니다. 예를 들어 props.name props.age props.university props.profilePhoto props.grade etc... 이런 경우에는 도대체 props로 어떤 것들을 넘겨 주어야 하는지 굉장이 헷갈리는 상황이 발생할 것 같은데 이를 해결하기 위한 방법이 있을지 궁금합니다. ++ 제가 찾아본 바로는 아래와 같이 코드를 작성하면 된다고 합니다. function SampleComponent({name, age}) { return ( <div> <div>{name}</div> <div>{age}</div> </div> ); } 그런데 이 방식을 사용하게 되면 children은 어떻게 넘겨 줄 수 있는지가 궁금합니다. 그냥 아래와 같이 처리하면 되는 것일까요? function SampleComponent({children, name, age}) { return ( <div> <div>{name}</div> <div>{age}</div> <div>{children}</div> </div> ); } 또한, 이 방식이 맞는 방식이라면, 굳이 아래 코드와 같이 props를 사용하시는 이유가 무엇인지도 궁금합니다. function SampleComponent(props) { return ( <div> <div>{props.name}</div> <div>{props.age}</div> </div> ); }

  • HTML/CSS
  • javascript
  • react
David Heo 댓글 1 좋아요 1 조회수 405

inherit와 100%의 차이가 궁금합니다.

해결됨

중상급 퍼블리싱을 위한 CSS3의 모든 것

안녕하세요 선생님, ( hover로 만드는 버튼 디자인, 드롭다운 네비게이션 & 컨텐츠) 를 듣다가 궁금한 점이 생겨 질문 드립니다. 10:32 분에 보여지는 .dropdown { width: 150px'} .dropdown-btn { width:inherit;} 14:50 분 .tour-item { width:400px;} .tour-photo img { width:100%;} 둘다 부모 자식관계라 부모의 크기를 따라가는 것도 이해가 되었는데 inherit 과 100% 는 그럼 같은 기능을 가진 코드일까요? 두 가지 방식 모두 사용할 수 있다는 것을 소개해주신건지, 아님 특정 상황에 각각의 사용법이 있는지 궁금합니다.

  • HTML/CSS
tnrud2668 댓글 2 좋아요 1 조회수 364

리액트 연동 오류

미해결

처음 만난 리액트(React)

안녕하세요. 실습 따라하는데 리액트 연동이 안된건지 버튼이 페이지에 안뜨는데 코드를 비교해도 뭐가 문제인지 모르겠어요

  • HTML/CSS
  • javascript
  • react
b_b28 댓글 1 좋아요 1 조회수 837

asyncio.run() cannot be called from a running event loop 에러 질문 드립니다

미해결

실습으로 끝장내는 웹 크롤링과 웹 페이지 자동화 & 실전 활용

안녕하세요 선생님 강의 듣고 있는 이광희라고 합니다. 올려주신 강의로 텔레그램 자체 API를 써서 메세지 전송하기까진 했는데요 이미지를 전송하려고 보니 거의 모든 블로그, 유튜브 설명들이 파이썬 텔레그램봇으로 설명 하더라구요 근데 이 봇이 v20으로 바뀌면서 비동기 프로그래밍(?)이 된거 같습니다. 설명하고 있는 코드들이 다 과거 버전 코드들이네요. 그래서 위키에 직접 가서 코드를 보고 있는데요 import asyncio import telegram async def main(): bot = telegram.Bot("TOKEN") async with bot: print(await bot.get_me()) if __name__ == '__main__': asyncio.run(main()) 그냥 위키에 나오는 간단한 코드인데도 RuntimeError: asyncio.run() cannot be called from a running event loop 이런 에러가 계속 뜹니다. async 부터 공부하려고 다른 유튜브를 찾아서 import asyncio async def main(): await asyncio.sleep(1) print('hello') asyncio.run(main()) 이런 간단한 코드를 입력해도 똑같은 오류가 뜨네요... 이벤트 메인 루프가 실행되고 있는 동안에 함수가 작동할수 없다 그런 내용인거 같은데 위키에 있는 그대로 따라해도 에러가 나니 비전공자 입장에서는 어떻게 해야 좋을지 모르겠네요. 경영학과 출신 직장인이 실무에서 쓰려고 파이썬을 배우고 있는데 물어볼곳이 여기밖에 없어 여쭤봅니다ㅠㅠ 좀 도와주세요 깃헙? 말고 국내 파이썬 qna있는 커뮤니티라도 알려주시면 가서 좀 물어보고 싶은데 그게 어디인지도 모르겠네요.

  • python
  • 웹-크롤링
  • selenium
  • beautifulsoup
Kwanghee Lee 댓글 4 좋아요 0 조회수 3996

The `punycode` module is deprecated

미해결

처음 만난 리액트(React)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 주소 따라 들어가면 왜 이렇게 되는지 잘 모르겠어요... ㅠㅠ

  • HTML/CSS
  • javascript
  • react
영이 댓글 2 좋아요 1 조회수 564

마지막 파트 기술적 준수 사항 관련 질문

미해결

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

■ 질문 남기실 때 꼭! 참고해주세요. btn 태그 안에 span 태그를 마지막에 a링크로 바꾸셨는데 별도로 구성하기 할 때도 동일하게 적용되는 사항일까요?

  • HTML/CSS
  • jquery
  • 웹-디자인
현빈 댓글 1 좋아요 2 조회수 162

livesurver가 작동이 안돼요.

미해결

조코딩의 코딩 기초와 웹 풀스택 개발

안녕하세요, 강의를 보던 중 궁금한게 있어서 문의 드립니다. 라이브서버를 다운받고 'open with live surver' 를 눌렀는데 크롬에서 영상처럼 연동이 안되네요. 인터넷 찾아보면서 세팅설정도 바꿔보고 했는데도 안되네요. 뭐가 문제인지 알려주실 수 있으신가요?

  • HTML/CSS
  • javascript
  • node.js
  • web-api
한승원 댓글 1 좋아요 0 조회수 375

결측값 채우지관련해서

해결됨

[퇴근후딴짓] 빅데이터 분석기사 실기 (작업형1,2,3)

안녕하십니까? 결측값 채우기 중 최빈값 관련해서,, m = X_train['workclass'].mode()[0] 여기서 mode()과 mode()[0]의 차이는 무엇인지요? 즉 [0]의 쓰임이 무엇인지? 다른 중앙값, 평균 등은 이런게 없는데 왜 최빈값만 이런게 뒤에 붙는지요?

  • python
  • 머신러닝
  • 빅데이터
  • pandas
  • 빅데이터분석기사
kccjjang 댓글 2 좋아요 0 조회수 255

강의 너무 잘 듣고있습니다. 섹션6번에서 질문이 있습니다.

미해결

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

안녕하세요. 좋은 강의 감사합니다. 센셕6번에서 스크롤트리거를 하셨잖아요. title를 fixed로 시키셨습니다. .fromTo('.worklist' ,{margin:'0 auto'} ,{margin:'100vh auto 0', duration:'1',ease: "power3.out"},0) 그런다 다시 올리면 버버벅 거리는 현상은 어쩔수 없는 현상일까요? margin-top가 올라가면 다시 0으로 돌아가면서 버벅거리는 현상같은데, 어쩔수 없는 현상인지 여쭤봅니다. 혹시몰라 사진 첨부드려요~ 회신 주시면 너무 감사드릴겠습니다. 항상 좋은 강의 많이 부탁드립니다.~

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

비쥬얼 스튜디오 코드 저장키

해결됨

[웹 개발 풀스택 코스] HTML&CSS 기초

HTML기본 구조 및 기본요소강의에서 5분 15초쯤부터 비쥬얼 스튜디오 코드 저장키가 ctrl+c라고 하는데 맞나요? ctrl+s가 아닌가요?

  • HTML/CSS
박주연 댓글 1 좋아요 0 조회수 702

인기 태그

인프런 TOP Writers

주간 인기글