아니요: 'X-Robots-Tag' http 헤더에서 'noindex'가 감지됨페이지 색인을 생성할 수 없음: ‘NOINDEX’ 태그에 의해 제외되었습니다. 라고 뜨는데,Robots.txt 도 제 url 에 맞춰서 변경했는데 뭐가 문제가 되는지 모르겠습니다..!네이버 서치어드바이저에는 잘 등록된 상태 입니다.

저는 scss 대신 emotion 스타일을 사용하고 컴포넌트or 페이지를 스타일 파일과 한폴더에 넣어 사용합니다 (아래와 같은 폴더구조)페이지 폴더가 라우트 기능을 해서인지 다음과 같이 빌드 최적화에 실패햇다고 뜨는 현상이 있는데 컴포넌트폴더 에서는 문제없이 되는데 페이지 폴더에서만 이렇게 되는 원인이 무엇인가요?또 해당 페이지를 컴포넌트로 이동신후 페이지에서 단순 호출만 하게 한다면 최적화가 정상적으로 되는건가요? 

이전 강의 섹션 7 "실무용 폴더구조와 props"에서 21분 3초쯤에 src > components에서 한 번만 사용되는 컴포넌트들은 units, 두 번 이상 사용되는 컴포넌트들은 commons폴더에 만들어 준다고 하셨는데 섹션 7 "컴포넌트 재사용성"에서는 만들 컴포넌트는 등록페이지와 수정페이지 두 곳에서 사용되는데 12분 50초쯤에 src > components > commons이 아니라 src > components > units 폴더에 만드시던데 2번 이상 사용될 컴포넌트는 commons안에 만드는 거 아니었나? 혼란스러워서 저도 units 폴더에 따라 만들긴 했지만 제가 제대로 이해못한 것 같습니다... 이 부분에 대해서 한 번 더 설명해 주시면 감사드리겠습니다!

안녕하세요! css 싸이월드 1일차 과제 중에 아이콘과 글자 사이의 간격을 조절할 수 있는 방법이 있는 지 궁금해져 질문 드립니다!아래는 제가 작성한 html 코드이고아래는 라이브서버 화면입니다!별과 인스타그램 사이 간격이 위 3개의 글자보다 넓어 신경이 쓰이네요... 차이를 알고자 배경색을 깔아둔 것입니다. 답변 주시면 감사하겠습니다 :)

안녕하세요.. 매번 사소한걸로 질문드리고 있어욥...싸이월드 만들기 2탄 수업들으면서 같이 실습하고 있는데 html에는 제대로 입력을 한것같은데 화면에는 제대로 안떠서 문의글 남깁니다... 머가 문제인지 모르겠어요ㅠㅠ

