inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

172만명의 커뮤니티!! 함께 토론해봐요.

회원가입 과제 피드백 부탁드립니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요! 회원가입 과제 피드백 부탁 드립니다! 그리고 추가적으로 궁금한 점이 있는데 figma 처럼 라디오버튼의 기본 색상을 회색으로 변경할 수 있을까요? css 파일에서 반복되어 사용되는 속성, 값들이 있는데 이런 값들은 공통적으로 사용하는 것이 구조적으로 좋을까요? 예) 아래 코드에서 .inputEmail과 .input에 설정하는 css 값들이 유사하지만 분리해서 작성 아래는 과제 관련 코드입니다! 미리 답변 감사합니다. <!DOCTYPE html> <html lang="ko"> <head> <title>회원가입</title> <link href="./02-signup.css" rel="stylesheet"> </head> <body> <div class="background"> <div class="signup"> <h2 id="title">회원 가입을 위해<br>정보를 입력해주세요<br></h2> <div> <span><br>* 이메일<br><br></span> <input class="inputEmail" type="text"> </div> <div> <span><br>* 이름<br><br></span> <input class="input" type="text"> </div> <div> <span><br>* 비밀번호<br><br></span> <input class="input" type="password"> </div> <div> <span><br>* 비밀번호 확인<br><br></span> <input class="input" type="password"> </div> <br><br> <div class="radioGender"> <div> <input type="radio" name="gender">여성 </div> <div> <input type="radio" name="gender">남성 </div> </div> <br><br> <div> <input class="agreement" type="checkbox"> 이용약관 개인정보 수집 및 이용, 마케팅 활용 선택에 모두 동의합니다. </div> <br> <hr id="line"> <br> <div> <button class="signupBtn">가입하기</button> </div> </div> </div> </body> </html> * { box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; } .background { width: 670px; height: 960px; border-radius: 20px; border: 1px solid #AACDFF; box-shadow: 7px 7px 39px 0px #0068FF40; display: flex; justify-content: center; align-items: center; } .signup { width: 470px; display: flex; flex-direction: column; } .signup span { color: #797979; } .inputEmail { width: 100%; border: none; border-bottom: 1px solid #0068FF; } .input { width: 100%; border: none; border-bottom: 1px solid #CFCFCF; } .radioGender { display: flex; justify-content: center; align-items: center; gap: 30px; accent-color: #D2D2D2; } .agreement { font-size: 14px; } .signupBtn { width: 100%; height: 75px; border-radius: 10px; border: 1px solid #0068FF; background: #FFFFFF; color: #0068FF; font-size: 18px; } #title { font-size: 32px; color: #0068FF; } #line { width: 100%; height: 1px; border: none; background-color: #E5E5E5; }

  • react
  • node.js
  • seo
  • graphql
  • next.js
hyunah10 댓글 2 좋아요 0 조회수 106

에러 어떻게 고치나요?ㅠㅠ

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

에러 어떻게 고치나요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
yoonseong 댓글 3 좋아요 0 조회수 127

codegen practice 서버 접속 불가 문제

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

yarn codegen 명령어 실행 시, ✖ Failed to load schema from http://main-practice.codebootcamp.co.kr/graphql : Unexpected response: "unconditional drop overload" 이와 같은 에러가 뜨네요. 혹시 서버가 지금 잠시 닫힌걸까요? graphql로도 접속이 안되어서 문의드립니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
댓글 2 좋아요 0 조회수 160

styled.span / styled.input "CSS 자동완성"

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

확장프로그램 설치, "vscode-styled-components" ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ import styled from에서 경로 쓸 때 백틱금지 🤬

  • react
  • node.js
  • seo
  • graphql
  • next.js
yaco kim 댓글 1 좋아요 0 조회수 63

이미지 수정시 CORS 에러 발생에 관하여

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요, 현재 이미지 업로드 및 수정 과제를 진행중에 발생한 CORS 에러에 대해 질문드립니다. 새로운 게시글의 이미지 input 데이터를 graphQL에 전송하는 것은 문제가 없습니다. 수정하는 게시글에서 이미지를 onChange를 통해 updateFile에 업데이트하는 것도 문제가 없습니다. 최종적으로 수정을 완료하는 graphQL에 통신을 하는 과정에서 다음과 같은 에러가 발생합니다. 며칠전에 같은 작업을 했을 때에는 문제가 없었던 부분이라 질문드립니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
이승엽 댓글 2 좋아요 0 조회수 96

수업 외 질문

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

수업 외 질문인데요. 시작은프리캠프 강의에서 사용된 캐릭터 움직이는 애니메이션?은 어떤 프로그램으로 만드신거에요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
코드스타크 댓글 1 좋아요 0 조회수 69

tailwind.config.ts 파일 설치가 안되는 문제

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

next js 14버전, tailwind도 3.4.17로 설치하였는데, @apply 가 먹히지 않네요. 어떻게 하나요? globals.css에도 @tailwind base; @tailwind components; @tailwind utilities; 입력 시, 'Unkown at rule @tailwind' 라는 메시지가 송출됩니다. tailwind.config.ts (js->ts 변경) 파일에도 module.exports = { content: [ "./pages/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}", "./app/**/*.{js,ts,jsx,tsx}", "./src/**/*.{js,ts,jsx,tsx}", ], theme: { extend: { colors: { background: "var(--background)", foreground: "var(--foreground)", 철수가좋아하는색깔: "blue", 영희가좋아하는색깔: "green", }, }, }, plugins: [], }; 입력했습니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
댓글 3 좋아요 0 조회수 534

모듈 버전이 안맞아서 발생하는 문제 같습니다;;;

해결됨

GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]

