inflearn logo
강의

Course
Instructor

Learning React A-Z by Following Along [Version 19 반영]

Creating a Row component for listing movies.

Row 컴포넌트 생성하기 base_url not defined

348

doubletip1680

3 asked

0

안녕하세요 선생님 Row 컴포넌트 생성하기에서
base_url 을 가져오지 못한다는 에러가 나오는데 어떤게 문제인건가요 ?
 
import React, { useEffect, useState } from 'react'
import axios from "../api/axios"

const Row = ({ title, fetchUrl, id, isLargeRow}) => {

const [movies, setMovies] = useState([])

useEffect(()=> {
fetchMovieData()
},[])

const fetchMovieData = async ()=> {
const request = await axios.get(fetchUrl)
setMovies(request.data.results)
}

return (
<section>
<h2>{title}</h2>
<div className="slider">
<div className="slider__arrow-left">
<span className="arrow">
{"<"}
</span>
</div>
<div id={id} className="row__posters" >
{movies.map((movie) =>(
<img
key={movie.id}
className={`row__poster ${isLargeRow && "row__posterLarge"}`}
src={`${BASE_URL}${isLargeRow ? movie.poster_path : movie.backdrop_path}`}
loading="lazy"
alt={movie.name}
/>
))}
</div>
<div className="slider__arrow-right">
<span className="arrow">
{">"}
</span>
</div>
</div>
</section>
)
}

export default Row

Next.js typescript react redux tdd

Answer 1

1

imuchgabis3999

코드 이렇게 바꿔보시겠어요?

src={`https://image.tmdb.org/t/p/original/${
                  isLargeRow ? movie.poster_path : movie.backdrop_path
                }`}

0

doubletip1680

감사합니다. 근데 base_url 문제는 해결이 되었는데,

movies를 맵 돌릴수 없다고 나오는데, 콘솔로그 다시 확인해보니 request의 data 가 "" 로 찍히더라고요, 혹시 어느 부분을 확인하면 될까요 ??

1

imuchgabis3999

혹시 axios.js랑 requests.js 올려주실수 있을까요?

추가로 Row 프롭스 잘 전달하셨나요?

<Row title="Trending Now" id="TN" fetchUrl={requests.fetchTrending} />

0

doubletip1680

props 전달할때 오타가 있어서 안나왔었어요. 오타 수정하니 잘 나옵니다.

도움 주셔서 감사합니다!

강의 소스 코드 압축 풀기 오류

0

70

1

런타임 에러 ㅠㅠ

0

84

1

강의대로 따라갔는데 에러보다 api키로 들어간 넷플릭스? 그런게 렌더링 되지 않습니다 ㅠ

0

100

1

안녕하세요 개발과 상관없는 질문입니다만

0

111

1

리액트 라우터 관련

0

101

1

react-beatiful-dnd에서 문제가 발생합니다.

0

103

1

react19에서는 react-beautiful-dnd가 설치되지 않습니다.

0

806

1

useEffect로 사용을 해도 되나요?

0

198

1

넷플릭스 오리지널 제외하고 슬라이드가 동작을 안합니다.

0

195

1

react 19의 useActionState가 더이상 isPending은 지원하지 않는 듯합니다

0

279

2

리액트 dockderfile 작성 시 COPY 질문

0

145

1

next.js에서부터는 react query 필요없는지

0

320

1

기능

0

193

1

오류가 안보여요

0

193

1

CSS

0

217

1

local storage

0

208

1

list컴포넌트 생성하기

0

223

1

검색어 입력 후 초기화하는 방법 궁금합니다!

0

331

1

Banner.css에 대해서

0

444

1

플러그인이 추천을 안해줍니다

0

320

1

마이너스버튼 테스트

0

279

2

리액트 서버 실행 오류

0

1156

2

오류메세지는 확인했는데 어떻게 고쳐야 할지 모르겠습니다 ㅠ

0

298

1

creactStore질문이요

1

284

2