inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

묻고 답해요

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

https://cataas.com/undefined 로 나오는데 왜그런건가요?

미해결

만들면서 배우는 리액트 : 기초

https://cataas.com/undefined 로 나오는데 왜그런건가요? 28강 수강하고 있는데 fetch를 사용하려고 하는데 이미지가 안나와요 ㅠㅠㅠ

  • javascript
  • react
Park A Reum 댓글 4 좋아요 1 조회수 633

float과 높이 값 질문드립니다

해결됨

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

자식요소에 float값이 있으면 부모요소는 높이 값을 잃어버릴때, float : left 와 right 둘 다 있을 때 높이를 잃어버리는건가요? 자식요소가 여러 개 있으면 여러 개 모두 float 있을 때 잃어버리는거지요? 혹시 부모요소에 overflow:hidden을 해서 높이 값을 찾아주는 것에 원리가 있을까요?

  • HTML/CSS
  • jquery
d111 댓글 2 좋아요 1 조회수 317

첫화면 버튼이 css 적용이 안됩니다..

미해결

<M.B.I.T> 테스트 페이지 만들기! with Django

.buttons button { width: 300px; height: 50px; padding: 5px; border-style: none; border-radius: 10px; font-family: "NEXON Lv1 Gothic OTF"; font-size: 20px; font-weight: bold; cursor: pointer; background-color: #fff; color: #7F47DD; margin-bottom: 20px; } 로 코드 올려주신 것 그대로 했는데도 아래 사진처럼 기본 버튼으로 됩니다..다른 css 디자인은 잘 적용이 됩니다.뭐가 문제일까요?

  • HTML/CSS
  • javascript
  • django
긴장한 낙지 댓글 1 좋아요 0 조회수 518

프롬프트 명령어 - 입력값과 동일한 언어로 받으려면 어떻게 작성할까요?

해결됨

React + GPT API로 AI회고록 서비스 개발 (원데이 클래스)

좋은 내용 감사합니다. 프롬프트 내용중에 "Translate Into Korean~" 이라는 내용으로 답변을 한글로 받게 됩니다. 혹시 [events] 밑에 오는 사용자 입력값과 동일한 언어로 결과를 받고 싶다면 어떻게 작성하면 될까요? 강의 내용을 기준으로 다국어 서비스를 만들려고 하는데, 영어가 짧아서 질문 드려요

  • HTML/CSS
  • javascript
  • react
  • node.js
  • chatgpt
도옥현 댓글 2 좋아요 1 조회수 477

파일 절대경로 설정

미해결

pnpm, vite를 사용하여 리액트 프로젝트 생성한 다음 tailwind 랑 typescript, shadcn/ui 를 설치하였는데요. shadcn/ui를 쓰려고 버튼 컴포넌트를 임포트 하는데 파일경로가 계속 잘못되었다고 합니다. 다 확인했는데 도저히 어디가 문제인지 몰라서 여쭤 봅니다. 이런 오류가 뜨고요 tsconfig.json { "compilerOptions": { "target": "ES2020", "useDefineForClassFields": true, "lib": ["ES2020", "DOM", "DOM.Iterable"], "module": "ESNext", "skipLibCheck": true, "baseUrl": ".", "paths": { "@/*": ["./*"] }, /* Bundler mode */ "moduleResolution": "bundler", "allowImportingTsExtensions": true, "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, "jsx": "react-jsx", /* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, "include": ["src"], "references": [{ "path": "./tsconfig.node.json" }] } vite.config.ts import path from "path" import { defineConfig } from "vite" import react from "@vitejs/plugin-react" // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], resolve: { alias: { "@": path.resolve(__dirname, "./src"), }, }, }) App.tsx import './App.css' import { Button } from "@/components/ui/button" function App() { return ( <> <div className="ml-4 mt-8 text-3xl font-bold underline"> Hello world! </div> <div> <Button>Click me</Button> </div> </> ) } export default App 입니다. 현재 @이게 적용이 안되고 있는 것 같습니다 근데 파일 누르면 올바르게 해당하는 파일로 이동이 잘됩니다. 어디가 문제일까요 ?

  • react
wodus604 댓글 1 좋아요 0 조회수 709

강의를 듣고있는데

미해결

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

강의 들을 때 나오는 포트폴리오 자료들은 다운 받을 수 있을까요?? 필기하면서 듣고 싶어서요!

  • HTML/CSS
  • jquery
SH 댓글 2 좋아요 1 조회수 312

CH02_ 가상환경 활성화 안되는 이유

미해결

초보자를 위한 ChatGPT API 활용법 - API 기본 문법부터 12가지 프로그램 제작 배포까지

가상환경 활성화 코드를 입력해도 앞에 (ch02_env)가 안나오는데 이래도 괜찮은건가요?

  • python
  • 챗봇
  • streamlit
  • openai
  • chatgpt
pcokgo 댓글 3 좋아요 1 조회수 925

rotate, skewX, translate 값 찾기 질문드립니다..

미해결

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

.app-ui { /* border: 1px solid red; */ width: 340px; height: 640px; transform: rotate(-30deg) skewX(20deg); /* transform: skewX(); */ position: relative; } .app-ui:hover img:nth-child(1){ transform: translate(40px, -40px); } .app-ui 요소를 rotate (-30deg) skewX(20deg) 해서 .app-ui:hover 밑에 이미지를 translate(40px, -40px) 한 것 같은데 이 때 숫자는 어떻게 40이라는 값이 나온걸까요? 수직으로 올리는 값을 어떻게 정하는 걸까요? 10 20 30 40 다 넣어보면서 찾는건가요..? ㅠㅠ

  • HTML/CSS
  • jquery
d111 댓글 2 좋아요 1 조회수 284

화면 폭이 좁아졌을 때 질문입니다..

미해결

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

분리 되면 밑에 있는 요소에 가려서 글이 안보이는데 밑에 있는 요소 밑으로 밀 수 있는 방법이 있을까요? <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/02.hover-separate(04).css"> </head> <body> <div class="items"> <div class="item"> <div class="front"> <img src="images/space-01.png" alt=""> <h2>Mars</h2> </div> <div class="back"> <p>화성은 태양계의 네 번째 행성이다. 4개의 지구형 행성 중 하나다. 동양권에서는 불을 뜻하는 화(火)를 써서 화성이라 부르고 로마 신화의 전쟁의 신 마르스의 이름을 따 Mars라 부른다.</p> <a href="#none">Read More</a> </div> </div> <div class="item"> <div class="front"> <img src="images/space-02.png" alt=""> <h2>Jupiter</h2> </div> <div class="back"> <p>목성은 태양계의 다섯번째 행성이자 가장 큰 행성이다. 태양의 질량의 천분의 일배에 달하는 거대행성으로, 태양계에 있는 다른 모든 행성들을 합한 질량의 약 2.5배에 이른다.</p> <a href="#none">Read More</a> </div> </div> <div class="item"> <div class="front"> <img src="images/space-03.png" alt=""> <h2>Saturnus</h2> </div> <div class="back"> <p>토성은 태양으로부터 여섯 번째에 있는 태양계의 행성으로, 진성(鎭星)으로도 불렀다. 토성은 태양계 내의 행성 중 목성에 이어 두 번째로 크며, 지름은 약 12만 킬로미터이다.</p> <a href="#none">Read More</a> </div> </div> </div> </body> </html> @media (max-width:768px){ .item{ display: block; } } @import url('https://fonts.googleapis.com/css?family=Raleway&display=swap'); body{ font-family: 'Raleway', sans-serif; color: #222; line-height: 1.5em; font-weight: 300; margin: 0; background-color: #222; color: #fff; font-size: 15px; } a{ color: #fff; text-decoration: none; } .items{ text-align: center; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .item{ /* border: 1px solid #fff; */ width: 300px; height: 220px; display: inline-block; position: relative; margin: 10px; } .front, .back{ position: absolute; width: 100%; transition: 0.5s; } .front{ /* position: absolute; */ background-color: #333; text-align: center; height: inherit; z-index: 1; /* width: 100%; */ top: 0; } .front img{ margin-top: 8px; /* animation: ani 1s linear infinite; */ } .item:hover .front img{ animation: ani 1s linear infinite; } .front h2{ margin-top: 0; } .back { /* position: absolute; */ background-color: #fff; color: #000; height: inherit; text-align: center; padding: 20px; box-sizing: border-box; /* width: 100%; */ top: 0; opacity: 0; } .item:hover .back{ opacity: 1; } .back p{} .back a{ color: #fff; background-color: yellowgreen; padding: 5px 10px; border-radius: 20px; /* box-shadow: #222222c1 0.7px 0.7px 0.7px;/ */ margin-top: 2px; display: inline-block; } .back a:hover{ background-color: #000; } .item:hover .front{ top: -50%; } .item:hover .back{ top: 50%; } @keyframes ani{ 0% {transform: scale(1);} 50% {transform: scale(1.1);} 100% {transform: scale(1);} }

  • HTML/CSS
  • jquery
d111 댓글 2 좋아요 1 조회수 201

주피터 익스텐션 다운로드 문제 질문입니다!

미해결

공공데이터로 파이썬 데이터 분석 시작하기

Jupyter command jupyter-contrib not found. 지금 이 오류가 떠서 설치가 안되고 있는데요. 어떻게 해결해야 할까요?? 제가 봤을땐, pip install jupyter_contrib_nbextensions 이 부분은 실행이 되는데 jupyter contrib nbextension 이 부분에서 오류가 생기는 것 같습니다. ㅠㅠ

  • python
  • pandas
  • numpy
1whstudy 댓글 1 좋아요 0 조회수 893

스케줄링과 관련된 질문입니다.

미해결

Airflow 마스터 클래스

섹션3, 첫번째 강의에서 스케줄에 관한 질문입니다. 강의에서, start_date = 2023.1.1 schedule = "30 6 * * * " next_run = 2023 03 18 6:30 그리고 현재 날짜는 2023 03 19 인것으로 봤는데, next_run이 현재날짜보다 뒤에 있으니 pause -> unpause 를 하게되면 자동실행이 안되어야 하는거 아닌가요? 강의에서는 자동으로 실행되는것으로 봐서요. 감사합니다.

  • python
  • 데이터-엔지니어링
  • airflow
Hyeonghwan Kwon 댓글 1 좋아요 1 조회수 268

4.4 클래스의 정의와 호출 parr2 강의 중 attribute 초기화 부분 질문

해결됨

문과생도, 비전공자도, 누구나 배울 수 있는 파이썬(Python)!

클래스 정의하고 호출하면 42번 줄에 player1에 해당하는 height와 weight의 값이 둘 다 나와야 하는데 저는 한가지 값만 출력이 됩니다. weight를 지우고 height 값만 쓰면 height값이 출력되고 둘다 쓰면 height값은 안나오고 weight값만 출력이 되는데 왜 이런 걸까요?

  • python
ㅊㅌㅎ 댓글 1 좋아요 1 조회수 185

WebGL 1 지원 중단에 대해

해결됨

떠먹는 Three.js

영상 : [ 손쉬운 조작 OrbitControls] 에서 three의 경로 설정 중 THREE.WebGLRenderer: WebGL 1 support was deprecated in r153 and will be removed in r163 WebGL 1 지원은 r153에서 사용 중단되었으며 r163에서 제거될 예정입니다. 라는 메세지가 나왔습니다. 질문 : 이게 나중에는 오류가 날 수 있다는 뜻인가요? 맞다면 어떻게 대비를 해야 하는지 궁금합니다.

  • HTML/CSS
  • javascript
  • three.js
South 댓글 2 좋아요 0 조회수 622

제품을 배열로 다시 재정리 해줄때 split 후에 map을 하는 이유

미해결

따라하며 배우는 노드, 리액트 시리즈 - 쇼핑몰 사이트 만들기[전체 리뉴얼]

따라하며-배우는-노드-리액트-쇼핑몰 > 쇼핑 카트 페이지 데이터 가져오기 강의를 수강중에 있습니다. 17:30 부근에 제품을 배열로 다시 재정리 해주는 걸 설명해주고 계시는데 split 후에 map을 하는 이유가 궁금합니다. 값을 map 처리하기 전후로 찍어보니 값이 동일하게 나오는데 map 처리를 해주는 이유가 따로 있나 싶어서 여쭤봅니다.

  • react
  • redux
  • node.js
  • 웹앱
  • mongodb
MJ 댓글 2 좋아요 0 조회수 282

import에 관해서 질문드립니다

해결됨

[React 1부] 만들고 비교하며 학습하는 React

안녕하세요 강의 정말 잘 듣고 있습니다. 해당 강의를 듣는중 궁금한점이 생겨서 질문 드립니다. 제가 원래 java/spring을 공부하다가 이번에 프론트 엔드쪽에 관심이 생겨서 React를 학습중인데 ide에서는 .js 파일을 Import할때 뒤에 왜 자동으로 .js가 안붙도록 되어있나요? 저는 강사님과 다른 ide를 사용중인데도 여기서도 .js가 자동으로 붙지 않습니다. import React from "react"; import Header from "./components/Header.js"; import KeywordList from "./components/KeywordList.js"; import SearchForm from "./components/SearchForm.js"; import SearchResult from "./components/SearchResult.js"; import Tabs, { TabType } from "./components/Tabs.js"; import store from "./Store.js"; 제가 추측한건데 React를 import 하는 경우에는 react 파일이 typeScript로 되어있고 나머지 경우는 전부 javaScript로 되어있습니다. 따라서 기본이 .ts로 설정 되어 있어서 javascript파일은 별로로 명시해줘야 찾을 수 있게 되어 있다고 생각이 듭니다. 별로 의미없는 질문이지만 궁금해서 질문 드립니다. 감사합니다.

  • react
  • mvc
이찬원 댓글 1 좋아요 1 조회수 287

codepen질문입니다.

해결됨

[코드캠프] 강력한 CSS

code팬에서 애니메이션 코드자료를 찾아볼 수 있다고 하셨는데 코드팬은 어떻게 이용하는건가요?회원가입도 해야하는건지 궁금합니다.

  • HTML/CSS
지 민 댓글 2 좋아요 0 조회수 329

클라이언트 컴포넌트 자식으로 서버 컴포넌트를 넣었을 때의 원리에 대해서 질문있습니다!

미해결

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

서버 컴포넌트가 프론트 서버에서 미리 렌더링되는 것으로 알고 있었습니다. 이것이 맞을까요?? 클라이언트 컴포넌트랑 서버 컴포넌트의 렌더링 방식을 찾아봤음에도 여전히 헷갈리는데 시간적 여유가 되신다면 쉽게 알려주실 수 있을까요?? 클라이언트 컴포넌트 사이에 서버 컴포넌트를 넣으면 렌더링 동작이 어떻게 수행되는지 궁금합니다. 강좌에서는 PostArticle이라는 클라이언트 컴포넌트의 자식으로 서버컴포넌트를 넣는데, 공식문서에서는 클라이언트 컴포넌트가 DOM Tree의 끝에 오도록 하는 것을 권장하는 것으로 알고 있었는데 제가 잘못 알고 있던 것이었을까요??

  • react
  • next.js
  • react-query
  • next-auth
  • msw
이종민 댓글 2 좋아요 1 조회수 1924

[Card 컴포넌트 만들기 강의] 코드질문 있습니다!

해결됨

처음 만난 리액트(React)

강의 너무 잘 보고 배우고 있습니다!! 감사합니다 🙂 카드를 한장이 아니라 여러 장이 나오게 만들고 싶어서 혼자 코드를 수정해봤는데요 key 값이 없어서 오류가 난다고 하는데요 1-1.이 상태에서는 어떻게 key값을 넣어줘야 할까요? 1-2. 다른 방법은 없을까요? import Card from "./Card"; const names = [ { id: 1, name: "학생 1", comment: "리액트 공부중입니다" }, { id:2, name: "학생 2", comment: "리액트 공부중임니댜" } ] function ProfileCard(props) { <div> {names.map((name) => { return ( <Card title={name.name} backgroundColor="#B57EDC" comment={name.comment} /> ) })}; </div> } export default ProfileCard;

  • HTML/CSS
  • javascript
  • react
hws9701 댓글 1 좋아요 2 조회수 664

장고 개발 준비.

미해결

Do It! 장고+부트스트랩: 파이썬 웹개발의 정석

안녕하세요 강사님, 섹션 4 장고 개발 준비에서 .idea파일을 ignore에 적으라고 하셨는데, 제 맥북에는 .idea파일이 없는데 그럼 그냥 무시하고 진행하면 되는 걸까요? (이전단계는 강사님이 하신대로 똑같이 따라 했습니다.)

  • HTML/CSS
  • javascript
  • python
  • django
  • bootstrap
  • aws
  • docker
  • tdd
최기연 댓글 2 좋아요 0 조회수 427

인기 태그

인프런 TOP Writers

주간 인기글