묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
결제관련
결제를 구현하는 중인데여기 프로젝트에서 결제 과정이 로그인 한 후에 그 아이디로 포인트 충천 API를 날려서 포인트를 충전후상세 페이지에서 결제버튼 클릭시 포인트가 충분하면 성공 포인트가 부족하면 실패 이런식으로 만들어져야 하는 건가요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
yarn dev를 하니 리엑트 버전 오류가 납니다.
첫번째 사진은 터미널창에서 yarn dev를 하니 리엑트 버전을18.2.0 버전으로 해야 한다고 합니다. .전에 eslint 설치중에 오류가 나서 node_modules, eslintrc.js , yarm.lock 을 지웠다가 재설치를 했습니다.이때문에 오류가 난것 같은데 구글링해도 해결방법을 모르겠어서 질문남깁니다 ㅜ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
husky 설치 과정중 질문 있습니다!
yarn add --dev husky과 npx husky install 하니.husky 폴더가 생겼는데 강의와는 다른 폴더들이 많이 있구요 이후에 npx husky add .husky/pre-commit "yarn lint"실행하니 add 명령어를 권장하지 않는다고 뜹니다이 경우에 어떻게 해야할까요??
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
08-01-map-fruits 실무 효율적인 렌더링 예제
데이터를 bbb 같은 데이터에 담고 그걸 presenter에 담으면 presenter에서 데이터를 알아보기 어려우니까 3번과 같이 map 자체를 <div> 에 담아서 렌더링 한다고 말씀하셨는데요, 그렇다면 3번과 같은 렌더링은 컨테이너의 return에 적는걸까요 아니면 presneter의 return에 적는걸까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
피그마 회원가입 만들기
회원가입 css까지 다 완성했는데 비교해보니 비슷한 느낌은 나는것 같습니다. 혹시 코드 예제? 라던지 대표적인 완성코드를 볼 수 있는건 없나요?? 한번 비교해보고 싶어서요.. 추가로 남성/여성 부분 radio 동그라미가 피그마 원본? 상에는 크고 회색으로 칠해져 있는데 저건 어떻게 적용하나요?? 가입하기 버튼 위 구분선도 제게 사라졌는데 원인을 알수있을까요?<!DOCTYPE html> <html lang="ko"> <head> <title>회원가입</title> <link href="./02-signup.css" rel = "stylesheet"> </head> <body> <div id="tBox"> <h2 id="title">회원 가입을 위해 <br/> 정보를 입력해주세요</h2> <input class = "underline" type="text" placeholder="*이메일"><br><br> <input class = "underline" type="text" placeholder="*이름"><br><br> <input class = "underline" type="pw" placeholder="*비밀번호"><br><br> <input class = "underline" type="pw" placeholder="*비밀번호 확인"><br><br> <!-- <select> <option disabled="true" selected="true">지역을 선택하세요</option> <option>서울</option> <option>경기</option> <option>인천</option> <option>부산</option> <option>울산</option> <option>김해</option> </select> --> <div id = "gender"> <input type="radio" name="gender">여성 <input type="radio" name="gender">남성 </div> <br><br> <div class="checkbox-container"> <input type="checkbox" id="terms"> <label for="terms">이용약관 개인정보 수집 및 이용, 마케팅 활용 선택에 모두 동의합니다.</label> </div> <br> <div class = "register"> <button class = "button">가입하기</button> </div> <!-- <input type="button" value="가입하기"> --> </div> </body> </html>* { box-sizing: border-box; } #title { width: 466px; height: 94px; color: #0068ff; font-size: 32px; font-family: Noto Sans CJK KR; text-align: justify; } #tBox { width: 670px; height: 960px; border: 1px solid #aacdff; margin-top: 60px; margin-left: 625px; padding: 100px; box-shadow: 7px 7px 39px 0px #0068ff; border-radius: 20px; display: flex; flex-direction: column; align-items: center; } input[type="text"]{ width: 466px; height: 80px; padding: 10px; margin: 10px 0; border: 1px solid #797979; } input[type="pw"]{ width: 466px; height: 80px; padding: 10px; margin: 10px 0; border: 1px solid #797979; } button { padding: 10px 20px; color: #fff; background-color: #0068ff; border: none; border-radius: 5px; cursor: pointer; } input.underline { border-left-width: 0; border-right-width: 0; border-top-width: 0; border-bottom-width: 1px; } #gender { width : 140px; height: 23.94px; border : 1px solid #fff; display: flex; justify-content: space-between; } .checkbox-container { width: 466px; height: 21.06px; border: 1px solid #fff; border-radius: 3px; align-items: center; display : flex; } .checkbox-container input[type="checkbox"] { margin-right: 10px; } .register { border-top : 1px solid #e6e6e6; width: 470px; height: 1px; } .button { background-color: #FFFFFF; border :1px solid #0068FF; width: 470px; height: 75px; border-radius: 10px; font-size : 18px; color : #0068FF; text-align: center; font-weight: 400; line-height: 26.64px; font-family: Noto Sans CJK KR; }
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
페이지이동후 쿼리 질문있습니다
페이지 이동후 url에 상품 id도 잘출력되고graphql에 조회해봐도 제대로 조회가되는데vscode로 실행하면 variables에서 null값이 출력되는데아무리 찾아봐도 어디가 문제인지 몰라서 질문드립니다 ㅠㅠ
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
공부방식에 질문있습니다.
일단 현재 라우팅수업 진행중입니다!매 섹션 강의를 다 듣고나서 해당섹션 학습자료 복습 후퀴즈와 포트폴리오 과제실습을 진행하는데퀴즈와 포트폴리오를 진행할때마다 배웠던 코드구동원리는 이해는 했지만 실습할때마다 코드구성이 정확히 기억나지않아서매번 이전 자료를 보면서 해당코드는 따라치고 조립하는 경향이있는데 이런식으로 공부해도 되는지 의구심이 들어서 질문드려요가급적이면 코드구성도 다 외워서아무것도 보지않고 해내는게 제일 바람직할까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
prevState 관련 질문드립니다
카운터만드는 부분은 이해가 갔는데 토글 만드는 부분에서 이런식으로 현재 state를 뒤집는것과 무슨 차이가 있는 건지 잘 이해가 가지 않습니다. const onToggleModal = () => { setIsOpen((perv) => !prev); }; const onToggleModal = () => { setIsOpen(!isOpen); };
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
수정하기 기능
이제 promise.all을 사용해서 이미지 미리보기는 가짜 URL로 보여주고게시글 등록 mutation을 날릴때 이미지 upload 요청을 보내고 응답받은 url을 mutation을 날리고 있는데수정하기할때도 uploadImage을 하기 위해서 코드의 양이 길어지는데 코드는 길더라도 이게 더 효율적인 방식인건가요?? 그리고 이렇게하면 fetchBoards의 결과로 받아온 결과는 string 타입이고 uploadImage에 사용하는 이미지는 FIle 타입이라서 creacteBoard처럼 각각 다른 배열에 담아서 보내기는 어렵고 만약 upload하고 응답받은 url이면 skip하고 File타입의 데이터라면 imageUpload를 실행시켜 url을 받아오와 배열에 추가해서 updateBoardInput 객체에 추가해서 mutation 보내려고 하는데 이런식으로 접근하는게 맞는지 궁금합니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
이모션에서 props전달시 화살표함수가 원래 이렇게 생겼나요?
다른 부분에서 화살표함수 만들면 제대로 만들어지는데 이부분에서만 화살표함수 모양이 다릅니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
07-01 emotion에서 if문을 다 넣어도 노란색으로 변하질 않습니다.
onChangeContents 함수 부분에 넣었을때 처음엔 버튼이 노란색으로 변했습니다만 이후 onChangeWriter 와 onChangeTItle 부분까지 넣은 후 버튼의 색이 변하지 않습니다.if문을 다 지우고 setIsActive(true)만 넣었을때는 작동이 됩니다..
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
리액트와 next.js 강의에 대해 여쭤볼게 있습니다.
안녕하세요 우선 강의 열심히 잘 보고 있습니다. 다른게 아니라 리액트와 next.js 수업이 조금 헷갈리는데 섹션5부분만 리액트이고 그 뒤에는 next.js라고 보면 되나요? 강의를 보다가 어느순간 제가 알고있는 리액트의 폴더구조들이 조금 다르더라구요. 리액트에서는 폴더중에 App.js인데 _app.js 이런식으로 되어있고 또 마지막 포트폴리오 리뷰에서는 화면에 리액트 로고부분도 나와있어서 어디서부터 어디까지가 리액트이고 next.js 강의인지 알려주시면 너무 감사드리겠습니다 ^^ 마지막으로 포트폴리오 리뷰는 제가 어떠한걸 보고 만든 후 보는 영상인지 아니면 그냥 영상을 보고 같이 하는건지도 알고싶습니다.
-
미해결[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
refreshToken 적용 이후
포트폴리오를 만드는중에 refreshToken을 이용해서 로그인 데이터를 저장한 후에 생긴 문제입니다.게시글 조회 페이지에서 새로고침을 하면 fetchBoards와 fetchBoardCount 요청이 2번씩 나가고뒤에오는 요청은 canceled 되는데 이런 경우는 어떤거 때문에 생기는건지 궁금합니다.localStorage로 되돌리면 다시 오류없이 잘 동작합니다refreshToken을 사용하고 저 오류가 생기면 게시글 등록후에 간헐적으로 새로고침을 해야 refetch되는거 같습니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
상품등록 기능
상품 등록시에 판매자 데이터를 넣는거같은데 gpl query문에서 seller, buyer를 어떤 형식으로 작성해야 되는지 모르겠습니다데이터는 fetchUserLoggedin으로 넣는게 맞는지도 궁금합니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
데이터 통신 실습 부분에 대해 질문있습니다.
안녕하세요 graphql 부분에서 조금 헷갈려서 질문을 드립니다.1. 이 부분에서 왼쪽부분에서 판매자 이름이 철수이고 createProductInput은 마우스, 정말 좋은 마우스 그리고 가격을 사용자가 저렇게 마우스 가격등을 input에 작성하면 name, detail, price가 생성된다라는 뜻으로 이해하면 좋을까요? 그리고 그 밑에 _id는 윗부분에 마우스라고 생성해서 나온 마우스라는 제품의 id를 보낸다는 뜻인지도 궁금합니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
변수, useState 부분 질문있습니다.
안녕하세요 수업 너무 잘 듣고 있습니다. 수업을 듣다 궁금한점이 생겼는데 제가 인강을 보면서 변수 let, const와, 리액트에서 useState부분을 보고 이해는 갔지만 제가 막상 혼자 코드를 친다고 했을때 let, const와 useState를 언제 작성을 하면 되는지 잘 모르겠더라구요. 혼자 코드를 작성을 한다고 할때 변수와 useState를 언제 작성을 하면된다라고 이해를 하면 쉽게 이해할수있을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
리액트 설치에 대해 궁금한 점이 있습니다.
현재 리액트부분을 시작했는데 리액트를 설치할때 yarn add next@12.1.0 react@17.0.2 react-dom@17.0.2 --exact이러한 명령어를 사용하는데 이렇게 설치하고 나니 제가 알고있는 폴더들이나 내용이 좀 다르더라구요. 제가 알고있는 건 npx create-react-app ./ 이러한 명령어로 리액트를 설치했는데 이거와 전혀 다른 명령어 인가요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
yarn 설치가 되지않습니다.
node.js와 npm은 --version을 이용하니 버전이 나오는데 yarn은 버전이 나오지 않아 npm install -g yarn 이라는 명령어를 하니 이미지처럼 에러가 나옵니다.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
섹션11 eslint 설치
eslint 설치 시 3개 중에 마지막 3번째를 선택하라고 하는데 저는 선택지가 2개만 나옴니다. 2번째를 선택해서 설치해도 되나요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
geolocation부분에 대해 질문있습니다.
geolocation부분에const askForLocation = function () { navigator.geolocation.getCurrentPosition((position) => { console.log(position); }); }; askForLocation();이렇게 함수가 있는데 여기서 궁금한점이 askForLocation(); 함수 호출부분에 인자로 전달하는 것이 없는데 매개변수로 position에 위치정보 객체형식으로 콘솔에 나오는 이유가 뭔지 궁금합니다.
