webpack에서 babel-loader 사용할때 질문
미해결
프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)
babel-loader 만 webpack.config.js에 설정하면 제가 적었던 babel.config.js는 저절로 인식이되는것인가요?
- node.js
- 웹팩
- babel
- eslint
172만명의 커뮤니티!! 함께 토론해봐요.
미해결
프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)
babel-loader 만 webpack.config.js에 설정하면 제가 적었던 babel.config.js는 저절로 인식이되는것인가요?
미해결
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
deserializeUser에서 req.user에 넣을 팔로잉이랑 팔로워 찾으실 때, as는 모델 관계의 as를 따라간다고 하셨는데 왜 위 코드에서 Follwers 가 //팔로잉 이고 Followings 가 //팔로워 라고 하신 건지 모르겠습니다ㅜ 예를 들어, 저의 팔로잉을 찾으려면 제 아이디를 팔로워 아이디에서 찾아야 하니까 기준 아이디가 followerId가 되는 Followings가 맞는거 아닌가요?
해결됨
코딩테스트 [ ALL IN ONE ]
강의가 검정화면으로만 나오고 소리만 나옵니다
미해결
따라하며 배우는 노드, 리액트 시리즈 - 챗봇 사이트 만들기
포스트맨에서는 이벤트 쿼리가 답이 옵니다. http://localhost:3000/api/dialogflow/eventQuery http://localhost:5000/api/dialogflow/eventQuery 둘다 답이 옵니다. 다만 터미널과 아래 처럼 브라우저에서 인사말이 오지 않습니다. 시작하면 처음에 이벤트쿼리문이 오게 하려면 어떻게 해야하나요? 메번 감사합니다
해결됨
한 입 크기로 잘라먹는 Next.js
MetaData 라는 컴포넌트를 만들어서 Head태그를 공통화 시켜서 props로 title과 description, 그리고 image는 옵셔널로 받으려고 하는데 각 페이지들의 렌더링 방식에 영향을 미치는지 궁금합니다!
해결됨
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
프로필 수정 기능을 구현하기 위한 profileUpdate.html {% extends 'layout.html' %} {% block content %} <div class="timeline"> <form id="profile-update-form"> <!-- <div class="input-group"> <label for="join-email">이메일</label> <input id="join-email" type="email" name="email" /> </div> --> <div class="input-group"> <label for="join-nick">닉네임</label> <input id="join-nick" type="text" name="nick" /> </div> <div class="input-group"> <label for="join-password">비밀번호</label> <input id="join-password" type="password" name="password" /> </div> <button id="join-btn" type="submit" class="btn">수정</button> </form> </div> {% endblock %} {% block script %} <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script> window.onload = () => { const errorParam = new URL(location.href).searchParams.get('error'); if (errorParam) { alert(errorParam); } }; if (document.getElementById('profile-update-form')) { document.addEventListener('submit', async (event) => { event.preventDefault(); const formData = new FormData(event.target); const config = { headers: { 'content-type': 'application/json', }, }; axios .put('/profile/update', formData, config) .then((res) => { alert('프로필 정보가 수정되었습니다.'); window.location.href = '/profile'; }) .catch((error) => { alert(error); }); }); } </script> {% endblock %} 그리고 controller/page.js exports.renderProfileUpdate = (req, res, next) => { res.render('profileUpdate', { title: '내 정보 수정 - NodeBird' }); }; exports.profileUpdate = async (req, res, next) => { try { const { nick, password } = req.body; const id = req.user.id; const exUser = await User.findOne({ where: { id } }); if (!exUser) { throw new Error('존재하지 않는 사용자입니다.'); // res.status(404).send('no user'); } const sameNickUser = await User.findOne({ where: { nick, id: { [Op.ne]: exUser.id, }, }, }); if (sameNickUser) { throw new Error('중복된 닉네임입니다.'); // res.status(501).send('중복된 닉네임입니다.'); } const hash = await bcrypt.hash(password, 12); exUser.set({ nick, password: hash, }); await exUser.save(); res.status(201).send(); } catch (error) { console.error(error); next(error); } }; app.js의 에러처리 미들웨어 app.use((err, req, res, next) => { // 404 다음은 에러처리 미들웨어 console.error('에러는 ', err.message); res.locals.message = err.message; res.locals.error = process.env.NODE_ENV !== 'production' ? err : {}; // 보안상 위험(오히려 배포 시 사용자 화면에 에러를 숨김) // 에러를 로깅 서비스에 넘김 res.status(err.status | 500); res.render('error'); // views/error.html }); 일부러 중복된 닉네임을 넣어 라우터에서 에러를 발생시켰을 때, 에러처리미들웨어의 console.error('에러는 ', err.message); 부분에서 "Error: 중복된 닉네임입니다. at exports.profileUpdate (/nodestudy/nodebird/controllers/page.js:31:13) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) 에러는 중복된 닉네임입니다. PUT /profile/update 500 10.568 ms - 1862" 로 에러 메시지가 정상적으로 찍히는 것을 확인하였습니다. preview 탭에선 정상적으로 나오는 것 같은데, 실제 브라우저 화면에선 위와 같이 뜨면서 제가 원하는 에러 메시지('중복된 닉네임입니다')가 alert 창에 뜨지 않으며, error.html이 렌더링도 되지 않고 있습니다. 구글링해봐도 제가 잘 못한건지 이유를 못찾겠습니다 🥲 제가 뭘 놓친걸까요?
미해결
Airflow 마스터 클래스
json으로 데이터로 잘불러왓고 dag도 성공적으로 마쳤다고 했는데 정작 files 폴더에는 저장이 안되어 있습니다. 그래서 docker inspect로 mount 속성을 보니 { "Type": "bind", "Source": "/home/jspark9703/airflow/files", "Destination": "/opt/airflow/files", "Mode": "rw", "RW": true, "Propagation": "rprivate" } propagation이 rprivate으로 되있더군요 아마 이 속성때문에 그런거같은데... volumes 속성을 바꾸는 방법은 없을까요? 아님 다른 문제가 있는 것일까요?
해결됨
직장인에게 꼭 필요한 파이썬-아래아한글 자동화 레시피
안녕하세요? 조금씩 천천히 강의를 따라가고 있습니다 ^^ 글자속성 변경하기 챕터에서 특정 범위의 서체 변경하기를 따라 해 보고 있는데요. 빈문서를 만들고, 텍스트를 입력한 다음, 블럭을 설정하고, charshape = True를 입력하고, 실행시키면 화면에 나오는 것처럼 글자 속성이 변하지 않네요. 참고로 저는 Visual Studio Code로 작업을 하고 있습니다. 추측으로는, 열어 놓은 한글 파일에 접근할 수 있어야 하고 블럭설정한 부분을 읽어야 하는 것 같은데, 이 코드는 빠져 있는 건가요? 멋진 강의 감사합니다! ^^
미해결
[개정3판] Node.js 교과서 - 기본부터 프로젝트 실습까지
req.login를 통해 req.session에 { 랜덤값: 유저아이디} 를 저장하는 건 알겟는데, connect.sid=랜덤값 을 쿠키에 넣는 시점은 언제인가요? 그리고 서버가 connect.sid 를 세션 쿠키로 전송할 때, express-session 은 자동으로 이 값을 secret으로 서명하여 전송하나요?
미해결
프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)
new HtmlWebpackPlugin({ template: "./src/index.html", templateParameters: { env: process.env.NODE_ENV === "development" ? "(개발용)" : "" }, minify: process.env.NODE_ENV === "production" ? { collapseWhitespace: true, removeComments: true, } : false }), new CleanWebpackPlugin({ }), ...(process.env.NODE_ENV === "production" ? [new MiniCssExtractPlugin({filename: "[name].css"})] : []) ] 왜 MiniCssExtractPlugin에서는 spread operator를 쓰고 삼항연산자를 쓴 건가요? 위에 HtmlWebpackPlugin에서 한것처럼 그냥 process.env.NODE_ENV 삼항연산자를 쓰면 되는게 아닌가요? 추가적으로 spread operator를 쓴 이유를 알고 싶습니다!!
미해결
[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
npx create-react-native-app@latest 요거 터미널에 입력하니까, ⚠ This tool does not initialize new React Native projects. 뜨는데, 어떻게 해결하면 좋을까요?
해결됨
기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)
The authenticity of host ' github.com (20.200.245.247)' can't be established. ED25519 key fingerprint is SHA256:+DiY3wvvV 위와같은 문구가 뜨고 안되네요. ㅠㅠ
미해결
Next + React Query로 SNS 서비스 만들기
안녕하세요. useQuery로 가져온 data가 console로 찍어보면 두번찍히는데 왜 렌더링이 두번도는지 알 수 있을까요?
해결됨
[개정판] 파이썬 머신러닝 완벽 가이드
안녕하세요 선생님 다름이 아니라, 머신러닝 수강중 궁금한게 있어 질문드립니다 X1, X2 ,X3 ,X4 ~... Y가 있을 때 회귀예측을 진행한다고 하면 만약 타겟 Y값 목표가 100이라고 가정 했을 때 X1,X2,X3,X4들이 어느정도 값에 있는걸 추천한다 ? , 권장한다 ? 라는 분석기법도 있을까요 ? Q1) Y가 목표값이 있을 때, 각 X1~X4 범위 , 그에 따른 Y값의 신뢰구간 ㅠ 그냥 이 질문은 ML이 아니고 회귀분석 일까요 ??
미해결
프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..)
안녕하세요. eslint 강의를 듣고 있습니다. 답변해주시면 감사하겠습니다! 버전은 아래와 같습니다. "@eslint/js": "^9.9.1", "@stylistic/eslint-plugin-js": "^2.6.4", "webpack": "^5.93.0", "webpack-cli": "^5.1.4" eslint 공식홈에 no-extra-semi 사용법을 확인하면 아래와 같이 나와있습니다. https://eslint.org/docs/latest/rules/no-extra-semi#rule-details This rule was deprecated in ESLint v8.53.0. Please use the corresponding rule in @stylistic/eslint-plugin-js . 8.53.0 버전부터 deprecated가 되어서 stylistic 플러그인을 사용해서 쓰라고 되어 있습니다. 그래서 아래와 같이 설정을 했습니다. // eslint.config.js import js from "@eslint/js"; import stylisticJs from '@stylistic/eslint-plugin-js' export default [ js.configs.recommended, { plugins: { '@stylistic/js': stylisticJs, }, } ]; 그런데, no-extra-semi rule이 동작을 하지 않고 아래와 같이 rules안에 명시를 해줘야만 동작을 합니다. 플러그인만 명시하면 되는게 아니라 사용할 rule을 하나하나 명시해줘야만 하는건가요? // eslint.config.js import js from "@eslint/js"; import stylisticJs from '@stylistic/eslint-plugin-js' export default [ js.configs.recommended, { plugins: { '@stylistic/js': stylisticJs, }, rules: { "@stylistic/js/no-extra-semi": "error" } } ]; 그리고 추가적으로 궁금한 것은 deprecated 되었다고 했는데 왜 아래와 같이 eslint에서 "no-extra-semi" 를 사용할 수 있는걸까요? // eslint.config.js import js from "@eslint/js"; import stylisticJs from '@stylistic/eslint-plugin-js' export default [ js.configs.recommended, { rules: { "no-extra-semi": "error" } } ];
해결됨
워드프레스 자동 포스팅 프로그램 개발 강의 (ChatGPT API)
안녕하세요 강사님, 저는 Client 부분 부터 에러가 발생합니다 패키지들은 잘 설치 했는데, 어떤 문제인지 모르겠습니다. (전 Mac 사용 중이고, 파이썬 버젼은 3.11 씁니다) 파이썬 실행하면, 아래와 같은 에러메시지가 나옵니다. Traceback (most recent call last): File "/Users/ mati/coding /wp_auto/3.upload.py", line 14, in <module> client = Client(site_url, username, password) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/mati/coding/wp_auto/coding/wp_auto/lib/python3.11/site- package s/wordpress_xmlrpc/base.py", line 24, in ini t self.suppor ted_methods = self.server.mt.supportedMethods() ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Library/Frameworks/Python.framework/Vers ions/3.11 /lib/python3.11/xmlrpc/client.py", line 1122, in call return self.__send(self.__name, args) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Library/Frameworks/Python.framewor k/Version s/3.11/lib/python3.11/xmlrpc/client.py", line 1464, in __request response = self.__transport.request( ^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Library/Frameworks/Python.fr amework/V ersions/3.11/lib/python3.11/xmlrpc/client.py", line 1166, in request return self.single_request(host, handler, request_body, verbose) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Library/Frameworks/Pyt hon.frame work/Versions/3.11/lib/python3.11/xmlrpc/client.py", line 1179, in single_request resp = http_conn.getresponse() ^^^^^^^^^^^^^^^^^^^^^^^ File "/Library/Framew orks/Pyth on.framework/Versions/3.11/lib/python3.11/http/client.py", line 1378, in getresponse response.begin() File "/Library/Fr ameworks/ Python.framework/Versions/3.11/lib/python3.11/http/client.py", line 318, in begin version, status, reason = self._read_status() ^^^^^^^^^^^^^^^^^^^ File "/Libr ary/Frame works/Python.framework/Versions/3.11/lib/python3.11/http/client.py", line 287, in read status raise RemoteDisconnected("Remote end closed connection without" http.client.RemoteDisconnected: Remote end closed connection without response 답글 달기 수정 삭제
해결됨
세계 대회 진출자가 알려주는 코딩테스트 A to Z (with Python)
만약 강의보기전에 알고리즘 문제 풀 때, 아무것도 쓰지 못할 경우에는 일단 어떻게 접근할지 생각해본다 (한 자라도 쓸 수 없더라도) 강의를 본다. 모르는 개념이 나왔을때, 따로 공부하고 코드를 계속 외울때까지 써본다. 이런 방식으로 해도 괜찮을까요??
해결됨
직장인에게 꼭 필요한 파이썬-아래아한글 자동화 레시피
제가 모르는 것일수도 있는데_필드위치로 커서 옮기기 파트에서 수업파일은 어디에 있을까요?
미해결
파이썬/장고로 결제 시작하기 (Feat. 아임포트) - 기본편
안녕하세요. 강의 잘 듣고 있습니다. 가이드 주신대로 포트원 회원가입을 하고, 테스트 채널을 추가했습니다. PORTONE_SHOP_ID 를 변경하여 결제를 생성해도 포트원 404 에러가 발생합니다. 포트원에서 UI가 업데이트 되었습니다. 그래서 대표설정을 찾지 못하였습니다. 이 부분 같이 고민해주실 수 있을까요? https://github.com/pyhub-kr/course-django-payment-basic/tree/10c6d065e401ce6a9daa262d1906d10f2f9e69c3 여기 깃허브를 클론한 뒤 제 .env파일을 넣어서 테스트해도 포트원 404 에러가 발생합니다.
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
Context를 이용하여 props를 분리하고, onUpdate, onCreate같이 한번만 수행되는 함수들은 useMemo를 이용하여 메모이제이션을 한다고 했습니다. 아래 코드처럼요 const memoDispatch = useMemo(() => { return { onCreate, onUpdate, onDelete, }; }, []); 그런데 이전 시간에 각각의 함수를 useCallback를 통해 메모이제이션 했는데 한번 더 하는 이유가 이해 가지 않아 질문 드립니다. 아래 코드처럼 useCallback를 통해 처음 렌더링 될 때만 실행되고 이후에는 실행되지 않도록 코드를 작성 했는데 맨 위의 코드처럼 한번 더 감싼? 이유가 잘 이해가 되지 않습니다. const onCreate = useCallback((content) => { dispatch({ type: "CREATE", data: { id: idRef.current++, isDone: false, content: content, date: new Date().getTime(), }, }); }, []); const onUpdate = useCallback((targetId) => { dispatch({ type: "UPDATE", targetId: targetId, }); }, []); const onDelete = useCallback((targetId) => { dispatch({ type: "DELETE", targetId: targetId, }); }, []);