inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

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

자바스크립트 질문 드려요 ! ㅠㅠ

미해결

제 index.html에는 두개의 Click 이벤트가 들어갑니다. 1. 하나는 토글 메뉴바를 눌렀을 때 메뉴가 펼쳐지는 자바스크립트 코드이고, 2. 하나는 회원가입 버튼을 눌렀을때(Modal_btn) 로그인 모달창이 나타나게 하는 자바스크립트 코드입니ㅏㄷ. header.html에 login.html 페이지를 아래의 코드로 Load하고 header.html에서 2번 로그인 모달창 버튼을 클릭하면 자바스크립트가 실행되지 않습니다. login.html에서 2번 모달창 버튼을 실행할 경우 문제없이 자바스크립트가 실행되는데 header.html에서 실행할 경우 자바스크립트가 실행되지 않는 이유가 뭘까요.. ? 어떠한 오류는 발생하지 않습니다. 슈퍼 초보자라 예제따라하면서 공부중인데 풀리질 않네요 ㅠㅠ header.js login.js

  • javascript
전효재 댓글 0 좋아요 0 조회수 187

얕은복사 깊은 복사에 관한 얘기

미해결

웹 게임을 만들며 배우는 React

강의를 듣다가 궁금증이 생겨 여쭤봅니다. 제가 알기론 불변성을 해치지 않기 위해서는 " 깊은복사 " 를 해야한다고 알고 있습니다. 복사한 객체가 변하더라도 원본객체는 변하지 않아야 하니까요. 따라서 보여주신 예시( 전개구문을 활용; a === b ; false ) 등을 보여주신 것 또한 깊은복사 의 예시였습니다. 다만 말씀하실 때 얕은 복사 를 해야 불변성을 해치지 않는다고 하셔서, 제가 느끼기엔 의아해서 질문을 남깁니다. 혹여 제가 잘못 알고 있으면 알려주시면 감사하겠습니다. 좋은 강의 잘 듣고 있습니다. 감사합니다.

  • es6
  • javascript
  • react
  • copy
이종성 댓글 1 좋아요 0 조회수 547

map undefined 오류 질문드립니다

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

코드를 혼자 짜보려고 하는 중에 type error:cannot read property 'map' of undefined가 뜹니다. 서버쪽은 postman연동했을때 잘 뜨는데 논리 하자가 있는 것 같습니다..ㅠㅠ뭐가 문제일까요 main/index.js import " ./index.css "; import axios from " axios "; import React from " react "; import { API_URL } from " ../config/config.js "; function MainPage () { const [ products , setProducts ] = React . useState ([]) ; React . useEffect ( function () { axios . get ( `${ API_URL } /products ` ) . then ( function ( result ) { console . log ( " RESULT값: " , result ) ; const products = result . data . products ; setProducts ( products ) ; } ) . catch ( function ( error ) { console . log ( " error발생 " ) ; } ) ; }, []) ; return ( < div > < div id = " banner " > < img src = " images/banners/banner1.png " /> </ div > < h1 > 판매되는 상품들 </ h1 > < div id = " product-list " > { products . map ( function ( product , index ) { return ( < div className = " product-card " > < div > < div className = " product-contents " > < span className = " product-name " >{ product . name }</ span > < span className = " product-price " >{ product . price } 원 </ span > < div classNmae = " product-footer " > < div className = " product-seller " > < img className = " product-avatar " src = " images/icons/avatar.png " /> < span >{ product . seller }</ span > </ div > </ div > </ div > </ div > </ div > ) ; } ) } </ div > </ div > ) ; } ####App.js export default MainPage ; import " ./App.css "; import MainPageComponent from " ./main "; function App () { return < MainPageComponent /> ; } export default App ; ##server const express = require ( " express " ) ; const cors = require ( " cors " ) ; const app = express () ; const port = 7070 ; const models = require ( " ./models " ) ; app . use ( express . json ()) ; app . use ( cors ()) ; app . get ( " /products " , ( req , res ) => { models . Product . findAll ( { attributes : [ " id " , " name " , " price " , " imageUrl " , " seller " , " createdAt " ] , } ) . then ( ( result ) => { console . log ( " RESULT값 : " , result ) ; res . send ( { product : result , } ) ; } ) . catch ( ( error ) => { console . error ( " ERROR가 발생하였습니다: " , error ) ; } ) ; } ) ; app . listen (port , () => { console . log ( " 그랩 마켓의 서버가 돌아가고 있습니다. " ) ; models . sequelize . sync () . then ( () => { console . log ( " ✓ DB 연결 성공 " ) ; } ) . catch ( function ( err ) { console . error ( err ) ; console . log ( " ✗ DB 연결 에러 " ) ; process . exit () ; } ) ; } ) ;

  • 머신러닝 배워볼래요?
  • react-native
  • javascript
  • react
  • HTML/CSS
  • express
  • nodejs
  • tensorflow