const setGraphql = gql` mutation createBoard($writer: String, $title: String, $contents: String) { createBoard(writer: $writer, title: $title, contents: $contents) { _id number message } } `; export default function GraphqlMutationPage() { const [createBoardMutation] = useMutation(setGraphql); const onClickSubmit = async () => { try { const result = await createBoardMutation({ // await 을 빼주면 promise 상태로 변환 variables: { // variables => $ 역할을함 writer: '훈이', title: 'ㅎㅇ', contents: '반갑습니다', }, }); console.log(result); } catch (error) { console.error(error); } }; 다음과 같이 코드를 작성해보았습니다. 데이터 요청은 보내지지만 variables 값들이 바뀌질 않습니다.

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 네이버 클라우드 플랫폼에도 사용횟수는 늘어나고 있고 css를 건드려봐도 map이 생성이안되서 height 100% 가 먹히질 않고있습니다.. 뭐가문제일까요 ㅠㅠ++ 개발자 도구 Network 를 열어봐도 잘 받아오고잇고 지도 이미지도 받아오는것을 확인 하였습니다.

image upload 의 주소가 google로 되어있다고 설명해주셨는데 백엔드 개발자가 google 쪽으로 설정한 것인지 아니면 graphql 에서 기본적으로 google 주소를 가지고 있는 것인지 궁금합니다

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 먼저 빠르게 답변해주셔서 정말 감사합니다!답변해주신 부분 참고해서 코드를 수정하던 도중 궁금한 점이 생겨 다시 질문 드립니다아래 답변을 참고해서 코드를 변경해봤는데 맞는건지 확인가능할까요?-firebase_admin.tsif (!admin.apps.length) { const config: Config = { credentials: { projectId: process.env.projectId || '', clientEmail: process.env.clientEmail || '', privateKey: process.env.privateKey?.replace(/\\n/g, '\n') || '', }, }; admin.initializeApp({ credential: admin.credential.cert(config.credentials), }); console.info('bootstrap firebase admin'); } else { admin.app(); }else문에 admin.app()을 통해 이미 애플리케이션이 실행되었다면 초기화하지않고 실행한다는 코드인데 이게 맞을까요?? 파이어베이스에 대해 정확히 알지 못해서...ㅠㅠ 번거롭게 해드려 죄송합니다.  -if문안에서 로그 안뜨는 문제는 해결했습니다! console.info('bootstrap firebase admin'); 

안녕하세요! section 26 포트폴리오 수행중, Invariant Violation이라는 에러가 떠서 이렇게 질문 드립니다.

next Link를 이용하게 되면 해당 페이지에서 링크 페이지의 js를 미리 불러온다는 내용이 강의에 존재하였는데헤더나 푸터등 모든페이지에 공용으로 들어가는 영역에 site맵 존재하고 모든 링크를 걸어 놓게 된다면 모든 페이지가 미리 js 형태로 불러와 지게 되는건가요?해당 경우에는 next의 강점이 많이 무뎌질거 같아 질문합니다.

04-04-graphql-mutation-input 파트에서gql세팅에서 백틱을 사용하는데 백틱 내부 내용이 저는 문자열 처리되어서 강의와 같이 문자열이 아닌 함수 형태로 만들 수 있는 플러그인이 무엇일까요?동작은 똑같이 동작하기는 합니다

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 설명해주신 싱글톤? 방식말고 평소에 사용하는 방식으로 바꿔봤는데 맞는지 검사가능할까요??hello.ts import { NextApiRequest, NextApiResponse } from 'next'; const admin = require('../../model/firebase_admin'); export default function handler(_: NextApiRequest, res: NextApiResponse) { const db = admin.firestore(); db.collection('test'); res.status(200).json({ name: 'John Doe' }); }modle/firebase_admin.tsconst admin = require('firebase-admin'); interface Config { credentials: { privateKey: string; clientEmail: string; projectId: string; }; } if (!admin.apps.length) { const config: Config = { credentials: { projectId: process.env.projectId || '', clientEmail: process.env.clientEmail || '', privateKey: process.env.privateKey?.replace(/\\n/g, '\n') || '', }, }; admin.initializeApp({ credential: admin.credential.cert(config.credentials), }); console.info('bootstrap firebase admin'); } module.exports = admin;현재 firestore만 hello.ts에서 test 보내는 방식만 따라해봤습니다!  질문 1. 이 방식으로 사용해도 될까요??이 방식으로 문제될게 있을까요?질문 2. 아래 코드가 출력이 안되는데 이유가 있을까요?console.info('bootstrap firebase admin');위 전체코드에서처럼 if문안에 작성하게되면 콘솔이 영상처럼 터미널에 안뜨는데 왜그런걸까요?if문 밖에 선언하면 잘 출력됩니다.   

안녕하세요! nextjs 실습중입니다. next/Image를 사용해서 이미지를 띄웠는데, dev 환경에서는 이미지가 잘 떴는데, 실제로 배포하니까 에러가 나면서 이미지가 안뜨네요 아무리 구글링 해봐도 모르겠어서 질문 드립니다ㅜㅜ

안녕하세요, section 26 수업을 따라가던 도중, 이러한 error가 발생하였습니다. error message를 확인해보면, CreateProductInput에 문제가 있는 것 같은데 해결하기가 어려워 질문을 남깁니다 !

수업 잘듣고 있습니다. 수업 외적으로 VSCode 에서 코딩 중에 회색으로 코드 힌트가 들어가 있던데요. 어떤 익스텐션인지 알려 주실 수 있을까요?검색 중인데 못찾겠네요.죄송하지만 도움을 주셨으면 감사하겠습니다.좋은 주말되세요

안녕하세요 선생님 !props를 잘 쓰다가, return문 첫 번째 줄에 넣었는데 두 번쨰 이미지처럼 에러가 뜨더라구요 . 근데 첫 번째 이미지처럼 위에 부모 태그를 달아주면 괜찮아지던데 이유가 혹시 뭔지 알 수 있을까요 ??

리덕스, 사가를 사용할때는  리덕스 -> 사가 -> 리덕스 순으로 값이 전해져서 게시글을 추가할때마다  게시글 개수가 올라가는 흐름을 툴킷을 적용해서 하려고 하니깐 막혀서  어떻게 해야할지 질문드립니다.   코드는 다음과 같이 post.ts // post.ts export const addPostAction = createAsyncThunk('/post', async (data: string) => { const addPost = dummyPost(data); await delay(1000); return addPost; }); // 게시글 삭제 export const removePostAction = createAsyncThunk( '/post/delete', async (data: string) => { await delay(1000); return data; } ); // 게시글 추가 .addCase(addPostAction.pending, (draft) => { draft.addPostLoading = true; draft.addPostDone = false; draft.addPostError = null; }) .addCase(addPostAction.fulfilled, (draft, action) => { draft.addPostLoading = false; draft.addPostDone = true; draft.mainPosts.unshift(action.payload); }) .addCase(addPostAction.rejected, (draft, action) => { draft.addPostLoading = false; draft.addPostError = action.error.message; }) // 게시글 삭제 .addCase(removePostAction.pending, (draft) => { draft.removePostLoading = true; draft.removePostDone = false; draft.removePostError = null; }) .addCase(removePostAction.fulfilled, (draft, action) => { draft.removePostLoading = false; draft.removePostDone = true; draft.mainPosts = draft.mainPosts.filter( (v) => v.id !== action.payload ); }) .addCase(removePostAction.rejected, (draft, action) => { draft.removePostLoading = false; draft.removePostError = action.error.message; })  user.ts  // user.ts const dummyUser = (data: LoginData): DummyData => ({ ...data, nickname: '제로초', id: 1, Posts: [{ id: 1 }], Followings: [ { id: 2, nickname: '김' }, { id: 3, nickname: '이' }, { id: 4, nickname: '박' }, ], Followers: [{ nickname: '김' }, { nickname: '박' }, { nickname: '이' }], }); const userSlice = createSlice({ name: 'user', initialState, reducers: { addPostTome(draft, action) { draft.me?.Posts.unshift({ id: action.payload }); }, removePostOfMe(draft, action) { if (draft.me) { draft.me.Posts = draft.me?.Posts.filter((v) => v.id !== action.payload); console.log(draft.me); } }, }, 로 구분을 했고  게시글 추가, 삭제는 정상적으로 작동하는데  이때 user.ts의 dummyUser 값을 어떻게 변경해줘야 할지를 잘 모르겠어서 질문드립니다.

일단...여러가지 배포 오류가 많이떠서 거의 2주간 배포에 시간 썼는데 여찌저찌 배포가 되긴 했어요..!이번엔 질문이 좀 많아요..ㅎ서버 api와 통신은 제대로 잘 되는데 자꾸 웹소켓 오류가 뜨는데 이거 무시해도 괜찮은 건가요?서비스 동작하는데는 문제 없는 것 같은데 이런 오류가 계속 떠요.백엔드와 데이터베이스 연결 pdf 파일 내용은 영상으로 안다뤄 주신거죠? 제가 도커쪽과 배포쪽은 정말 아예 처음 써보는거라 지식이 많이 부족한데, 제가 영상보고 이해하기로는 현재 ec2에서 깃 클론으로 모든 client와 server소스코드와 도커 컴포즈 파일까지 가져와서 거기서 pm2로 클라이언트랑 서버 모두 백그라운드로 실행하는 것으로 이해했거든요. 2-1. 왜 도커 파일을 client와 server에 각각 만들어줘서 도커컴포즈로 이미지 생성하도록 만드는건지 이해를 못했어요. 도커 파일에는 여러 패키지 설치하는 명령어(?)와 client를 실행시키는 명령어가 있던데 이 과정이 왜 필요한건지 이해를 못했습니다.ㅠㅠ 사실 저는 '백엔드와 데이터베이스 연결하기'라는 pdf에 있는 도커 파일로 변경했을때 배포 실패했다가 도커파일 싹 다 지우고 decker-compose.yml파일을 원래 기존 로컬에서 작성했던대로 냅두고, data-source.ts 파일의 host 부분도 그냥 "localhost"로 놔둔채 배포에 성공했거든요.그래서 저 pdf 파일대로 client와 server에 도커파일을 만들고 도커 컴포즈 파일까지 변경한 후 도커 컴포즈 명령어 실행했을 때와 도커파일 없이 기존의 도커컴포즈 파일대로 배포했을 때와는 어떤 부분이 다른건지 궁금합니다. ec2 인스턴스에서 깃 클론으로 가져온 client를 다시 npm run build:production하는 빌드과정을 보여주셨는데, 어짜피 pm2로 ecosystem.config파일을 백그라운드로 실행시킬거면 (이 파일에서 script: "npm run start:production"라는 명령어를 실행하도록 설정해줬으므로) client의 빌드 폴더 만드는 과정이 필요 없는거 아닌지요? (무지한 소리면 죄송합니다..ㅠ) 마지막으로, 인스턴스를 종료하고 컴퓨터를 끄더라도 도커가 종료되지 않고 계속 동작하는 것 같더라고요. 로그인 로그아웃이 동작하고 유효한 토큰인지 확인하는 api도 잘 동작했어요. 제가 생각했을 떄는 pm2로 서버와 클라이언트는 백그라운드로 실행시켰지만 도커는 포어그라운드로 동작시켜서 인스턴스 종료하면 데이터베이스와는 연결이 끊겨 제대로 동작을 안할 것이라 생각했는데 예상과는 달리 잘 동작하더라고요. 이건 도커의 특징인건지, 아니면 저희가 작성한 파일에 백그라운드로 동작하도록 하는 설정이 포함되어 있는건지.. 알려주시면 감사하겠습니다.질문이 길고 갯수가 많은데 답변 기다리겠습니다..! 감사합니다.

1.getStaticProps를 about 페이지에 사용하셨는데빌드를 하고 나서 유저의 게시글 개수 팔로우 개수 팔로워 개수가 바뀔 수 있잖아요?근데 getStaticProps를 사용했고빌드시 html로 만들어 저장하고 그 html을 브라우저로 전달하기 때문에DB의 데이터가 바뀌어도브라우저 화면의 about페이지에는 빌드시의 html이 보여지게 되서 데이터 갱신이 안되는데 맞나요?? 2.그리고 html로 바뀌는 대상이 about페이지라면about컴포넌트의 자식 AppLayout의 자식 UserProfile 컴포넌트에는 동적인 데이터가 쓰이기 때문에 말이 안되는 것 같은데 html로 바뀌는 대상이 정확히 뭔지 알 수 있을까요??