DISABLE_WEBSOCKETS=true meteor.bat run 을 실행했는데, 다음과 같이 발생했습니다. package.json, .meteor/packages 는 다음과 같습니다.

  • mongodb
  • apollo
  • graphql
  • svelte
이종수 댓글 2 좋아요 0 조회수 230

[30-01] 웹 에디터와 폼 라이브러리

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요 해당수업중 강의 내용대로 했는데 실행시 아래와 같이 에러 뜨고 정상 실행이 안됩니다. TypeError: react_dom_1.default.findDOMNode is not a function at ReactQuill.getEditingArea ( http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16760:43 ) at ReactQuill.instantiateEditor ( http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16631:50 ) at ReactQuill.componentDidMount ( http://localhost:3000/_next/static/chunks/node_modules_5754136c._.js:16590:14 ) at LoadableComponent ( http://localhost:3000/_next/static/chunks/_2df4111c._.js:296:57 ) at WebEditorPage ( http://localhost:3000/_next/static/chunks/_2df4111c._.js:81:215 ) at ClientPageRoot ( http://localhost:3000/_next/static/chunks/node_modules_next_dist_1a6ee436._.js:2053:50 )

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
Lia 댓글 3 좋아요 0 조회수 232

meteor 버전 때문에 실행이 안됩니다.

해결됨

GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]

node 16.13.1 meteor 2.7.4 로 설치하였습니다. This project uses Meteor 2.14, which isn't available on this platform. To work with this app on all supported platforms, use meteor update --release METEOR@3.1.2 to pin this app to the newest compatible release. 라는 에러를 받았습니다. 그래서 3.1.2로 설치 후, 다시 진행해도 똑같습니다.

  • mongodb
  • apollo
  • graphql
  • svelte
이종수 댓글 2 좋아요 0 조회수 193

graghQL의 transaction 처리속도가 궁금합니다.

해결됨

GraphQL 완전정복 (키오스크를 만들며 배우는 풀스택 과정) - [2024 부분 리뉴얼]

강의에서 graphQL은 유동적으로 서버에서 저장되어 있는 정보를 처리해서 전달해준다고 했는데, 일반적인 restAPI는 정해진 규격이 있어서 transaction에 처리가 어느 정도 감이 잡히지만, graphQL은 그렇지 않은 것 같아서요.

  • mongodb
  • apollo
  • graphql
  • svelte
이종수 댓글 2 좋아요 0 조회수 148

[18-05 게시글 이미지와 함께 등록] 타입 지정 질문드립니다

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

안녕하세요!! 강의 너무나도 잘 듣고 있습니다. 18-05 게시글 이미지와 함께 등록 23:25분에서 file에 대한 타입을 지정을 할 때 알려주신 방법 외에도 ! 를 이용해서 해결을 의도치 않게 했는데, 구글 및 스택오버플로우에도 Argument of type ' file | undefined' is not assignable to parameter of type 'File'. Type 'undefined' is not assignable to type 'File'.ts(2345) 해당 오류를 검색해보았지만 알려주신 방법들 외에는 느낌표를 사용하는 방법은 찾지 못했습니다. 이게 왜 되는건지... 도통 알수가 없네요... 이건 어떤 원리인가요?? 항상 감사드립니다.

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
이승엽 댓글 2 좋아요 0 조회수 97