댓글 2 좋아요 1 조회수 545

[MAC] create-react-app에서 permission 에러 해결책

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

질문은 아니구요. 같은 문제로 고생하시는 분들이 많아 제 방법을 공유합니다 1) root 비밀번호 설정 2) 관리자 권한으로 설치 아래는 제가 찾은 링크이니 참고하세요 root 비밀번호 설정 https://heeestorys.tistory.com/877 관리자 권한으로 설치 https://online.codingapple.com/unit/react1-install-create-react-app-npx/

  • nodejs
  • javascript
  • 머신러닝 배워볼래요?
  • react
  • HTML/CSS
  • react-native
  • tensorflow
  • express
김준영 댓글 2 좋아요 2 조회수 421

age가 숫자인지 다시 체크하는 이유

해결됨

mongoDB 기초부터 실무까지(feat. Node.js)

안녕하세요! 좋은 강의 잘 듣고 있습니다. 다름이 아니라 질문이 있어 글을 남깁니다. 이미 User.js에서 age: Number로 설정해두었기 때문에 숫자 외의 것이 들어온다면 catch문에서 제대로 에러 처리가 될 것 같은데, 따로 라우트 내에서 age가 숫자인지 아닌지를 다시 체크하는 이유가 궁금합니다. 감사합니다!

  • 데이터 엔지니어링
  • rest-api
  • mongodb
  • DBMS/RDBMS
  • javascript
  • aws
  • nodejs
김가현 댓글 1 좋아요 2 조회수 199

reduce iter인자가 없을 경우

미해결

함수형 프로그래밍과 JavaScript ES6+

이렇게 구현한 것과 주석친 부분(강의에서 코드)과는 어떤 차이가 있을까요? 이것저것 넣어보는데 잘 동작하는 것 같아서 질문 드립니다.

  • 함수형-프로그래밍
  • javascript
hello 댓글 1 좋아요 0 조회수 246

안녕하세요 제로초님 학습에관한 간단한 상담부탁드립니다.

미해결

[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문

안녕하세요 제로초님..! 부트캠프에 이제막 수료한 비전공자입니다. 다름아니라 제가 프로그래밍적인 사고능력이 부족하여 이 점을 보완하고자 제로초님 강의를 들으려고하는데, 기본적인 자바스크립트 문법은 알고있다고 생각은 합니다.. 그래서 어디서부터 사고능력을 기르기위해 강의를 들어야할지 모르겠어요.. 어디서 부터 듣는것이좋을까요? 아니면 제가 느낄때 이점에대해 약하다 싶은부분만 골라서 들어야하는것일까요 ?

  • javascript
  • javascript
이건우 댓글 2 좋아요 0 조회수 400

JAVASCRIPT에서 PROTOTYPE과 GETPROTOTYPEOF에 대해서 질문드립니다.

미해결

function ParentClass() {}; function ChildClass() {}; ChildClass.prototype = new ParentClass(); var mychild = new ChildClass(); var myparent = new ParentClass(); console.log(mychild); console.log(myparent); console.log(mychild.prototype); console.log(myparent.prototype); console.log(Object.getPrototypeOf(mychild)); console.log(Object.getPrototypeOf(myparent)); -> 위 예시에서 결과 값은 아래와 같습니다. ParentClass {} ParentClass {} undefined undefined ParentClass {} {} 1) 어떻게 console.log(mychild); 와 console.log(myparent); 의 값이 같게 나올수가 있나요....? 2) console.log(Object.getPrototypeOf(mychild));와 console.log(Object.getPrototypeOf(myparent)); 의 결과값이 각각 ChildClass()와 ParentClass();여야 하는거 아닌가요...?

  • javascript
