173만명의 커뮤니티!! 함께 토론해봐요.
미해결
React Native with Expo: 제로초에게 제대로 배우기
맥북 환경에서 수업을 따라가다 보니, Java가 설치되어 있지 않아 라이브러리 설치 시 오류가 발생했습니다. 이처럼 개발 환경(운영체제, 설치 여부 등)에 따라 발생하는 오류는 실무에서는 어떻게 사전에 파악하고, 배포 시에는 어떻게 대응하는지 궁금합니다.
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
강의를 통해 React의 여러 개념을 배웠습니다. 어느 정도 수준에 도달해야 리액트의 기본기를 제대로 이해했다고 스스로 판단 할 수 있을 지 궁금합니다. 예를 들어, 이 강의에서 다룬 TodoList 프로젝트를 혼자서 처음부터 끝까지 구현할 수 있는 정도라면, React의 핵심원리를 충분히 체화했다고 볼 수 있을까요 ?
미해결
[React 2부] 고급 주제와 훅
pushState로 경로를 바꿀 때는 렌더링이 다시 일어나지 않는데, popstate 이벤트에서는 왜 렌더링이 필요한 건가요
해결됨
자바스크립트로 배우는 자료구조 & 알고리즘 (개념+문제풀이)
안녕하세요. 이제 막 자료구조와 알고리즘을 알아가고 있습니다. 선생님의 강의 덕분에 천천히 음미하며 재밌게 수업을 듣고 있습니다. 혹시 이런 제게 추천할 만한 자료나 사이트가 있으실까요?
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
4.2) 첫 React App 생성하기 강의 질문 입니다. 10:15에서 module.exports = { … } 로 시작하는데 이건 cjs 시스템 문법으로 알고 있는데, 5:14에서 나오는 package.json의 type은 module로 되어있는데 두개의 시스템을 동시에 사용하는게 가능한건가요?
해결됨
DOM에서 픽셀까지, 브라우저 렌더링과 CRP 완전 정복 - [DOM 완전 정복 Part 3]
안녕하세요~! 궁금한 점이 생겨 문의드립니다! DOM + CSSOM > Render Tree를 만들기 때문에 CSS 배치에 따라 CRP에 영향을 주는 것까지는 이해했는데요! script는 async 또는 defer 속성을 알맞게 적어주기만 하면 실행 순서만 보장이 되고 안되고의 차이이고 CRP에는 영향을 주진 않는건가요?
미해결
함수형 프로그래밍과 JavaScript ES6+
안녕하세요. 추석챌린지로 수강하고있어 미션으로 질문을 남기게되었습니다. 함수형프로그래밍과 지연성 확장성… 의 중요성을 알게되긴했는데 실무에서 어떤때에 쓰일수있는지… 궁금합니다.
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
안녕하세요! 강의 너무 잘 듣고 있습니다 ㅎㅎ 21강 비동기 처리 부분에서 비동기란 무엇인지 너무 잘 알려주셔서 어느정도 이해를 했다고 생각했습니다. setTimeout을 활용해서 시간으로 생각하니까 이해가 잘 되는것 같아요! 그 다음 강의에서 Promise 라는 부분이 나오는데, const promise = new Promise() 이와 같은 생성자 함수(?)로 Promise 객체를 생성해서 사용하는 이유가 궁금합니다. 정확히는 Promise 객체가 무엇인지 잘 와닿지 않습니다 ㅠㅠ 강의를 듣다 보면 "Promise를 반환한다." 라는 말을 자주 들어볼 수 있는데, 이 말이 잘 이해가 안되고 있어서 이렇게 질문 남겨봅니다.
미해결
React Native with Expo: 제로초에게 제대로 배우기
질문은 아닌데..챌린지 미션에 질문하기가 있어서 쓰니까 신경쓰지 말아주세요... Link Share 공유 url은 components/Post.tsx에 있음 공식문서: share 부분 확인 ios에서는 url을 같이 넣어주면 좋고, 안드로이드에서는 title을 넣어주면 좋음 File Share expo-sharing 라이브러리 설치 후 사용 폰에 있는 파일을 다른 앱에 공유 가능 다른 앱에서 내 expo앱으로 공유하고 싶을 때 expo기본지원x Expo Share Extension이라는 외부 라이브러리를 따로 설치해서 사용해야 함 근데 npm run prebuild를 해야하는데, 이럼 expo-go에서 벗어나 native단을 건듦 한번 설치하면 못돌아옴
미해결
[코드팩토리] [초급] NestJS REST API 백엔드 완전 정복 마스터 클래스 - NestJS Core
Spring(Java)을 약 1~2년 정도 공부하다가, 최근 입사 후 NestJS를 새롭게 배우고 있습니다. 공부하기 위한 강의를 듣던 중 문득 궁금증이 생겨 이렇게 질문을 남깁니다. NestJS를 사용하는 이유가 무엇일까요? 제가 지금까지 배워온 관점에서 보면, Spring은 생태계가 훨씬 풍부하고 레퍼런스도 많으며, 엔터프라이즈 환경에서 안정성이 매우 높다고 느껴졌습니다. 반면 NestJS는 비동기 I/O 처리에 강점이 있어 성능적으로 빠르다는 인상을 받았지만, 단순히 그 이유만으로 NestJS를 선택해야 할까 하는 의문이 들었습니다. 물론 기술 선택에는 여러 요소가 있겠지만, 실무적으로나 기술적으로 Spring 대신 NestJS를 선택하는 명확한 이유가 무엇인지 궁금합니다. 단순 궁금증이었습니다...!
미해결
함수형 프로그래밍과 JavaScript ES6+
좋은 강의 덕분에 함수형 프로그래밍에 더 관심을 가지게 됐습니다. 😊 함수형 프로그래밍을 더 깊에 배우고 싶은데 추천해주실만한 책이나 강의가 있을까요?
미해결
TS/JS 디자인 패턴 with Canvas: 제로초에게 제대로 배우기
안녕하세요 좋은 강의 잘 듣고 있습니다 undo 기능을 따라 구현하던 중 이슈가 있어 질문 드립니다 pen mode로 그린 뒤 eraser mode에서 일부 지움 -> undo 실행 -> 화면이 모두 지워집니다 원인은 eraser mode에서 mousedown 시 ctx.globalCompositeOperation = 'destination-out' 로 바뀐 상태가 유지된 채 restore() 내부에서 drawImage() 가 실행되기 때문인 것 같은데요, 제로초님이라면 eraser mode 종료 시점 ( mouseup )에서 source-over 로 되돌리는 방식이랑 restore 에서 source-over 로 바꾼 뒤 drawImage() 하는 것 또는 제 3의 장소?? 어떤 곳에 작업하실지 여쭙고 싶습니다
해결됨
프론트엔드 마스터클래스
그 전까지는 크게 불편함이 없었는데 이번 장에 위에 설명이 건너뛰기가 돼서 놓치게 되네요. 다양한 학습자료 제공에 miro형식 파일이라고 강의 소개에 적혀있긴한데, 따로 첨부파일이나 링크는 등록이 안돼있는것 같아서요.
미해결
자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
안녕하세요 코딩테스트를 공부하고 있는 학생입니다. 코딩테스트를 공부할때 모르는 문제를 마주하면 AI를 통해서 알고리즘이나 순서에 관해 힌트를 얻는 편인데, 어떤 방식으로 공부해나가야 하는지 추천하시는 방법이 있는지 궁금합니다
미해결
한 입 크기로 잘라먹는 Next.js
안녕하세요 예를 들어서 book 디렉토리 밑에 [id.tsx] 을 만들고 /book/10?id=test 이런 형태로 넘긴다면 router.query의 값은 어떤 형태로 저장이 되나요?
해결됨
프론트엔드 빌드 시스템 완벽 가이드 - Part.1: 모듈 시스템
안녕하세요, 강의 잘 듣고 있습니다! 최근 개인 프로젝트로 래핑 라이브러리를 만들고 있고 번들러로 Rolldown을 사용하고 있습니다. 강의에서 언급된 Rollup과 구조가 유사하고 기본 개념은 거의 동일하다고 알고 있습니다. Rolldown을 사용하고 있는 상황에서 Webpack이나 Rollup의 구조를 먼저 이해하는 것이 학습에 도움이 될까요? 학습 우선순위나 접근 방식을 어떻게 잡는게 좋을지 궁금합니다.
미해결
React Native with Expo: 제로초에게 제대로 배우기
혹시 ios나 android 네이티브 빌드해서 연동하는 방법도 해당 강의에서 진행하나요? 현재 25강을 듣고 있긴 한데... 들으면 들을수록 네이티브쪽도 건들어야하는 것 같아서 질문드립니다! 혹시나 해당 강의가 포함되어있으면 몇 강인지 말씀주실 수 있으신가요? 또... 스위프트, 코틀린 말고 자바나 오브젝티브씨도 같이 알아야하나요?
미해결
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
안녕하세요, 현재 Vue 2.0을 사용하고 있으며, React로 이직을 하고자 해당 강사님의 강의를 수강하고있습니다. 혹시 현업에서도 해당 도구를 많이 사용하는지 빈도가 궁금합니다. Vue를 사용하면서는 그러지아니하다보니 이것을 알고있는게 좋은지 파악이 안된다보니 쌩뚱한 질문을 드려 죄송합니다.
미해결
React Native with Expo: 제로초에게 제대로 배우기
안녕하세요, 제로초님! 강의 잘 듣고 있습니다. 다름이 아니라 ImagePicker 로 카메라 사진 촬영 후 MediaLibrary 를 사용해서 갤러리에 저장할 때, 다음과 같은 에러가 발생합니다. 확인해보니 AUDIO 권한이 선언되지 않았다고 하는데, 아래와 같이 app.json 의 plugin 에 권한을 추가해도 동일한 에러가 발생합니다. { "expo": { // ... "plugins": [ // ... [ "expo-media-library", { "photosPermission": "Allow $(PRODUCT_NAME) to access your photos.", "savePhotosPermission": "Allow $(PRODUCT_NAME) to save photos.", "isAccessMediaLocationEnabled": true, "granularPermissions": ["audio", "photo"] } ] ], // ... } } 제로초님이 올려주신 코드를 그대로 복사 & 붙여넣기 해봐도 같은 문제가 발생하는데, 혹시 제가 놓친 부분이 있을까요...? 강의에서 다룬 부분의 코드와 package.json 첨부하겠습니다. import { FontAwesome, Ionicons } from '@expo/vector-icons'; import * as ImagePicker from 'expo-image-picker'; import * as Location from 'expo-location'; import * as MediaLibrary from 'expo-media-library'; import { useRouter } from 'expo-router'; import React, { useState } from 'react'; import { Alert, FlatList, Image, Linking, Pressable, StyleSheet, Text, TextInput, TouchableOpacity, View, } from 'react-native'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; // ... export default function Modal() { // ... const canAddThread = (threads.at(-1)?.text.trim().length ?? 0) > 0 || (threads.at(-1)?.imageUris.length ?? 0) > 0; const canPost = threads.every( thread => thread.text.trim().length > 0 || thread.imageUris.length > 0, ); const removeThread = (id: string) => { setThreads(prevThreads => prevThreads.filter(thread => thread.id !== id), ); }; const pickImage = async (id: string) => { let { status } = await ImagePicker.requestMediaLibraryPermissionsAsync(); if (status !== 'granted') { Alert.alert( 'Permission not granted', 'Please grant camera roll permission to use this feature', [ { text: 'Open settings', onPress: () => { Linking.openSettings(); }, }, { text: 'Cancel', }, ], ); return; } let result = await ImagePicker.launchImageLibraryAsync({ mediaTypes: ['images', 'livePhotos', 'videos'], allowsMultipleSelection: true, selectionLimit: 5, }); console.log('image result:', result); if (result.canceled) return; setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.concat( result.assets?.map(asset => asset.uri) ?? [], ), } : thread, ), ); }; const takePhoto = async (id: string) => { let { status } = await ImagePicker.requestCameraPermissionsAsync(); if (status !== 'granted') { Alert.alert( 'Permission not granted', 'Please grant camera permission to use this feature', [ { text: 'Open settings', onPress: () => { Linking.openSettings(); }, }, { text: 'Cancel', }, ], ); return; } let result = await ImagePicker.launchCameraAsync({ mediaTypes: ['images', 'livePhotos', 'videos'], allowsMultipleSelection: true, selectionLimit: 5, }); console.log('camera result:', result); // MediaLibrary 권한 요청 및 사진 저장 status = (await MediaLibrary.requestPermissionsAsync()).status; if (status === 'granted' && result.assets?.[0].uri) { await MediaLibrary.saveToLibraryAsync(result.assets[0].uri); } if (result.canceled) return; setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.concat( result.assets?.map(asset => asset.uri) ?? [], ), } : thread, ), ); }; const removeImageFromThread = (id: string, uriToRemove: string) => { setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.filter( uri => uri !== uriToRemove, ), } : thread, ), ); }; // ... } { "name": "expo-threads-clone", "main": "expo-router/entry", "version": "1.0.0", "scripts": { "start": "expo start", "reset-project": "node ./scripts/reset-project.js", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "lint": "expo lint" }, "dependencies": { "@expo/vector-icons": "^15.0.2", "@react-navigation/bottom-tabs": "^7.4.0", "@react-navigation/elements": "^2.6.3", "@react-navigation/native": "^7.1.8", "expo": "~54.0.12", "expo-blur": "~15.0.7", "expo-constants": "~18.0.9", "expo-dev-client": "~6.0.13", "expo-font": "~14.0.8", "expo-haptics": "~15.0.7", "expo-image": "~3.0.8", "expo-image-picker": "~17.0.8", "expo-linking": "~8.0.8", "expo-location": "~19.0.7", "expo-media-library": "~18.2.0", "expo-router": "~6.0.10", "expo-splash-screen": "~31.0.10", "expo-status-bar": "~3.0.8", "expo-symbols": "~1.0.7", "expo-system-ui": "~6.0.7", "expo-web-browser": "~15.0.8", "react": "19.1.0", "react-dom": "19.1.0", "react-native": "0.81.4", "react-native-gesture-handler": "~2.28.0", "react-native-reanimated": "~4.1.1", "react-native-safe-area-context": "~5.6.0", "react-native-screens": "~4.16.0", "react-native-web": "~0.21.0", "react-native-worklets": "0.5.1" }, "devDependencies": { "@types/react": "~19.1.0", "typescript": "~5.9.2", "eslint": "^9.25.0", "eslint-config-expo": "~10.0.0" }, "private": true }
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
강의 영상대로 코드를 작성하고, localhost:3000을 열어보니 다음과 같은 오류가 계속 뜨네요 ㅜㅠㅠ SyntaxError: Unexpected identifier 'App'. import call expects one or two arguments. 다음은 server.js 입니다 const express = require("express"); const path = require("path"); const app = express(); const PORT = 3000; //현재 탐색기에 위치한 폴더들에 서버가 접근할 수 있도록 하는 코드 //join 안에 경로 작성 app.use(express.static(path.join(__dirname, ".."))); //어떤 경로의 요청이 오던지 항상 동일한 index.html 파일을 반환할 수 있도록 코드 작성 app.get("/*splat", (req, res) => { res.sendFile(path.join(__dirname, "..", "index.html")); }); //우리가 설정한 포트번호에서 서버가 항상 요청을 듣고 있을 수 있도록 하는 코드. app.listen(PORT, () => { console.log("START SERVER"); }); 다음은 index.js 입니다 import App from "./App.js"; const $app = document.getElementById("app"); new App($app); 무엇이 문제일까요? import 경로를 계속 수정해봐도 같은 에러가 뜹니다 ㅠㅠ
