월 28,600원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
함수 리턴중에 질문
function calculate(x) { var result = 3*x+5; return result; }라고 입력후 var result1 = calculate(1); 이 어떻게 동작 하는 건가요 ? 괄호를 닫았음에도 아직 저 위에 함수 블록에서 작업 중인 걸로 되는 건가요?
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
노션링크
강의에 나오는 노션 링크는 어디에서 확인할 수 있나요?
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
저도 가로 배치가 잘되다가 세로 배치가 되어 질문드립니다.
저도 강의 따라가다가 세로로 갑자기 변환되어서 답변 내용대로 해봤지만 고쳐지지를 않아서 질의 드립니다 아래 코드는 html코드입니다<html> <head> <title>그랩마켓</title> <link href="index.css" type="text/css" rel="stylesheet" /> <body> <div id="header"> <div id="header-area"> <img src="images/images/icons/logo.png"/> </div> </div> <div id="body"> <div id="banner"> <img src="images/images/banners/banner1.png"/> </div> <h1>판매되는 상품들</h1> <div id="product-list"> <div class="product-card"> <img class="product-img" src="images/images/products/basketball1.jpeg"/> <div class="product-contents"> <span class="product-name">농구공 1호</span> <span class="product-price">50000원</span> <div class="product-seller"> <img class="product-avatar" src="images/images/icons/avatar.png"/> <span>그랩</span> </div> </div> </div> </div> <div class="product-card"> <img class="product-img" src="images/images/products/keyboard1.jpg"/> <div class="product-contents"> <span class="product-name">키보드 1호</span> <span class="product-price">30000원</span> <div class="product-seller"> <img class="product-avatar" src="images/images/icons/avatar.png"/> <span>그랩</span> </div> </div> </div> <div class="product-card"></div> <div class="product-card"></div> </div> <div id="footer"></div> </body> </head> </html>아래는 css코드입니다 * { margin: 0; padding: 0; } #header{ height: 64px; display: flex; justify-content: center; border-bottom: 1px solid gray; } #body{ min-height: 100%; width: 1024px; margin: 0 auto; padding-bottom: 24px; } #footer{ height: 200px; background-color: red; } #banner{ height: 300px; background-color: yellow; } #header-area{ width: 1024px; height: 100%; display: flex; align-items: center; } #header-area > img{ width: 128px; height: 36px; } #body > h1{ margin-top: 16px; } #banner > img{ width: 100%; height: 300px; } #product-list{ display: flex; flex-wrap: wrap; margin-top: 12px; flex-direction: row; } .product-card{ width: 180px; height: 300px; margin-right: 12px; margin-bottom:12px; border: 1px solid rgb(230, 230, 230); border-radius: 12px; } .product-img{ width: 100%; height: 210px; } .product-contents{ display: flex; flex-direction: column; padding: 8px; } .product-name{ font-size: 14px; } .product-price{ font-size: 16px; font-weight: 200px; margin-top: 4px; } .product-seller{ display: flex; align-items: center; margin-top: 12px; } .product-avatar{ width: 24px; }바쁘시겠지만 답변 해주시면 감사하겠습니다!+해당 코드 진행 후 개발자 도구 이용해서 보면 flex에 의해 정해지지않은 보라색 칸이 있는데 해당 칸 처리가 힘들어 추가 질문 올립니다!
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
Fly.io 에 그랩마켓 서버 배포하기 수업 중 오류 발생
docker 관련 에러인것 같습니다.docker 관련 파트 언제 했는지 찾을 수가 없어서 수업 다시 들어 보면서 해결하지도 못하네요어떻게 손대야 할 지 모르겠습니다.
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
for반복문 안에 for반복문으로 배열 요소 뽑기
인강 한바퀴 다 듣고 이제 제 개인 프로젝트를 하나 해보고싶어 다시 들으면서 조금 변형시키면서 만드는 중입니다.객체 안에 배열을 하나 넣어뒀는데, 그것을 반복문으로 배열의 요소 만큼 태그를 생성시키고 싶어 이중for문을 사용했는데, characters의 다음요소가 들어가버려서 모양이 이상하게 됩니다.... 이렇게는 아예 못쓰는건가요?character-tag에 css를 설정해두어 없애면 안됩니다.사진이 넘치는건 overflow: hidden을 안했습니다.
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
변수 Question에 products안에 모든 price들을 볼려면 어떤코드작성해야할까요???
변수 Question에 products안에 모든 price들을 볼려면 어떤코드작성해야할까요???
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
커밋 메시지가 잘 이해 안됩니다
커밋 메시지가 뭔가요?git commit -m "project init" 에서"project init" 대신 다른 것을 써넣어도 작동하나요?"project init" 이 어떤 역할을 하는지 잘 모르겠습니다.
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
node server.js 실행 시 오류 발생
Express에서 데이터 처리하기 강의 수강 중에 생긴 오류 입니다. 이후에 포스트맨에서 body 수정 후 send 시에도 Error: connect ECONNREFUSED이 오류가 떳습니다.index.js를 실행 후에 웹 브라우저에 http://localhost:8080/products 입력하면 [{"name":"농구공","price":5000}] 이렇게 웹 화면에 뜨면서 node:events:492 thorw er;도 같이 뜨면서 서버 에러가 납니다 database.sqlite3을 vs코드 열었을 때는 위 사진처럼 뜨고sqllite로 열었을 때는 읽을 수 없다고 뜹니다
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
추가 질문
https://www.inflearn.com/questions/961239/%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8%EB%A5%BC-%EB%A7%88%EC%B9%98%EB%A9%B0-%EB%B0%B0%ED%8F%AC-%ED%8E%98%EC%9D%B4%EC%A7%80%EC%97%90%EC%84%9C-%EC%97%85%EB%A1%9C%EB%93%9C-%EC%9E%91%EB%8F%99%EC%9D%B4-%EC%95%88%EB%90%A8"프로젝트를 마치며 배포 페이지에서 업로드 작동이 안됨"이라는 제목의 질문글의 추가 질문입니다.=====================이전 질문 내용==========================================상품 업로드에 관한 이슈과정을 다 마치고, fly.io와 vercel.com을 통하여 배포한 페이지 중에서 상품 업로드가 제대로 이뤄지지 않습니다.github 주소 :https://github.com/arominddo/Inflearn_full_stack_boot_campvercel을 통해 배포된 web 어플리케이션 url :https://grab-market-client-ashen.vercel.app/ grab_market_web > src > upload > index.js에 코드 내용이 작성되어 있습니다. 배포된 페이지의 DB 초기화 문제프로젝트를 전부 마치면서, 다시 한번 fly.io에 최신 코드로 재배포를 해보고 실험을 해보았는데도, web에서 특정 상품을 업로드하거나(오류가 나지 않았을 당시), 상품 구매하기 기능을 통하여 soldout 값을 1로 바꿔줬음에도,약 5분이 지나면 DB가 배포 됐을 당시의 내용으로 계속 초기화가 됩니다.해결 방안이 궁금합니다.ex) A라는 물건 업로드 -> 5분 지남 -> 새로고침 해보면 A라는 물건이 리스트에서 삭제ex) B라는 물건 구매 하기 버튼 클릭 -> soldout 값 1로 변경 -> 약 5분 지남 -> 다시 soldout 값 0으로 복귀=================================================================================== 위와 같은 이전 질문 내용에서 1번에 해당하는 답변으로, 어떤 오류 로그가 뜨냐고 물어보셔서 여기 다시 남겨봅니다. 위 사진은 vercel을 통해 배포 된 Web에서 upload를 시도하면 나오는 오류 로그입니다. upload 시도 시에 fly.io 모니터화면에서 볼 수 있는 오류입니다.참고로, Local 환경에서 같은 코드로 npm start로 실행된 서버와 web에서는 업로드 기능이 잘 작동됩니다. 재부팅에 관련된 로그라고 생각되는 부분 캡쳐해서 보내드립니다. 이와 같은 로그가 뜨면서 배포된 서버의 내용이 배포 시점으로 돌아가는 것 같습니다.그런데 로그를 보자면 reboot라는 것이 단순히 서버를 죽였다가 다시 올리는 것으로 생각 되는데, 배포된 서버가 돌아감에 있어서 업로드 되거나 값이 변했던 내용들이 다 사라지는 것이 이해가 되지 않습니다ㅠㅠ
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
git 수업 부분 오류 발생했습니다
git remote add origin https://github.com/JIWONKIMS/grab-market-client.git git branch -M main git push -u origin main터미널에 입력했을 때 마지막 git push -u origin main 부분을 실행하면 아래 에러가 뜹니다fatal: failed to load library 'libcurl-4.dll' 에러 해결법이 뭔가요?
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
프로젝트를 마치며 배포 페이지에서 업로드 작동이 안됨
상품 업로드에 관한 이슈과정을 다 마치고, fly.io와 vercel.com을 통하여 배포한 페이지 중에서 상품 업로드가 제대로 이뤄지지 않습니다.github 주소 : https://github.com/arominddo/Inflearn_full_stack_boot_campvercel을 통해 배포된 web 어플리케이션 url :https://grab-market-client-ashen.vercel.app/ grab_market_web > src > upload > index.js에 코드 내용이 작성되어 있습니다. 배포된 페이지의 DB 초기화 문제프로젝트를 전부 마치면서, 다시 한번 fly.io에 최신 코드로 재배포를 해보고 실험을 해보았는데도, web에서 특정 상품을 업로드하거나(오류가 나지 않았을 당시), 상품 구매하기 기능을 통하여 soldout 값을 1로 바꿔줬음에도,약 5분이 지나면 DB가 배포 됐을 당시의 내용으로 계속 초기화가 됩니다.해결 방안이 궁금합니다.ex) A라는 물건 업로드 -> 5분 지남 -> 새로고침 해보면 A라는 물건이 리스트에서 삭제ex) B라는 물건 구매 하기 버튼 클릭 -> soldout 값 1로 변경 -> 약 5분 지남 -> 다시 soldout 값 0으로 복귀
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
setProducts(products); 의 작동방식을 모르겠습니다.
setProducts(products);가 products라는 state를 변경하는 거잖아요.그런데 products는 바로 위 line에서 const로 정의되었는데 setProducts(products); 의 의미가 const 정의된 products라는 변수로 state를 변경한다는 의미인가요? 만약 state가 products가 아닌 다른 것이었다면 어떻게 되는 건가요? 정확히 어떤 과정인지 이해되지 않습니다.
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
useEffect의 위치 조건을 잘 모르겠습니다.
useEffect를 setProducts(products);앞에 쓰는 것은 왜 에러인가요? 재실행하고 싶은 구간에만 써주면 되는 것이 아닌가요?
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
code EEXIST 에러가 계속 뜨는데 어떡하죠..
안녕하세요 create-react-app을 설치하고create-react-app .를 입력한 후에 계속 이 에러가 떠서 진행을 못하고 있습니다.ㅠEEXIST라는 에러코드인데요.. 일단 저는 sudo npm install -g create-react-app 코드를 이용해서 설치를 했고create-react-app -V라는 코드를 이용해서 create-react-app의 버전이 나옴을 확인해, 설치는 제대로 되었음을 확인했습니다. 그런데 create-react-app . 이 부분을 입력할 때마다 저 에러가 뜹니다.. 어떻게 해결하면 좋을까요?처음부터도 다시 깔아보고, uninstall install도 해보고 npx로도 해봤지만 잘 안됐습니다..
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
상세 페이지 구성하다 안된 수강생 입니다.캡쳐 사진 올리니 꼭좀 해결해 주세요
아무리 구글링 유튜브 찾아 봐도 알수가 없네요mock-sever 주소 크롬 주소창에 넣으면 분명히 자료가 잘 나오는데 vs코드에서 실행 하면 위에 처럼 에러가 나옵니다. 선생님 해결좀 부탁드립니다.수업을 나갈수가 없네요.
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
구매버튼 클릭 시 soldout 구현 부분(상품 블러 처리)
상품 상세 페이지에서 구매 버튼을 누르게 되면,해당 상품의 soldout값이 1로 바뀌게고 적용 완료.그 이후 자동으로 구매 버튼이 회색으로 다시 바뀌겠끔도 구현 완료 그 이후 뒷 페이지로 돌아갔을 때, 상품 목록에서 blur처리 되는 기능이 구현되지 않아 이 방법이 궁금합니다.뒤로가기 버튼을 눌렀을 때는 해당 페이지가 새로 불러와지는 로직이 아닌가요? // Main페이지 코드 import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity, Alert } from "react-native"; import React, {useEffect, useState} from "react"; import axios from "axios"; import dayjs from "dayjs" import relativeTime from "dayjs/plugin/relativeTime" import "dayjs/locale/ko" import Carousel from "react-native-reanimated-carousel" import { API_URL } from "../config/constants"; import AvatarImage from "../assets/icons/avatar.png"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function MainScreen(props) { const [products, setProducts] = useState([]); const [banners, setBanners] = useState([]); const getProduct = () => { axios .get(`${API_URL}/products`) .then((result) => { console.log(result); setProducts(result.data.products) }) .catch((error) => { console.error(error); }); } useEffect(() => { getProduct(); axios .get(`${API_URL}/banners`) .then((result) => { setBanners(result.data.banners); }) .catch((error) => { console.error(error); }) }, []); return ( <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} sliderWidth={Dimensions.get("window").width} itemWidth={Dimensions.get("window").width} itemHeight={200} renderItem={(obj) => { return ( <TouchableOpacity onPress={() => { Alert.alert("배너 클릭"); }} > <Image style={styles.bannerImage} source={{ uri: `${API_URL}/${obj.item.imageUrl}`}} resizeMode="contain" /> </TouchableOpacity> ); }} /> <Text style={styles.Headline}>판매되는 상품들</Text> <View sytle={styles.productList}> {products.map((product, index) => { return ( <TouchableOpacity onPress={() => { props.navigation.navigate("Product", { id: product.id }) }}> <View style={styles.productCard}> {product.soldout === 1 && ( <View style={styles.productBlur} /> )} <View> <Image style={styles.productImage} source={{ uri: `${API_URL}/${product.imageUrl}`, }} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text sytle={styles.productName}> {product.name} </Text> <Text sytle={styles.productPrice}> {product.price}원 </Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={AvatarImage} /> <Text style={styles.productSellerName} > {product.seller} </Text> </View> <Text style={styles.productDate}> {dayjs(product.createdAt).fromNow()} </Text> </View> </View> </View> </TouchableOpacity> ); })} </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", padding: 32, }, productCard: { width: 320, borderColor: "rgb(230,230,230)", borderWidth: 1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, productImage: { width: "100%", height: 210, }, productContents: { padding: 8, }, productSeller: { flexDirection: "row", alignItems: "center", }, productAvatar: { width: 24, height: 24, }, productFooter: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginTop: 12, }, productName: { fontSize: 16, }, productPrice: { fontSize: 18, fontWeight: "600", marginTop: 8, }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems: "center", }, Headline: { fontSize: 24, fontWeight: "800", marginBottom: 24, }, productBlur: { position: "absolute", top: 0, bottom: 0, left: 0, right: 0, backgroundColor : "#ffffffa6", zIndex: 999 }, bannerImage: { width: "90%", height: 200, }, safeAreaView: { flex: 1, backgroundColor: "#fff" } }); // Product 화면 코드 import axios from "axios"; import React, { useEffect, useState } from "react" import {Image, ActivityIndicator, StyleSheet, View, Text, TouchableOpacity, Alert, ScrollView} from "react-native" import { API_URL } from "../config/constants"; import Avatar from "../assets/icons/avatar.png" import dayjs from "dayjs" export default function ProductScreen(props){ const {id} = props.route.params; const [product, setProduct] = useState(null); const getProduct = () => { axios.get(`${API_URL}/products/${id}`) .then((result) => { console.log("product result : ", result.data); setProduct(result.data.product); }) .catch((error) => { console.error(error); }) } useEffect(() => { getProduct(); }, []); const onPressButton = () => { if(product.soldout !== 1) { axios.post(`${API_URL}/purchase/${id}`) .then((result) => { Alert.alert("구매가 완료되었습니다."); getProduct(); }) .catch((error) => { Alert.alert(`에러가 발생했습니다. ${error.message}`); }) } } if(!product){ return <ActivityIndicator /> } return ( <View style={styles.container}> <ScrollView> <View> <Image style={styles.productImage} source={{uri: `${API_URL}/${product.imageUrl}`}} resizeMode="contain" /> </View> <View style={styles.productSection}> <View style={styles.productSeller}> <Image style={styles.avatarImage} source={Avatar} /> <Text>{product.seller}</Text> </View> <View style={styles.divider} /> <View> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price} 원</Text> <Text style={styles.productDate}>{dayjs(product.createAt).format("YYYY년 MM월 DD일")}</Text> <Text style={styles.productDescription}>{product.description}</Text> </View> </View> </ScrollView> <TouchableOpacity onPress={onPressButton}> <View style={product.soldout ===1 ? styles.purchaseDisabled : styles.purchaseButton}> <Text style={styles.purchaseText}>{product.soldout === 1 ? "구매완료" : "구매하기"}</Text> </View> </TouchableOpacity> </View> ) } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff" }, productImage: { width: "100%", height: 300 }, productSeller: { flexDirection: "row", alignItems: "center" }, avatarImage: { width: 50, height: 50, }, productSection: { padding: 16 }, divider: { backgroundColor: "#e9ecef", height: 1, marginVertical: 16 }, productName: { fontSize: 20, fontWeight: "400" }, productPrice: { fontSize: 18, fontWeight: "700", marginTop: 8 }, productDate: { fontSize:14, marginTop: 4, color: "rgb(204,204,204)" }, productDescription: { marginTop : 16, fontSize: 17 }, purchaseButton: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "rgb(255,80,88)", alignItems : "center", justifyContent: "center" }, purchaseText : { color: "white", fontSize: 20, }, purchaseDisabled: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "gray", alignItems : "center", justifyContent: "center" } })
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
수업 진행중 이 그랩마켓 상세 페이지 만들던중 농구공 이미지
안녕하세요.그랩마켓 상세페이지 만들기 중에서 농구공 이미지 하고postman에서 만든 products/1 내용이 안나오기에 MOCK SEVER를 다시 생성해서 .GET에 복사 붙여 넣기를 했습니다.그랬더니 에러가 나면서 아무것도 안보이게 됐습니다.그래서 lean-all-with -java 페이지로 가서 INDEX.HTML로 에 있는 axios.get ( "https://831a8e94-7b7a-4354-9e1a-eb37becbc7ad.mock.pstmn.io/products"에 가서 보니 예전에 만들은 것들은 그대로 더군요. 그래서 이것도 지우고 새로 만든 mock주소를 넣었더니 이것도 에러가 납니디.원래 mock서버 새로 만들어서 붙여 놓으면 안되나요? 몇일동안 매달려도 안되네요.도와주세요.선생님
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
windows에서 발생하는 경로 \ 관련 문의드립니다.
"상품 업로드 기능 구현-2" 강의 중 잘 따라가다가 후반부에서 경로 문제로 인해 문의드립니다.업로드 페이지에서 업로드는 잘 되나, 업로드 후 메인 페이지에서 등록된 이미지가 나오지 않아 확인해보니 "/" 대신에 콘솔에는 캡처1과 같이 "\\" 가 나오고 DB Browser에서는 캡처2와 같이 "\"가 나옵니다. : 캡처1 입니다. : 캡처2 입니다.원인을 찾아보니 windows에서 파일 경로를 다룰 때 "\\"로 하기 때문에 생기는 문제라고 하는데요...어떻게 해결하면 좋을지 모르겠습니다.해결방법을 알려주시면 감사하겠습니다.
- 해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
import { Switch, Route } from "react-router-dom"; 모듈을 찾을수 없다고 뜹니다.
선생님 수업 따라서 열심히 따라 왔는데 여기서 막히네요.해결 좀 부탁드립니다.제가 나이가 53인데 사다리차 운전 하면서 자영업 하는데 다른길좀 가보려고 공부하는 중이거든요. 다른 분들한테는 쉬운걸 텐데 저한테는 어렵네요.구글링 해보고 네이버 도 찾아봣는데 찾을수가 없네요.이걸 해결해야 앞으로 나갈수 있을것 같은데 도와주세요.감사합니다
- 미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
main/index.js과 product/index.js에서 setProduct 관련 문의드립니다.
main/index.js 에서는setProducts(result.data.products); 로 써야하고product/index.js 에서는setProducts(result.data); 로 써야하는데두 파일에서 return문에서는 동등하게 {product.name} , {product.price} 등으로 사용됩니다. 둘의 차이를 알려주시면 감사하겠습니다.