173만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
섹션23인 검색 기능 구현 파트 이후로는 포트폴리오 강의가 제공되지 않고 있는데, 이 후의 중고마켓 웹사이트에 대한 포트폴리오 리뷰 강의는 제공되지 않고, 스스로 하되, 포트폴리오 리뷰 자료를 참고하면 되는 건가요?
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요. 강의 잘 듣고 있습니다. 강의를 듣다가 의문이 생겨 질문드립니다. 아래 두 코드는 모두 정상적으로 작동합니다. 그럼에도 불구하고, 두 번째 코드를 사용하는 이유는 혹시 나중에 onDelete 기능에 새로운 로직이 추가될 가능성에 대비하기 위해서인가요? 만약 이 기능이 Props로 전달받은 기능만을 사용한다면, 첫 번째 코드로 작성해도 괜찮은지 궁금하여 질문드립니다. <button onClick={() => {onDelete(id)} }>삭제</button> const onClickDeleteButton = () => { onDelete(id); } return ( //생략 <button onClick={onClickDeleteButton}>삭제</button> );
해결됨
파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 (장고 4.2 기준)
제가 API Server 구축에 더 관심이 가서... 세션 4까지 복습했는데, 바로 DRF로 넘어가도 될까요?
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
현재 일기 관리 기능 구현하기2 부분의 강의를 보고 있는데 강의에서 const DiaryStateContext = createContext(); const DiaryDispatchContext = createContext(); 이렇게 createContext를 두번 작성이 되었고 또 DiaryStateContext는 value로 data를 DiaryDispatchContext는 value로 onCreate, onUpdate, onDelete 이렇게 각각 보내는데 왜 이렇게 두번작성을 하는 것인지 그리고 그냥 DiaryStateContext 이 부분에 value로 data와 onCreate, onUpdate, onDelete 이걸 같이 보내면 안되는건가요?
미해결
React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
안녕하세요! 강의 잘 듣고 있습니다!!! 🙂 React Query 공식 문서에 나오는 페이지네이션 기능에 대해 궁금한 점이 있습니다. 제가 직접 시도해봤는데 어려워서 그런데, 혹시 이 기능을 강의에서 다룰 계획이 있으실까요? 선생님께서 설명을 잘해주셔서 강의가 있다면 정말 좋을 것 같습니다. 감사합니다.
미해결
Next + React Query로 SNS 서비스 만들기
예를들어 부트스트랩처럼 모달이나 반응형 디자인 같은거를 편리하게 해주는 기능들이요 그냥 다 직접 만들어야 하나요? 같이 쓸수있는게 있나요?
해결됨
한 입 크기로 잘라먹는 Next.js
강의에 나오는 JSON 데이터를 한 눈에 보기 힘드신 분들은 아래 확장 프로그램을 통해 JSON 데이터를 시각적으로 구조화해서 좀 더 보기 좋게 확인하실 수 있습니다. JSON Viewer https://chromewebstore.google.com/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요 공부를 하다가 index.css 파일과 App.css 이 두개가 조금 헷갈리더라구요. 예를 들어 App.css도 폰트를 적용하면 전부다 적용이 되고 index.css도 똑같이 되는데 그럼 index.css는 어떤부분일때 작성이 되고 App.css는 어떤부분일 때 작성이 되는것인지 궁금합니다
해결됨
[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
백엔드도 나온다면 완벽한 시리즈로 듣고 싶어서요
해결됨
손에 익는 Next.js - 공식 문서 훑어보기
안녕하세요! 강의를 쭉 듣고, 배포 단계까지 왔는데 에러가 생겨서 진행이 안되어 문의드립니다! vercel에서 에러는 Failed to compile. src/app/[location]/page.tsx Type error: Type 'Props' does not satisfy the constraint 'PageProps'. Types of property 'params' are incompatible. Type '{ location: string; }' is missing the following properties from type 'Promise<any>': then, catch, finally, [Symbol.toStringTag] Error: Command "npm run build" exited with 1 이며, 그전에도 Route "/[location]" used params.location . params should be awaited before using its properties. Learn more: 위와 같은 에러가 떴고, 이는 경로 및 쿼리 파라미터를 위한 객체에서 런타임 에러가 뜨는걸로 확인했습니다! 강의를 똑같이 따라갔는데, 위와 같은 에러가 나는게 의아하여 한번 문의드립니다! import HomeButton from "../components/HomeButton"; import { getForecast } from "../utils/getForecast"; type Props = { params: { location: string; }; searchParams: { name: string; }; }; export function generateMetadata({ searchParams }: Props) { return { title: `날씨 앱 - ${searchParams.name}`, description: `${searchParams.name} 날씨를 알려드립니다`, }; } export default async function Detail({ params, searchParams }: Props) { const name = searchParams.name; const res = await getForecast(params.location); return ( <> <h1>{name}의 3일 예보</h1> <ul> {res.forecast.forecastday.map((day) => ( <li key={day.date}> {day.date} / {day.day.avgtemp_c} </li> ))} </ul> <HomeButton /> </> ); } 크리스마스 쉬는날 연락드려, 죄송하며 빠른 답변 부탁드립니다!
해결됨
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
새 강의도 쿠폰 받아서 잘 구매 하였습니다. 궁금한 것은 기존 강의를 다 듣고 새 강의를 수강해야 하는 것인지 기존 강의의 진도와 새 강의의 진도가 어느 부분인지 어떻게 바뀐 것 인지에 대해 이해가 안 가서 어떻게 해야하는지 알려주는 공지 또는 간단 영상이 필요할 것 같습니다. 기존 강의의 커리큘럼과 비슷하나 좀 바뀐 부분이 있을 것 같아서요. 기존 강의를 다 수강 후 복습 + 새로운 기술을 익힐 겸 새 강의를 수강하는 것이 맞는지, 아니면 기존 강의는 수강을 멈추고 새로운 강의를 다시 수강하면 되는 것인지 알려주시면 감사하겠습니다.
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
index.html에서 다룬 코드입니다. 경로를 바꿀때마다 vercel --prod로 프로젝트 갱신해서 배포했습니다. meta 태그에서 썸네일 이미지를 표현하는 og:image 프로퍼티와 컨텐츠에 썸네일을 하고 싶은 이미지를 src / assets 파일에 todayfeeling.png 로 저장해놨습니다. 탭 아이콘 표현은 절대 경로로 표현했을 때 비로소 적용이 되었습니다. (강의에서는 href="/favicon.ico"로 표현했지만 저는 강의랑 똑같이 했을 경우에 아이콘이 나타나지않아서 아래 코드와 같이 경로를 추가해서 아이콘을 띄웠습니다.) 썸네일 이미지 때문에 content ="/todayfeeling.png" content ="src/assets/todayfeeling.png" content ="/src/assets/todayfeeling.png" (블로그에 올린 이미지 주소) content ="https://velog.velcdn.com/images/foreveryejin/post/65845dd4-a999-4344-9fb4-3710b07f5a3d/image.png" content ="./src/assets/todayfeeling.png" 여러 경로를 바꿔가면서 해봤는데 안되더라구요. 그래서 다른 포털사이트에서 실제로 사용하는 meta 태그를 긁어와서 사용해봤는데 안되네요... 다른 기능들은 잘 작동하는데 이것만 말썽입니다..! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="icon" type="image/svg+xml" href="src/assets/icon.ico" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>오늘 하루 감정</title> <meta property="og:title" content="오늘의 감정" /> <meta property="og:image" content="/todayfeeling.png" /> <meta property="og:description" content="예진이의 오늘의 감정 일기장" /> </head> <body> <div id="root"></div> <script type="module" src="/src/main.jsx"></script> </body> </html> pc : 모바일 : 저의 깃헙 링크입니다! 확인 부탁드립니다. https://github.com/yyejin00/diary-with-emotions 감사합니다.
해결됨
[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스
안녕하세요, 수업 잘 듣고 따라가고 있습니다~~!! 다름이 아니라 , 아무래도 graphQL를 이용한것보다 취직하고싶은 회사에서 대부분 REST API를 사용하는거같아 혹시 fetch 또는 axios를 사용하는 방법은 강의에 추가할 계획이 없으실까요? 그리고 nextjs에서는 axios를 사용하는 대신에 fetch를 사용하는것이 맞을까요?
해결됨
한 입 크기로 잘라먹는 Next.js
안녕하세요. 프로젝트에서 error.tsx 를 띄우는 예시로, 백엔드 서버를 종료하여 데이터를 받아오지 못하게 함으로써 error.tsx 가 표시되는 경우를 다루셨습니다. 이때, "백엔드 서버를 종료해서 데이터를 받아오지 못하게 함"을 "페이지가 렌더링되지 못하게 함"으로 이해해도 괜찮은지 궁금합니다. 이 질문을 드리게 된 이유는, 프로젝트에서 에러를 처리할 때 error.tsx 나 에러 페이지를 띄우는 것 외에도 다양한 방식으로 에러를 처리할 수 있기 때문입니다. 예를 들어, 에러 모달을 띄운다거나, 다른 페이지로 이동시키는 등의 방법도 있습니다. 그래서 error.tsx 가 어떤 종류의 에러에 대한 대비책인지 명확히 이해하고 싶습니다. 저는 error.tsx 가 예상치 못한 500번대 서버 에러와 같은 페이지나 컴포넌트 렌더링 실패 를 처리하는 페이지라고 이해하고 있는데, 제 이해가 맞는지 궁금합니다.
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요 ! 해당 리액트 강의에서 했던 실습에서는 기능위주? 로 진행해서 궁금증이 생겼습니다 ! 만약 리액트를 사용해서 간단한 정보 공유 웹 사이트를 만든다면 텍스트의 양이 많아지는데 이런 경우에는 파일 내부에 내용을 작성하면 코드가 길어지니, 직접 api 제작하고, 연동하는 게 맞는 거겠죠!?
미해결
[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
새 강의 구매 할인 어떻게 진행하면 되는건가여ㅛ? 방법을 몰라서 문의드립니다.,
해결됨
한 입 크기로 잘라먹는 Next.js
7-1 서버 액션 강의를 수강하는 중 page.tsx:75 Server Error: Route "/book/[id]" used params.id . params should be awaited before using its properties. 라는 문구와 함께 book > [id] 폴더의 page.tsx에서 404 오류가 발생하여 화면이 보여지지 않아 해결을 위해 다양한 시도를 해보던 중 해당 강의의 예제 코드(section7 - chapter1)를 가져와 사용했더니 (with-searchbar) > error.tsx에서 (0 , util_ delay__WEBPACK_IMPORTED_MODULE_3__.delay) is not a function Error 위 와 같은 오류가 뜹니다. 어떻게 해결해야할까요?
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요 섹션4의 next-auth 를 수강하고있습니다. next-auth를 사용하는 이유가 무엇인가요? 보통 백엔드에서 로그인 기능을 구현하는 것이 일반적이라고 알고 있습니다. next-auth는 백엔드가 로그인 기능을 구현하지 않았을 때 사용하는 것인가요? 아니면 이미 백엔드에서 구현한 로그인 API를 사용하기 위해서도 next-auth를 사용하는 경우가 있나요?
미해결
React 완벽 마스터: 기초 개념부터 린캔버스 프로젝트까지
import Card from "../Card.jsx"; import Courseitem from "./Courseitem.jsx"; function CourseListCard({ items }) { return ( <Card title={"강의 목록"}> <div className="courses"> {items.map((item) => { return <Courseitem {...item} />; })} </div> </Card> ); } export default CourseListCard; 강사님과 동일한 코드를 작성했는데도 저는 렌더링이 되지 않습니다 ㅠㅠ
미해결
처음 만난 리액트(React)
23번 줄에 왜 에러가 뜨는지 이유를 모르겠습니다 npm을 실행하면 react 창에 다음과 같이 표출됩니다 vscode를 껐다 켜도 동일한 상황이 발생해요
