172만명의 커뮤니티!! 함께 토론해봐요.
해결됨
[2025] 비전공자도 가능한 React Native 앱 개발 마스터클래스
안녕하세요. 15분 23초 부분 전에 화면이 잘린 것 같아 문의드려요. 그 전의 부분에서는 이렇게 썼는데 const OperatorButton = styled(NumberButton)` height: 8%; width: 13%; `; 15분 23초 이후에 갑자기 이 부분이 const OperatorButton = styled.TouchableOpacity로 바껴져 있어요. ㅠㅠ 자동변환인가여? 이해가 안돼요
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
라이브러리 불러올때 import color1 from "randomcolor"; 라이브러리 이름 정확히 적었는데 오류떠요 ㅠ
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
강의때 선생님께서 하신거처럼 npm run start 입력해도 에러떠요 그래서 node 02.js 로 실행시켰는데 이렇게해도 같은건가요? npm run start 는 왜 안되는거예요? 경로설정에 "start": "node 02.js" 추가했는데 안되요 ㅠ
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
강의때 선생님께서 하신거처럼 npm run start 입력해도 에러떠요 그래서 node 02.js 로 실행시켰는데 이렇게해도 같은건가요? npm run start 는 왜 안되는거예요? 경로설정에 "start": "node 02.js" 추가했는데 안되요 ㅠ
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
이전 강의에서 package.json에 "type": "module"을 추가한 상태이고 라이브러리를 가져올 때 사용한 문법이 ESM인 것 같은데 CJS로도 가능한지 궁금합니다.
미해결
Vue.js 끝장내기 - 실무에 필요한 모든 것
2.x <-- Vue 2로 하시는게 중요합니다. 아직 Vue 3는 상용 서비스에 적용하기에는 무리가 있습니다. 프로젝트 진행시에는 그렇게 진행할 것인데, 혹 여전히 상용서비스에 적용하기에 무리가 있는지 궁금합니다!
해결됨
웹 프론트엔드를 위한 자바스크립트 첫걸음
🚨질문 작성법 및 안내사항 질문 작성법 - 몇 섹션의 어떠한 강의에 대한 질문인지 작성해주세요. (ex. 섹션2 조건문에 대한 질문) - 질문은 최대한 구체적으로 작성해주세요. - 비슷한 질문이 올라와있는지 확인해주세요. - 코드가 포함된 질문은 아래와 같이 코드블록을 사용해주세요. console.log("hello world"); 안내사항 - 질문에 대한 답변은 보통 주말, 공휴일을 제외한 평일 오전 시간 에 답변해드립니다. BigInt에 대해서 조금더 자세하게 설명해 주실 수 있을까요?
해결됨
웹 애니메이션을 위한 GSAP 가이드 Part.03
barba.js 설정후 페이지이동시 gsap유료플러그인인 ScrollSmoother.js 사용법도 알려주실 수 있으실까요? 아무리 문서들 찾고 ai한테 질문해도 페이지이동시 스무스스크롤효과가 풀리는게 해결이 안되네요..
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
코드 관련 질문은 아래와 같이 '코드블럭' 기능을 이용해주세요! + 오류 메세지도 함께 올려주시면 좋아요 🙂 const express = require('express'); const path = require('path'); const app = express(); const PORT = 3000; app.use(express.static(path.join(__dirname, '..'))); app.get('*splat', (req, res) => { res.sendFile(path.join(__dirname, '..', 'index.html')); }); app.listen(PORT, () => { console.log(`START SERVER`); }); 서버키고 localhost:3000에 접속하면 저는 사이트에 이미지가 안나와요 예제를 잘못따라친건가 싶어서 노트 예제 복붙하고 했는데도 안보이네요 콘솔탭 보니까 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. 라고 나오는데 해결법 아시나요? ⚠ 답변은 평일 오전 10시에 순차적으로 작성해드립니다. ⚠ '질문 해결'은 답변 작성일 기준 1일 이후에 적용됩니다.
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
목소리가 시원 시원하셔서 강의가 잘들어옵니다. 다름이 아니라 document.querySelector('div.content'); 이렇게 프로그래밍 하면 만약에 같은 페이지에 새로운 div content 클래스가 추 후에 또 생성되면 생각하지 않았던 동작이 일어 날수 있지 않나요 ? id 값은 유일하니까 id 값을줘서 dom 컨트롤 하는 방식이 좋나요 ?
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
말티즈 문구 추가 하실때 textContent 사용해주셨는데 아래 3개가 다 가능한거같은데 아무거나 사용해도 되는걸까요? $type.textContent = '말티즈'; $type.innerHTML ='말티즈' $type.innerText='말티즈';
해결됨
아바타 커뮤니티앱 만들기 (React Native Expo)
❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) function EmailInput() { const { control } = useFormContext() return ( <Controller name="email" control={control} render={({ field: { onChange, value } }) => ( <InputField label="이메일" value={value} onChangeText={onChange} placeholder="이메일을 입력해주세요." /> )} /> ) } // signup 페이지 마크업 부분입니다 const signupForm = useForm<FormValues>({ defaultValues: { email: '', password: '', passwordConfirm: '' } }) async function onSubmit(data: FormValues) { console.log(data) } return ( <FormProvider {...signupForm}> <View style={styles.container}> <EmailInput /> <PasswordInput /> <PasswordConfirmInput /> </View> <FixedBottomCTA label="회원가입하기" onPress={() => { console.log('onPress::::') signupForm.handleSubmit(onSubmit) }} /> </FormProvider> ) export default function FixedBottomCTA({ label, onPress }: FixedBottomCTAProps) { const inset = useSafeAreaInsets() return ( <View style={[styles.fixed, { paddingBottom: inset.bottom || 12 }]}> <CustomButton label={label} onPress={onPress} /> </View> ) } function CustomButton({ label, size = 'large', variant = 'filled', ...props }: CustomButtonProps) { return ( <CustomPressable style={({ pressed }) => [ styles.container, styles[size], styles[variant], pressed && styles.pressed ]} {...props} > <Text style={styles[variant]}>{label}</Text> </CustomPressable> ) } export const CustomPressable = ({ children, ...props }: PressableProps) => { const pressHandlerProps = Platform.OS === "android" ? { onPressIn: props.onPress || props.onPressIn } : { onPress: props.onPress }; // console.log('pressHandlerProps:::::', pressHandlerProps) return ( <Pressable {...props} {...pressHandlerProps}>{children}</Pressable> ) } node 20v hookform 7.55v ios android 동일 증상 react-native 0.76.9v 버전입니다. 하위 버튼 컴포넌트들에서 onPress 함수만 별도 분리하여 console 찍어봐도 동작하지 않고 signupForm.handleSubmit(onSubmit) 윗부분 console 만 실행되고 있습니다 차라리 터미널에 에러 코드라도 나타나면 좋은데 아예 아무런 반응이 없어서 해결에 애를 먹고 있습니다
미해결
떠먹는 자바스크립트 비동기
동기와 비동기 개념 동기와 비동기 개념 이전 다음 봤어요 커리큘럼 질문&답변 노트 채팅 스크립트 질문&답변 제목
해결됨
한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
26분 50초 경에 메인 컨테이너가 화면 끝까지 안 내려온다는 이유로 index.css의 body에 display: flex;를 설정해주셨는데 제 화면에서는 display: flex;를 안 적어줘도 메인 컨테이너가 끝까지 내려오고 display:flex; 를 쓴 것과 안 쓴 것의 차이가 없습니다. 지금 React의 버전이 올라가서 달라진 걸까요? 노트북은 LG gram 쓰고 있습니다. display: flex; 체크 되어 있는 버전 display: flex; 체크 안 된 버전
해결됨
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
안녕하세요. promise.all([]) 자바스크립트는 병렬로 실행할수 없는데 promise.all 을 사용하면 병렬이 가능한건가요 ?
해결됨
[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
express 로 GraphQL 사용하였을 때 코드는 아래와 같습니다. const typeDefs = `#graphql input CreateBoardInput { writer: String title: String contents: String } type Mutation { createBoard(createBoardInput: CreateBoardInput!): String } `; const resolvers = { Mutation: { createBoard: (parent, args, context, info) => { ... return "게시글 등록 성공" } } 위 내용을 Nest.js - GraphQL 에 적용하였을 때 아래와 같이 구현했습니다. @Mutation(() => String) createBoard( @Args('createBoardInput') createBoardInput: CreateBoardInput, ): string { // 1. 브라우저에서 보내준 Data 확인하기 console.log(createBoardInput.writer); console.log(createBoardInput.title); console.log(createBoardInput.contents); // 2. DB접속 후, 데이터 저장 => 데이터 저장했다고 가정 // 3. DB에 저장된 결과를 브라우저에 응답(response) 주기 return '게시글 등록 성공'; } @InputType() export class CreateBoardInput { // export 추가 및 클래스 이름 변경 @Field(() => String) writer: string; @Field(() => String) title: string; @Field(() => String, { nullable: true }) contents: string; } @InputType() 데코레이터: CreateBoardInput 클래스에 @InputType() 데코레이터를 적용하여, 이 클래스가 GraphQL 스키마에서 입력 타입으로 적용되게 되는데요. InputType 데코레이터의 경우 class 파일 위에 존재해야 한다고 합니다. 지금처럼 InputType이 늘어날때마다 class 를 추가하나요? 실무에서는 어떻게 사용하나요?
미해결
포트폴리오 사이트 만들고 배포까지! : 웹 개발 입문 활용편
안녕하세요. 강의 잘 듣고 있습니다 강의 중간에 로고 이미지를 교체하시는데 Header 교안에 첨부된 이미지가 없습니다 어디서 확인할 수 있을까요?
해결됨
웹 프론트엔드를 위한 자바스크립트 첫걸음
🚨질문 작성법 및 안내사항 질문 작성법 섹션 4. Promise 객체 안녕하세요. 수강 중에 계속 헷갈려서 적어봤는데, 이게 맞나요? Promise가 resolve, reject를 콜백 함수로 사용. setTimeout에서 resolve(value+10)으로 호출. resolve는 Promise의 state를 성공? 으로 바꾸고 resolve= value+10 으로 변환 workA는 Promise를 반환 ...(객체?) .then을 통해 promise의 resolve 프로퍼티 반환? 반환된 값을 바로 매개변수 사용?(???) (resA) => {내용}; 을 콜백 함수로 이용. workA(10).then((resA) => {내용}); Promise는 미리 정의된 객체고 new Promise로 promise에 생성? 한 거죠?
해결됨
웹 애니메이션을 위한 GSAP 가이드 Part.03
섹션3. Advanced Trigger 에서 Animation Toggle(1) 강좌에서 문의드립니다. 첫번째 왼쪽에는 프로그래스 스크롤트리거를 넣었는데요, 아래 소스에서 trigger: '.scroll-content' 에서 대상을 넣을걸로 알고 있는데요, 마크업 구조상에 .scroll-content 라는 이름의 클래스명이 없는데 이건 어디서 나온걸까요 <nav class="lnb"> <div class="progress"></div> <ul> <li> <div class="dot"></div> <span>Home</span> </li> <li> <div class="dot"></div> <span>About</span> </li> <li> <div class="dot"></div> <span>Product</span> </li> <li> <div class="dot"></div> <span>Portfolio</span> </li> <li> <div class="dot"></div> <span>Contact Us</span> </li> </ul> </nav> <div id="container"> <section class="section section01"><h2>section1</h2></section> <section class="section section02"><h2>section2</h2></section> <section class="section section03"><h2>section3</h2></section> <section class="section section04"><h2>section4</h2></section> <section class="section section05"><h2>section5</h2></section> </div> ScrollTrigger.create({ trigger: '.scroll-content', start: 'top top', end: 'bottom bottom', animation: gsap.from('.progress',{scaleY:0,transformOrigin:'center top',ease:'none'}), scrub: true, })
해결됨
아바타 커뮤니티앱 만들기 (React Native Expo)
탭 설정 관련 문의 드립니다. 현재 디렉토리는 아래 이미지와 같은 구조이고, 하단의 스크립트처럼 Tab 설정에는 Home / Profile / setting 3가지가 명시 된 상태인데 이전 미션에서 작성한 mission.tsx가 하나의 탭으로 잡히고 있습니다. RN 구조상 (tabs) 디렉토리 하단에 파일들이 자동으로 탭으로 잡히는 구조인지, 별도의 설정으로 뺄 수 있는지 알수 있을까요?? export default function TabLayout() { return ( <Tabs screenOptions={{ tabBarActiveTintColor: "black", headerShown: false, }} > <Tabs.Screen name="index" options={{ title: "Home", }} /> <Tabs.Screen name="my" options={{ title: "Profile", }} /> <Tabs.Screen name="setting" options={{ title: "setting", }} /> </Tabs> ); }
