묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
- 
      
        
    미해결웹 애니메이션의 새로운 표준, Web Animations API
리액트에서 scroll-timeline.js 불러오는 법
현재 리액트 프로젝트에 web animations api를 도입하려고 하는데요. 라이브러리는 react-web-animation을 쓰고 있습니다. 그런데 강의에서 사용한 scroll-timeline.js를 그대로 가져와서 import 하였더니 이러한 에러가 발생합니다.어떻게 에러를 해결할 수 있을 까요?
 - 
      
        
    해결됨[코드캠프] 시작은 프리캠프
회원가입 과제 질문입니다!
박스안의 텍스트 들의 위치조정이 어렵습니다.가입하기 버튼을 인풋버튼으로 설정했는데 "가입하기" 문자가 안보입니다. 피그마에 vector라고 표현되는 밑줄들이 표현이 이상하게 됩니다.답변 부탁드리겠습니다 ㅜㅜ 계속 머리 굴려봐도 잘 모르겠어요 ㅜㅜ
 - 
      
        
    미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
변수 Question에 products안에 모든 price들을 볼려면 어떤코드작성해야할까요???
변수 Question에 products안에 모든 price들을 볼려면 어떤코드작성해야할까요???
 - 
      
        
    미해결인터랙티브 웹 개발 제대로 시작하기
left:-400vw 가 아닌 translateZ(100vw); 을 입력하신 이유가 궁금합니다.
벽의 위치를 지정하면서 left:-400vw 가 아닌 translateZ(100vw); 을 입력하신 이유가 궁금합니다.
 - 
      
        
    미해결[웹 개발 풀스택 코스] HTML&CSS 기초
비주얼스튜디오코드 html snippets 설치 관련
기존 노트북에서 강의를 듣다가 맥북을 사용하게 되어 맥북으로 넘어와 강의 환경을 구축하고자 비주얼스튜디오코드를 설치하고 2강에서 차례로 말씀해주신 응용 프로그램을 설치하는데 html snippets는 말씀하신 개발자(geyao)의 프로그램이 보이지도 않고 설치가 안되어 강의 진행이 어렵습니다ㅜㅜ 혹시 비슷한 프로그램은 없을까요??
 - 
      
        
    미해결실전! 웹사이트제작! Step by Step! ('크루알라모드'_반응형웹 제작)
수업자료를 다운받으면 오류가 납니다,,ㅠㅠ
수업자료 다운받으면 이렇게 뜨면서 압축해제도 되지않습니다,, gygy0604@naver.com 으로 자료파일 보내주시면 감사드리겠습니다.
 - 
      
        
    미해결처음 만난 리액트(React)
미니 프로제트에서 map의 요소를 왜 찾지 못하는지 모르겠습니다
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.안녕하세요 미니 블로그 실습을 진행하던 중 위와 같은 오류를 발견하였습니다. commentList 파일의 map함수를 보았는데, 분명 배열이여서 map함수가 실행이 되어야 하는데 찾이 못하더라구요 import React from "react"; import styled from "styled-components"; import CommentListItem from "./CommentListItem"; const Wrapper = styled.div` display: flex; flex-direction: column; align-item: flex-start; justify-content: center; & > * { :not(:last-child){ margin-bottom: 16px; } } `; function CommentList(props){ const { comments } = props; return ( <Wrapper> {comments.map((comment, index) => { return <CommentListItem key={comment.id} comment= {comment}/> })} </Wrapper> ) } export default CommentList;혹시 힌트를 알 수 있을까요?
 - 
      
        
    해결됨처음 만난 리액트(React)