donghyun lee 댓글 0 좋아요 0 조회수 256

노드 모듈스 파일 질문입니다.

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

저번 강의까진 노드 모듈스 파일이 없었고 갑자기 생겨서 저도 다운받으려고 create-react-app .을 했는데 사진처럼 뜹니다. web이란 폴더 안에 market_web, marker_server 두개의 폴더가 있고 market_web에 깔려있다고 다른 파일인 marker_server에 깔 수 없는건가요?

  • javascript
  • react-native
  • react
  • HTML/CSS
  • express
  • nodejs
  • 머신러닝 배워볼래요?
  • tensorflow
gakaotalk 댓글 4 좋아요 1 조회수 492

채팅구현

미해결

페이스북 클론 - full stack 웹 개발

채팅 구현을 어떻게해야되는지 모르겠습니다. 새터미널창 열어서 하나는 runserver 0:80하고, 하나는 redis-server 하는거 맞나요??? 이렇게 했을땐, 채팅이 구현이 안되네요 ㅠㅠ 도와주세요! 워크스페이스 주소: https://goor.me/mVRM9

  • linux
  • HTML/CSS
  • python
  • django
  • javascript
  • 클론코딩
응주 댓글 0 좋아요 1 조회수 262

질문드립니다!

미해결

자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)

안녕하세요 강사님! 현재 강의를 보면서 풀어본 내용과 풀이를 아래와 같이 github에 정리중인데 공개로 두어도 괜찮을까요??

  • javascript
  • 코테 준비 같이 해요!
댓글 1 좋아요 0 조회수 155

404 오류

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

product array에 설정한 값이 다 있는 걸 보면 서버가 정상적으로 돌아가는 것 같은데 위에 404에러가 뜨는 이유가 뭘까요.?

  • 머신러닝 배워볼래요?
  • HTML/CSS
  • nodejs
  • react
  • react-native
  • express
  • tensorflow
  • javascript
댓글 1 좋아요 1 조회수 380

질문과 버튼 사이에 사진을 추가하고 싶습니다.

미해결