npm_access_token 오류

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

npm_access_token 오류 어떻게 해결하나요 ㅠ ㅠ

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
yoonseong 댓글 2 좋아요 0 조회수 143

쿠폰 발급 관련

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

기존강의 업데이트를 지금 확인해서 쿠폰 받을 수 있을까요

  • react
  • seo
  • graphql
  • next.js
wlxo402 댓글 2 좋아요 0 조회수 195

17-03 백엔드 호스트와 포트 에러

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

강의 45:00분에 나오는 host, port, username, password 등을 따라 작성해보고, 노션에 기입된 해당 코드 역시 시도해보았지만, 다음과 같은 에러가 계속해서 발생합니다. 백엔드 프로그램을 실행합니다! 여기서 API를 만들거예요. 여기에 DB에 접속하고, 테이블을 만들 거예요. Error: connect ETIMEDOUT 34.64.244.122:5031 at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1634:16) { errno: -60, code: 'ETIMEDOUT', syscall: 'connect', address: '34.64.244.122', port: 5031 } 아래는 index.ts와, Board.postgres.ts 입니다. import { DataSource } from "typeorm" import { Board } from "./Board.postgres." console.log("백엔드 프로그램을 실행합니다!") console.log("여기서 API를 만들거예요.") // // console.log("여기에 DB에 접속하고, 테이블을 만들 거예요.") const AppDataSource = new DataSource({ type: "postgres", host: "34.64.244.122", port: 5031, username: "postgres", password: "postgres2022", database: "postgres", synchronize: true, logging: true, entities: [Board], }) AppDataSource.initialize() .then(() => { console.log("DB에 접속 성공했습니다. 동기화를 시작합니다.") }) .catch((error) => console.log(error)) import { BaseEntity, Column, Entity, PrimaryGeneratedColumn } from "typeorm" @Entity() export class Board extends BaseEntity { @PrimaryGeneratedColumn("increment") number!: number @Column({ type: "text" }) writer!: string @Column({ type: "text" }) title!: string @Column({ type: "text" }) contents!: string }

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
이승엽 댓글 2 좋아요 0 조회수 187

서버 502 error

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

백엔드 서버 키니 이렇게 나오는데 왜이런가요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
민선 댓글 2 좋아요 0 조회수 272

리액트 1강

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

선생님 수업 내용 똑같이 따라쳤는데 (바벨도 다운로드 코드도 쳤는데) 라이브서버로 실행시켰을때 (>)신택스 에러뜨면서 안녕하세요 안떠요 ㅠㅠ 리액트나 바벨 설치가 안된거 아닌가요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
H Hun 댓글 2 좋아요 0 조회수 89

Vs code 코드 저장하면 정렬 이상하게 되요!

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

이런 코드가 ctrl+s 눌러서 저장하면 이렇게 바뀌는데 가독성이 안좋아서 저장해도 가독성좋게 1줄로 하고싶은데 해결방법이 있을까요ㅠㅠ?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
H Hun 댓글 1 좋아요 0 조회수 163

input text 빈 공간 ""

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

왜 빈 공간을 " " 이렇게 나타내지 않고 "" 로 붙여서 나타내나요? 선생님께서 저번 수업때 ex) 1 산청딸기 표현할때 console.log(1+" "+산청딸기) 이런식으로 띄어쓰기는(빈공간)은 " " 가 맞지 않나요?

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
H Hun 댓글 2 좋아요 0 조회수 70

function 형식

해결됨

[코드캠프] 부트캠프에서 만든 '완벽한' 프론트엔드 코스

let time=10 setInterval(function(){console.log(time)},1000) 강의 중 setInterval에 익명함수를 집어넣는다고 하셨는데 let time=10 setInterval(let aa=function(){console.log(time)},1000) 이 코드가 맞지 않나요? 그니까 먼저 익명함수 이름부터 선언해야하지 않나요? 그리고 여기서도 위에 함수는 change라고 이름을 붙여줬는데 밑에 함수는 이름도 없이 쓰는것이 왜 그런거인지 궁금합니다!

  • react
  • react-native
  • 하이브리드-앱
  • graphql
  • next.js
H Hun 댓글 1 좋아요 0 조회수 71

인기 태그

인프런 TOP Writers

주간 인기글