월 79,200원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
똑같이 따라쳤는데 빨간 밑줄이 생겨요
https://www.inflearn.com/questions/949944위 질문 올리신 분과 완전 똑같은 상황인데멘토님 댓글 보고 수정해봤는데도 해결되지 않네요ㅠㅠ..수업과 코드가 똑같은데 왜 저만 이런 에러가 발생하는지 원인이 궁금하고 해결법도 알고 싶습니다!!
- 미해결[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
document.style 속성 팝업안됨 문의
안녕하세요.FrontEnd 수업, "섹션 3. 훈훈한 Javascript > JS로 HTML, CSS조작" 강의 중 문의 드립니다.(Visual Studio Code사용)script.js 실습 중,const messageContainer = document.querySelector('#d-day-message');const container = document.querySelector('#d-day-container');container.style.display = 'none';messageContainer.style.color = 'red'; container.style 작성시 style속성 팝업이 안됩니다.그냥, key-in하면 적용은 됩니다.style 속성을 팝업되게 할려면, 어떻게 해야할까요?실습 중 궁금하여 문의 드립니다.
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
figma css속성 안보임
figma devmode가 24년 2월부로 유료화 되었다고 하는데 이제는 더이상 css속성을 확인할수 없나요? 회원가입 폼 만들어보려고 하는데 css가 안보이네요ㅠ
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
Next.js
안녕하세요 제가 급히 Next.js에 관련하여 업무에 필요한데, 어느 강의부터 수강하면 될까요?😅
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
포트폴리오 리뷰라는게
제가 만든 코드랑 다르다면 깃허브에 있는 코드로 수정해야되나요 아니면 깃허브에 있는 코드를 가져와서 강의 시청만 하는건가요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
test 수업에서 eslint 오류
이런 오류가 뜨는데 무엇때문인가요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의로 들으시는 분들!)AWS Ubuntu에 PostgreSQL DB 설치&연동 + DBeaver로 연결
강의로 듣는 사람들은 DB를 제공하지 않는다고 해서 저는 직접 DB를 만들어 실습을 해보고 싶어서 만들어 봤고 아마 저처럼 DB를 직접 만들어 실습하고 싶은 분들이 많을 것 같아서 공유합니다.+EC2말고 RDS로 하면 더 쉽게 DB를 만들 수 있다고 하는데 따로 알아보셔도 좋을 것 같습니다.+비용이 들 수도 있는데 이부분에 대해선 잘 모르겠습니다. 저도 조금 비용이 나가는데 투자한다치고 걍하는중 OS는 window10 입니다.PostgreSQL 설치를 위한 aws EC2 인스턴스 생성 - https://velog.io/@yun8565/AWS-EC2-%EC%9D%B8%EC%8A%A4%ED%84%B4%EC%8A%A4-%EC%83%9D%EC%84%B1%ED%95%98%EA%B3%A0-%EC%9B%90%EA%B2%A9-%EC%A0%91%EC%86%8D%ED%95%98%EA%B8%B0* aws 계정 회원가입&로그인 해야합니다.* EC2(EC2 대시보드) > 인스턴스 시작 버튼으로 인스턴스 만들기* 다운받은 키페어파일(.pem 파일)은 'C:\Windows\System32' 이 경로에 넣어두시면 cmd에서 굳이 pem파일이 있는 경로로 갈 필요 없어서 편리합니다!Ubuntu에 PostgreSQL 설치 - https://velog.io/@yun8565/EC2-Ubuntu%EC%97%90-Postgresql-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0* \password 명령어로 password 입력할 때 입력한게 안보이는 것이 정상입니다! 입력하고 엔터 누르시면 됩니다!* 접속 확인 단락에 create user로 사용자 생성하고 생성한 user에 비밀번호를 설정하고 권한을 부여할 필요 없습니다! 그냥 기본 postgres 로 사용해도 됩니다.(이것 때문에 index.ts에서 username과 password에 기본으로 있는 postgres로 입력해야 할지 생성한 걸로 입력해야 할지 계속 접속 실패하고 한참 헤매서 ㅠ 인스턴스를 다시 만들고 저도 그냥 기본으로 진행했습니다.)* 사이트 처럼 pgAdmin4를 사용해도 되지만 강의와 똑같이 하고 싶으신 분들은 스킵하고 나중에 DBeaver 설치하고 연동하시면 됩니다!ex) class_backend > index.tsimport { DataSource } from "typeorm"; import { Board } from "./Board.postgres"; const AppDataSource = new DataSource({ type: "postgres", host: "**.**.***.**", // 내 인스턴스 우측 맨 위에 있는 퍼블릭 IPv4 주소 port: 5432, username: "postgres", // 기본 계정? password: "******", // cmd에서 \password 명령어로 설정해준 비밀번호 입력 database: "postgres", entities: [Board], // 우리가 만든 테이블 형태 synchronize: true, // 동기화하다, 테이블 만들어 달라는 요청 logging: true, }); AppDataSource.initialize() .then(() => { console.log("DB접속 성공"); }) .catch((error) => { console.log("DB접속 실패"); console.error("원인: ", error); }); [cmd로 내 ubuntu의 postgresql 다시 접속하는 법]AWS > EC2 > 내 인스턴트의 연결로 들어가 SSH 클라이언트 탭에서 밑에 '예:' 밑에 있는 코드를 CMD 에 입력(키페어파일 있는 경로에서)2. 입력 후 sudo -u postgres psql 명령어 입력(종료할 땐 \q) [정리]인스턴스 생성 후 CMD 관리자권한으로 실행 AWS > EC2 > 내 인스턴트의 연결로 들어가 SSH 클라이언트 탭에서 밑에 '예:' 밑에 있는 코드를 CMD 에 입력(다운받은 키페어가 있는 경로에서)하면 내 인스턴스에 연결됨(ssh -i ~ 로 시작하는 거, 위에 있는 건 할 필요 없음) 연결된 상태에서(최초 접속 시 sudo apt update 명령어로 패키지 목록 업데이트(왜하는진모름)) sudo -u postgres psql 명령어 입력하면 내 인스턴스에 설치된 PostgreSQL 에 접속(\q 입력하면 접속 종료, 그 외 명령어들은 검색해서 참고) 강의처럼 테이블 클래스 만들고 index.ts로 db 접속하는 로직 만들고 package.json에서 ts-node로 typescript 파일 실행할 수 있도록 만든 명령어로 실행(ex. yarn ti), console로 성공여부를 보여주도록 했고 실패하면 오타가 있거나 잘못 적은 것이 있을 것이다. PostgreSQL을 육안으로 더 편하게 보고 관리하기 위해 DBeaver를 설치하여 연결하고 확인해보기(DBeaver 연결도 index.ts에서 입력해준 것처럼 그대로 입력해주면 끝) DBeaver 내 PostgreSQL에 연결하는 법 - https://www.sfdccode.com/95
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
AWS 강의 내용대로 했는데 요금 청구가됩니다.
프리티어로 가입해서 강의대로 EC2 로드밸런스 S3 이런거만 했는데 소액씩 요금이 계속 청구되네요 원래 배포하는데 계속 청구 되는건가요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
section 17 useEffect 부분
const [dog, setDog] = useState(""); const res = axios.get("https://dog.ceo/api/breeds/image/random"); console.log(res.data.message); // 사진 주소 setDog(res.data.message);위 코드에서 강사님이 설명 해주실 때, res 값이 변경되고 state 값이 바뀌니까 계속 무한루프로 리렌더링이 된다고 하셨는데, 계속 state 값이 바뀌는 이유가 이 api 자체가 fetch 할 때마다 랜덤으로 사진이 바뀌는 api라서 그런 걸까요 ? ??
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
sec7 포트폴리오 질문
포트폴리오 sec7에서 게시글을 저장할 때 콘솔 창에 id를 출력해서 확인하는데, 저장한 게시글 정보를 playground에서 확인하는 방법은 무엇인가요? fetchBoard를 이용해서 찾아보려 했는데 잘 되지 않아요ㅜ 그리고 _id 말고 number이나 message 정보는 콘솔창에 출력할 수 없나요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
리코일스테이트 사용후 문제점
codecamp 폴더 안에 각각 class폴더와 퀴즈, 프리보드 폴더를 사용중입니다. 그리고 수업내용에 따라 useRecoilState를 만들어놓고 각각 사용중인데, 수업을 따라하다보니 리코일스테이트의 네이밍이 isEditState, accessTokenState 이런식으로 다 같아서 혹시나 그것때문에 오류가 발생하나 싶어서 이름을 각각 다 변경해 보았지만 터미널에의 오류메세지는 계속 발생하네요. 이 부분은 무엇이 잘못되어서 이런 메세지가 뜨는 것인가요? 그리고 이 메세지를 안뜨게 하는 방법이 있을까요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
15 페이지네이션 에러
저기서 자꾸 저런 에러가 뜨는데 어떻게 해결해야 할까요 ㅠㅠ타입을 바꿔봐도 똑같습니다 정확한 오류 메시지는{ page: number; } 형식의 인수는 'Partial<IQueryFetchBoardArgs>' 형식의 매개 변수에 할당될 수 없습니다. 개체 리터럴은 알려진 속성만 지정할 수 있으며 'Partial<IQueryFetchBoardArgs>' 형식에 'page'가 없습니다.입니다 !
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
CSS 선택자 id
수업에서 CSS 선택자의 id 같은 경우 한 html에서 하나만 사용가능하다고 하셨는데 boxmodel 실습에서는 다음과 같이 id를 두 번 사용했더라고요. 상관없는걸까요? <!DOCTYPE html> <html lang="ko"> <head> <title>Document</title> <style> div { width: 80px; height: 80px; border: 1px solid red; } #contentBox { box-sizing: content-box; } #borderBox { box-sizing: border-box; } </style> </head> <body> <!-- 컨텐트박스 --> <div id="contentBox">박스1</div> <!-- 기본박스 --> <div>박스2</div> <!-- 보더박스 --> <div id="borderBox">박스3</div> </body> </html>
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
typescript 관련 에러
제가 실습파일을 다시 만들었었는데 리액트 버전 낮추는 명령어를 치지 않고 하다가 section 13에서 antd design 관련 실습 하면서 강사님이랑 조금씩 다른 부분이 보이고, yarn dev 해도 실행이 안되어서 버전 문제라고 생각하고 중간에 버전을 낮췄거든요 ..!근데 아래처럼 '--jsx' 플래그를 제공하지 않으면 JSX를 사용할 수 없습니다. 라는 에러 메시지가 계속 뜨고 구글링해서 방법을 찾아보는데 하라는 거 해봐도 없어지지 않아요 ㅠㅠ타입스크립트를 재설치 해봐도 package.json에 dev-defendencies 항목이 생기지도 않고, tsconfig.js 파일을 삭제했다가 다시 타입스크립트 재설치 후 yarn dev 해도 변화가 없더라구요 !그래서 강사님 tsconfig와 같은 내용을 직접 작성해서 새로고침 해봤는데도 자꾸 에러가 그대로라서 ㅠㅠ 혹시 어떤 부분이 문제일까요 ㅠㅠㅠㅠ
- 미해결[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
10-04 graphql-codegen 오류 질문
안녕하세요 선생님!라우터를 통해 얻은 정보를 숫자 타입으로 바꾸어 쿼리를 전달하는 과정에서, 코드젠을 통한 타입을 강의와 같이 작성했는데, 아래와 같이 오류가 뜹니다. number 형식도 맞고 철자 오류도 없는데, 뭐가 문제인지 잘 모르겠습니다.
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
타입스크립트 작동 안됨
안녕하세요! 강의 잘 듣고 있습니다. 10-TS 기초 강의를 듣고 TS 설치를 완료했는데, 저는 componemt의 타입을 지정하라는 등의 오류가 실행되지 않습니다. 콘솔 창에서는 별다른 에러 없이 잘 설치되었는데도요. yarn dev를 막 끝내고 _app.js를 tsx로 변경하니터미널 콘솔에는 이렇게 뜹니다. PS C:\Users\Yun\Desktop\frontEnd\class> yarn devyarn run v1.22.21$ next devready - started server on 0.0.0.0:3000, url: http://localhost:3000We detected TypeScript in your project and created a tsconfig.json file for you.event - compiled client and server successfully in 4.7s (388 modules)wait - compiling...event - compiled client and server successfully in 321 ms (388 modules)wait - compiling...error - ./pages/_app.tsxError: error: Unexpected token ,. Expected yield, an identifier, [ or { |3 | export default function App({ Component : , pageProps }) {| ^Caused by:0: failed to process js file1: Syntax Errorwait - compiling...event - compiled client and server successfully in 5.7s (388 modules)wait - compiling...error - ./pages/_app.tsxError: error: Expected ',', got '}' |3 | export default function App({ Component}, pageProps }) {| ^ 뭐가 문제일까요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
강의 업데이트 질문이요~
올해는 강의 업데이트 계획이 없나요?
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
React 설치, 다운 오류 질문 드립니다 !!
리액트 설치 후 강의 수강 중인데 저렇게 자꾸 "antd"를 찾을 수 없다고 오류가 생겨서, 문제점과 해결법을 알고 싶습니다ㅜ
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
boards 수정 1편에서 useState() 초기값
이렇게 초기값을 설정 해주지 않았을 때, 하나의 항목만 수정하고 수정하기 버튼을 누르면 다른 항목들은 그 전 내용 그대로 띄워졌는데 그 이유가 궁금해요 !굳이 boards 수정 2편에서 한 방법이 아니더라도 이렇게 하면 문제가 되는 걸까요 ? 초기값을 설정 안해주면 안되는 이유가 있나요 ㅜㅜ강사님께서 그냥 여기 초기값을 "" 빈문자열로 바꾸고 다시 실행하시기만 하셔서 왜 이 방법을 쓰면 안되는지, boards 수정 2편의 방법과는 무슨 차이가 있는지 잘 모르겠습니다 ..!
- 해결됨[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스
"@ant-design/icons": "^5.0.1" 다운그레이드 하고서 error
package.json "dependencies": { "@ant-design/icons": "^5.0.1",위와 같이 수정 후 yarn.lock, node_modules 삭제 - yarn install 하여 재 설치 하여도 아래와 같이 err 문구는 사라지지 않았으며 yarn dev를 통해 웹페이지 확인 하면 정상적으로 icon은 출력됩니다.icon = 정상 출력 되나 코드상 error 문구는 삭제되지 않습니다.VS code 를 재시작 하여도code_modules 등 삭제 후 재설치 3~4번 하여도 동일합니다. yarn.lock 첨부합니다."@ant-design/icons-svg@^4.3.0": version "4.3.2" resolved "https://registry.yarnpkg.com/@ant-design/icons-svg/-/icons-svg-4.3.2.tgz#ab2e082991877fdc85b2b32f0b68628b716bad23" integrity sha512-s9WV19cXTC/Tux/XpDru/rCfPZQhGaho36B+9RrN1v5YsaKmE6dJ+fq6LQnXVBVYjzkqykEEK+1XG+SYiottTQ== "@ant-design/icons@^4.8.1": version "4.8.1" resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-4.8.1.tgz#44f6c81f609811d68d48a123eb5dcc477f8fbcb7" integrity sha512-JRAuiqllnMsiZIO8OvBOeFconprC3cnMpJ9MvXrHh+H5co9rlg8/aSHQfLf5jKKe18lUgRaIwC2pz8YxH9VuCA== dependencies: "@ant-design/colors" "^6.0.0" "@ant-design/icons-svg" "^4.3.0" "@babel/runtime" "^7.11.2" classnames "^2.2.6" lodash "^4.17.15" rc-util "^5.9.4" "@ant-design/icons@^5.0.1": version "5.2.6" resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-5.2.6.tgz#2d4a9a37f531eb2a20cebec01d6fb69cf593900d" integrity sha512-4wn0WShF43TrggskBJPRqCD0fcHbzTYjnaoskdiJrVHg86yxoZ8ZUqsXvyn4WUqehRiFKnaclOhqk9w4Ui2KVw== dependencies: "@ant-design/colors" "^7.0.0" "@ant-design/icons-svg" "^4.3.0" "@babel/runtime" "^7.11.2" classnames "^2.2.6" rc-util "^5.31.1"