[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기

문제 사진 버튼 이런 구성으로 만들고 싶은데 어떻게 하는지 궁금합니다. 질문과 버튼의 글씨가 바뀌는 것처럼 사진도 질문마다 바뀌고 페이드인/아웃 효과도 주고 싶습니다.

  • html
  • css
  • javascript
  • javascript
  • HTML/CSS
  • bootstrap
김재권 댓글 1 좋아요 2 조회수 219

소스코드 링크 질문 드립니다.

해결됨

[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문

안녕하세요. 강의설명에서 소스코드 링크 눌러서 받으라고 되어 있어서 다운로드를 받으려 했는데 링크가 아래와 같이 test로 들어가 있는데 다운로드 받을 수 있는 방법은 없을까요? <a href="https://test" target="_blank" rel="noopener">소스코드 링크</a>

  • javascript
praiseq 댓글 1 좋아요 0 조회수 310

리액트 네이티브는 프리티어 적용 하는법이 다른가요??

미해결

처음 배우는 리액트 네이티브

리액트에서 적용이 되던게 리액트 네이티브에서는 프리티어 적용이 안되서 혹시 리액트 네이티브는 리액트와 프리티어 적용방법이 다른가요? 이틀동안 검색해보고 적용이 안되서 여쭤봅니다 ㅠ,ㅠ 아래는 해당 코드입니다. // vscode/settings.json { " editor.defaultFormatter " : " esbenp.prettier-vscode " , " editor.tabSize " : 2 , " editor.formatOnSave " : true, " editor.codeActionsOnSave " : { " source.fixAll.eslint " : true }, " javascript.format.enable " : false, " eslint.alwaysShowStatus " : true, " files.autoSave " : " onFocusChange " } //.eslintrc { " extends " : [ " react " , " plugin:prettier/recommended " ] } //.prettierrc { " tabWidth " : 2 , " endOfLine " : " lf " , " arrowParens " : " avoid " , " singleQuote " : true } // package.json " devDependencies " : { " eslint-config-prettier " : " ^8.3.0 " , " eslint-plugin-prettier " : " ^3.4.0 " , " prettier " : " ^2.3.2 " } 이 문구 때문에 그런가요?

  • 프리티어
  • javascript
  • 리액트네이티브
  • react-native
댓글 1 좋아요 0 조회수 403

p를 1000으로 잡고 시작하신 이유가 있을까요?

미해결

자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)

function solution ( s , t ) { let answer = [] ; let cnt = 0 ; let n = s . length ; for ( let i = 0 ; i < n ; i ++ ) { if ( s [ i ] === ' e ' ) cnt = 0 ; else cnt ++; answer . push ( cnt ) ; }; for ( let i = n - 1 ; i >= 0 ; i -- ) { if ( s [ i ] === ' e ' ) cnt = 0 else cnt ++; if ( answer [ i ] > cnt ) { answer [ i ] = cnt } }; return answer ; } let str = " teachermode " ; console . log ( solution (str , ' e ' )) ; 안녕하세요 강사님! 제가 작성한 코드입니다. p를 1000으로 초기화하고 시작하는건 생각도 못했네요 ㅜㅜ 혹시 그렇게 하신 이유가 있을까요?

  • javascript
  • 코테 준비 같이 해요!
highJoon 댓글 1 좋아요 1 조회수 252

next.js sroll restoration

미해결

[리뉴얼] React로 NodeBird SNS 만들기

안녕하세요 제로초님 강의를 다 듣고 개인 프로젝트를 하고 있는 사람입니다. 궁금한게 하나 있는데 SSR 페이지로 간 후에 뒤로가기 하면 스크롤 위치가 초기화되던데 이거 막는방법이 있나요? SSR 페이지가 아니면 스크롤이 그 위치 그대로 있더라고요 항상 SSR 페이지 갔다가 뒤로가기 하면 스크롤이 최상단으로 초기화되서 그런데 혹시 막을 수 있는 방법 있을까요?ㅜ

  • next.js
  • nodejs
  • scroll
  • express
  • restoration
  • react
  • srollrestoration
  • redux
  • Next.js
junil jeong 댓글 1 좋아요 0 조회수 380

const 위치 관련 질문.

미해결

안녕하세요, 아무래도 처음하는 공부라서 굉장히 기초적인 부분에 대한 질문인것 같습니다. import { Switch , Route , Link , useHistory } from 'react-router-dom' ; import UploadPage from "./upload" ; import ProductPage from "./product" ; import { Button } from "antd" ; import { DownloadOutlined } from '@ant-design/icons' function App () { const history = useHistory (); return ( < div > < div id = "header" > < div id = "header-area" > < Link to = "/" > < img src = "/images/icons/logo.png" /> </ Link > < Button size = "large" onClick = {function (){ history . push ( '/upload' ); } } icon = { < DownloadOutlined /> } > 상품 업로드 </ Button > </ div > 위 부분에서 const history= useHistory(); 가 왜 꼭 return 구분 밖에 있어야하는지 궁금합니다. return 이 되어 표출되는 곳이 시작하기 전에 const가 정의 되야 return구분이 실행되면서 해당 const부분이 적용되야함이라고 개인적으로는 이해했으나, 정확히 집고 가야하는 부분이어야 한다고 생각해서 질문드립니다. const구분 이라 위의 부분이 작동해야하며 const라 function 안에 위치해야하는 것인지요... 아주 기본적인 부분일 수 있지만.. 워낙 백지상태로 시작하여 질의 드립니다 ㅠㅠ

  • javascript
  • reactnavtive
  • const
  • usdHistory
sg HYUN 댓글 0 좋아요 0 조회수 281

그대로 따라한것 같은데 에러가 뜨는데 확인 부탁드립니다.

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

Windows PowerShell Copyright (C) Microsoft Corporation. All rights reserved. PS D:\learn-all-with-javascript\grab-market-web> npm install -g create-react-app C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app -> C:\Users\motiongrapher\AppData\Roaming\npm\node_modules\create-react-app\index.js + create-react-app@4.0.3 added 67 packages from 25 contributors in 5.659s PS D:\learn-all-with-javascript\grab-market-web> create -react-app . 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create -react-app . + ~~~~~~ + CategoryInfo : ObjectNotFound: (create:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException create-react-app : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> create-react-app . 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app . + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> create-react-app. 름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create-react-app. + ~~~~~~~~~~~~~~~~~ + CategoryInfo : ObjectNotFound: (create-react-app.:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException PS D:\learn-all-with-javascript\grab-market-web> create-react-app . create-react-app : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\motiongrapher\AppData\Roaming\npm\create-react-app.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오. 위치 줄:1 문자:1 + create-react-app . + ~~~~~~~~~~~~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedAccess PS D:\learn-all-with-javascript\grab-market-web> npm create-react-app. Usage: npm <command> where <command> is one of: access, adduser, audit, bin, bugs, c, cache, ci, cit, clean-install, clean-install-test, completion, config, create, ddp, dedupe, deprecate, dist-tag, docs, doctor, edit, explore, fund, get, help, help-search, hook, i, init, install, install-ci-test, install-test, it, link, list, ln, login, logout, ls, org, outdated, owner, pack, ping, prefix, profile, prune, publish, rb, rebuild, repo, restart, root, run, run-script, s, se, search, set, shrinkwrap, star, uninstall, unpublish, unstar, up, update, v, version, view, whoami npm <command> -h quick help on <command> npm -l display full usage info npm help <term> search for help on <term> npm help npm involved overview Specify configs in the ini-formatted file: C:\Users\motiongrapher\.npmrc or on the command line via: npm <command> --key value Config info can be viewed via: npm help config npm@6.14.13 C:\Program Files\nodejs\node_modules\npm PS D:\learn-all-with-javascript\grab-market-web> create-react-app. create-react-app. : 'create-react-app.' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이 름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 위치 줄:1 문자:1 + create-react-app. + ~~~~~~~~~~~~~~~~~ + CategoryInfo : ObjectNotFound: (create-react-app.:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException PS D:\learn-all-with-javascript\grab-market-web>

  • nodejs
  • express
  • react-native
  • react
  • HTML/CSS
  • javascript
  • tensorflow
  • 머신러닝 배워볼래요?
hackingbiz 댓글 1 좋아요 2 조회수 5423

상품 세부설명페이지에서 데이터 값 통신이 안되네요

미해결

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

main 컴포먼트에서는 잘나오는데 상품 세부 페이지 가명 아무것도 안뜨네요 포스트맨으로 http://localhost:8080/products/id 으로 값으로 똑같은 주소를 넣으면 response값은 잘 나오는데 react에서 만 이러네요

  • javascript
  • nodejs
  • react-native
  • tensorflow
  • HTML/CSS
  • 머신러닝 배워볼래요?
  • express
  • react
조은택 댓글 10 좋아요 2 조회수 630

인기 태그

인프런 TOP Writers

주간 인기글