변경된 input 값이 텍스트로 보이지 않습니다.
개발자 도구로 보면 섭씨에 값 입력 시 화씨 input에도 값이 담기고 변하는데 텍스트는 보이지 않습니다...찾아보니 <input value="{props.temperature}"> 대신 <input defaultValue="{props.temperature}"> 를 쓰면 된대서 defaultValue를 쓰면 텍스트가 잘 나옵니다...아래 사진은 <input defaultValue={props.temperature}>으로 수정했을 때 입니다. 왜 <input value=""> 대신 <input defaultValue="">를 사용해야 정상적으로 나오는지 궁금합니다. TemperatureInput.jsxconst scaleNames = { c: "섭씨", f: "화씨", }; function TemperatureInput(props) { const handleChange = (event) => { props.onTemperatureChange(event.target.value); }; return ( <fieldset> <legend>온도를 입력해주세요(단위: {scaleNames[props.scale]})</legend> <input vaule={props.temperature} onChange={handleChange} /> </fieldset> ); } export default TemperatureInput; Calculator.jsximport React, { useState } from "react"; import TemperatureInput from "./TemperatureInput"; function BoilingVerdict(props) { //물 끓음 감지 if (props.celsius >= 100) { return <p>물이 끓습니다.</p>; } return <p>물이 끓지 않습니다.</p>; } function toCelsius(fahrenheit) { //화씨 계산 함수 return ((fahrenheit - 32) * 5) / 9; } function toFahrenheit(celsius) { //섭씨 계산 함수 return (celsius * 9) / 5 + 32; } function tryConvert(temperature, convert) { const input = parseFloat(temperature); if (Number.isNaN(input)) { return ""; } const output = convert(input); //섭씨 or 화씨로 변환 const rounded = Math.round(output * 1000) / 1000; return rounded.toString(); } function Calculator(props) { const [temperature, setTemperature] = useState(""); const [scale, setScale] = useState("c"); const handleCelsiusChange = (temperature) => { setTemperature(temperature); setScale("c"); }; const handleFahrenheitChange = (temperature) => { setTemperature(temperature); setScale("f"); }; const celsius = scale === "f" ? tryConvert(temperature, toCelsius) : temperature; const fahrenheit = scale === "c" ? tryConvert(temperature, toFahrenheit) : temperature; return ( <div> <TemperatureInput scale="c" temperature={celsius} onTemperatureChange={handleCelsiusChange} /> <TemperatureInput scale="f" temperature={fahrenheit} onTemperatureChange={handleFahrenheitChange} /> <BoilingVerdict celsius={parseFloat(celsius)} /> </div> ); } export default Calculator;
 - 
      
        
    미해결코알못에서 웹서비스 런칭까지 : 2021 제주 코딩 베이스캠프(Django)
css float 이용하기 부분에서 :after 적용이 안됩니다
visual studio code를 사용하고 있습니다코드는 똑같이 사용했으나 :after를 사용해도 코드가 적용이 되지않습니다 자동완성을 사용해서 보니 ::after의 기능은 있어도 :after의 기능이 없어 ::after도 사용해봤지만 적용이 안됩니다 ㅜ visual studio code에서는 지원이 안되는 걸까요 아니면 저의 문제일까요
 - 
      
        
    미해결[2025년 출제기준] 웹디자인기능사 실기시험 완벽 가이드
D유형 숏컷부분 정렬문의합니다
위사진은 강의에쓰인 사진이고 밑에사진은 제가만드는곳인데 숏컷부분이 강의사진처럼 길게 오른쪽까지 안퍼지고 저렇게밖에 안되는데 어떻케 해야지 끝과끝 중앙으로 보기좋게 설정하나요 ?
 - 
      
        
    해결됨[코드캠프] 시작은 프리캠프
선생님 피그마 질문입니다.
저는 이렇게 강의화면처럼code부분이 뜨질 않는데 어떻게 하면 나오게 할 수 있나요>?
 - 
      
        
    해결됨[코드캠프] 시작은 프리캠프
23분29초 질문있습니다!
body에서 컨텐트박스는 1 보더박스는 3으로 설정했는데, head의 style 안에 박스사이징 하는 부분을 건들였을 때 왜 박스2의 크기가 박스1의 크기를 따라가는 건가요?
 - 
      
        
    해결됨[코드캠프] 시작은 프리캠프
14분 15초경 질문있습니다.
rel="stylesheet"에서 스타일시트는 뭐를 의미 하나요?자동완성도 안되던데 왜 패스워드 부분의 색을 바꾸는건지 궁금합니다.
 - 
      
        
    미해결초보자를 위한 Sass 기초 강의 & 자몽톡 클론코딩
브라우저별 호환성 접두어
저는 6분 50초대 보면 선생님께서 브라우저별 호환성까지 고려해서 접두어까지 저절로 붙은 스타일이 알아서 완성 됐다고 하시는데 저는 이렇게만 뜨는데 왜그런걸까요?.one { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: orange; } .two { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: orange; }/*# sourceMappingURL=main.css.map */
 - 
      
        
    미해결비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
Axios 맛집 목록 API 데이터 요청 에러
이런게 뜨는데,,, 백 작업한쪽 nodemon 해서 서버 켰는데 왜 이런 에러가 뜰까요??? 이 전 까지는 문제 없었는데 이유를 알 수 있을까요?
 - 
      
        
    해결됨[코드캠프] 시작은 프리캠프
html 타이틀부분 18분30초
<title>Jimin world</title>이라고 하니까 정의되지 않았다고 뜨던데 이유가 뭔가용?
 - 
      
        
    해결됨따라하며 배우는 HTML, CSS
nth-child(2n+1)에 대해 궁금해요
nth child는 몇 번째 자식 요소를 선택할 것 인지는 이해했습니다만 질문이 있습니다.Q1. nth-child(2n+1)은 왜 홀수 선택이 되는 건가요?nth-child(2n+1)이 홀수가 되는 이유를 좀 더 풀어서 설명해주시면 좋겠습니다!Q2. nth-chlid(2)와 nth-child(2n)의 차이가 궁금해요.nth-child(5)가 5번째부터 선택되는 거라면 nth-child(5n)이런식으로도 표현할 수 있나요? 이 경우 5의 배수를 선택하는 건가요?괄호 안에 들어가는 부분이 뭔지 좀 더 설명해주심 좋겠습니다!!
 - 
      
        
    미해결비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
MySql 8버전
커뮤니티에 있는 my sql 8버전 명령어를 사용했는데이렇게만 뜨는데 어떻게 하면 될까요?? ㅠ그리고 aws에서 18버전이 없어서 20버전으로 했는데 20버전이 혹시 mysql 8버전만 지원하는지 궁금합니다.
 - 
      
        
    미해결Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
summernote를 적용하고 이미지를 업로그하면 모바일에서 볼때는 이미지가 크게 나오는데 어떻게 해야 되나요?
안녕하세요.섬머노트 적용하는 방법을 알려주셔서 게시판을 만들었는데요. 컴퓨터로 볼때는 이미지가 화면에 꽉 차게 나오던데요. 모바일로 게시판에 접속하면 이미지파일이 엄청 크게 나오더라고요.이미지 크기가 변경이 안되고 그대로인것같은데요.이미지도 반응형으로 만들려면 어떻게 해야 되나요?검색하면 이미지를 반응형으로 만드는 방법이 있긴한데요. 섬머노트에는 어떻게 해야될지 모르겠더라고요. 화면이 작아지면 이미지 크기고 작아지게 할려면 어떻게 해야 되나요?
 - 
      
        
    해결됨웹 애니메이션을 위한 GSAP 가이드 Part.02
안녕하세요 수업자료를 다운받았는데 중간중간 파일이 없어요 ㅠㅠ
영상 우측상단에 수업자료를 다운받고 열어보니 중간중간 없는 파일들이 있습니다 ㅠㅠ 저만 그런건지..