묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결실습 UI 개발로 배워보는 순수 javascript 와 VueJS 개발
git사용법을 잘 모르겠습니다..
강의를 새로 들을때마다 lite-server가 구동되지 않는데, 제가 git을 잘못 다루고 있는거 같습니다...강의 열릴때 visual스튜디오 코드 연다음에 git bash에다가git checkout -f 1-vanilla/scafoldingcd 1-vanillalite-server을 했거든요....! 어떻게 해야 이전 강의와 연결되서 lite-server구동할수 있을까요?
-
미해결함수형 프로그래밍과 JavaScript ES6+
병렬평가 질문 있습니다!
C.reduce = curry((f, acc, iter) => { log([...acc]); return iter ? reduce(f, acc, catchNoop(iter)) : reduce(f, catchNoop(acc)); });reduce에 acc를 전개연산자로 펼쳐서 전달하지 않고 이전에 하게 되면 저렇게 iterable의 값이 모두 소비된 상태로 전달 되기 때문에 reduce의 값이 undefined로 평가 되는 것일까요...?
-
미해결함수형 프로그래밍과 JavaScript ES6+
함수를 분리하지 않고 실행하게 되면 순환참조 오류가 발생합니다...
const reduce = curry((f, acc, iter) => { if (!iter) return reduce(f, head((iter = acc[Symbol.iterator]())), iter); iter = iter[Symbol.iterator](); return go1(acc, function recur(acc) { let cur; while (!(cur = iter.next()).done) { /* acc = reduceF(acc, cur.value, f); */ const a = cur.value; acc = a instanceof Promise ? a.then( (a) => f(acc, a), (e) => (e === nop ? acc : Promise.reject(e)) ) : f(acc, a); if (acc instanceof Promise) return acc.then(recur); } return acc; }); });이렇게 실행하면Uncaught (in promise) TypeError: Chaining cycle detected for promise #<Promise>위와 같이 순환참조 오류가 발생하는데 이렇게 발생하는 이유가 아래와 같은 순서로 인해 발생하는게 맞는지 확인좀 부탁드립니다...acc에 a.then메서드가 호출된 결과로 이때 pending 상태의 Promise 객체가 할당됨 a.then메서드의 콜백함수가 실행되며 1번의 pending상태의 Promise객체가 리턴 pending상태이기 때문에 settled상태가 아니며 프로미스 체이닝이 불가능 하고 프로미스를 사용 할 수 없는 무한정 대기상태에 빠짐 프로미스 다루는게 무진장 어렵다는것을 한 강의 한 강의 마다 느낍니다...
-
미해결Node.js로 웹 크롤링하기
안녕하세요! for of와 Promise.all 차이점에 관해서 질문드려요!
[제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다. 안녕하세요! 1-5 Promise.all 과 for of 문의 차이 강의 듣고 궁금한 점이 생겨서 질문드립니다!Promise.all 이 동시에 진행되어 속도가 빠른 대신 순서가 보장되지 않는다고 하셨고 for of는 순서대로 요청을 보내고 응답을 받기 때문에 속도가 좀 느리다고 하셨는데현업에서 많은 양의 데이터를 순서대로 크롤링 해야하는 경우에 Promise.all로 빠르게 크롤링 데이터를 받아와서 정렬을 하는게 나은가요 아니면 for of로 느리더라도 순서대로 데이터를 받아오는게 나은가요?
-
미해결풀스택을 위한 탄탄한 프런트엔드 부트캠프 (HTML, CSS, 바닐라 자바스크립트 + ES6) [풀스택 Part2]
reset css 에 대한 질문 드립니다.
안녕하세요. 올려주신 강의 재미있게 수강 하고 있습니다.그런데 오랫동안 궁금했던 부분이 있어서요, 가능하시다면 답변 부탁 드립니다."모던 CSS 배경 지식의 이해" 편의 8분 50초 정도부터 나오는 reset.css (css 초기화) 에 대한 내용입니다. 강사님께서는 normalize.css 의 cdn 을 사용하여 초기화 시키는 방법을 공유해주셨는데요.사실 이전까지 저는 초보자라 실전에서 사용할 경험도 없고 해서, 잘 아시겠지만 아래와 같은 방법으로 css 를 초기화 했었습니다.* { margin: 0; padding: 0; box-sizing: border-box; }그런데 normalize 를 사용해보니 위와는 다른 결과가 나오더라구요.전체 초기화는 되지 않고 margin 값 등이 남아있던데, 검색해보니 유용한 css 값들은 제거하지 않고 남겨둔다고 합니다.그런데 이 유용한 값의 기준이 무엇인지 모르겠어서 홈페이지나 깃허브에 들어가봤는데사실 못 찾았습니다. 그래서 저는 normalize css 를 사용하되, 전체 선택자로 margin 0을 주고시작하려 하는데, 이렇게 한다면 normalize css 를 사용하는 이점이 없어질까요?혹자는 reset cdn 을 사용하는 대신 전체선택자를 이용하면 브라우저 렌더링이 느려진다고하더라구요. 끝으로, 혹시 올려주신 웹 페이지 만들기 실전 프로젝트 부분 클론코딩 한 것을 개인 깃허브에 게시해도 될지 여쭙고도 싶습니다.감사합니다!
-
해결됨[코드캠프] 시작은 프리캠프
CSS 정렬 숙제
안녕하세요 선생님 수업 감사히 잘 듣고 있습니다! 다름이 아니라 숙제 진행 과정에서 질문이 생겨서 여쭤보려고 합니다!현재 진행사항은이렇게 되었고, 코드는<html><css>이렇게 작성했습니다! 근데 제목인 '회원 가입을...' 이 부분이 선생님은 왼족으로 잘 정렬이 되있는데 저는 정가운데에 와있습니다! 왜이렇게 되는지 궁금합니다!또, 전체 박스 크기도 선생님은 여유가 있는데 저는 딱 맞아 떨어집니다! 왜 이렇게 되는지, 어떻게 해결해야 할지 궁금하여 질문드립니다!
-
해결됨[코드캠프] 훈훈한 Javascript
Object.keys 에 대해서 질문 드립니다.
Object.keys(userData);console.log(Object.keys(userData));두개의 결과가 같은 이유가 뭘까요??굳이 console.log 로 찍지 않아도 결과가 찍히네요.
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
Delete 'CR' eslint 표시 없애기 공유(windows사용자)
windows에서 vscode에서 typescript를 사용하시다 보면아래와 같이 delete 'cr'이라고 계속 빨간 글씨가 떠서눈에 거슬리는 경우가 있습니다.해결책 : eslintrc.js파일에 가셔서 아래와 같이rules에 추가한 후 저장해 주시면 됩니다.긁어서 eslintrc.js파일의 하단의 rules에 추가해 주세요 'prettier/prettier': [ 'error', { endOfLine: 'auto', }, ],
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
끝장내기 수업의 로그인을 실무에서 사용해도 될까요?
현재 actions 속성을 이용한 로그인 기능 구현과 비동기 처리시 유의할 점까지 수강하였습니다.새로고침시 로그아웃 되는 부분을 해결하기 위해,쿠키를 등록해서 로그인 상태를 유지 하면,브라우저를 종료 후 재접속시에도 로그인 상태가 유지되고 보안적으로 취약하지 않을까요?그렇다고 쿠키를 사용하지 않아, 새로고침시 로그아웃이 된다면 이것 또한 적절하지 않을것 같은 생각이 드네요.끝장내기 수업을 끝까지 들었을때, 수업에서vue와 nodejs를 활용한 로그인에 대한 권장되는 처리 방법을 알수 있을까요?만약 없다면 참고할만한 자료가 있을까요?PS. 현재 인프런 vue 전체 수업중에 login 관련 가장 많은 시간이 할당되어서 선생님 커리큘럼을 패키지로 구매하였는데, 그럼에도 불구하고, 로그인 처리가 권장되는 처리가 아닌거 같고, 커리큘럼 전체를 끝까지 들어도 실무에서 바로 사용할 수 없는 코드같아, 학습 의욕이 많이 저하 되었습니다. 조언의 한말씀 부탁드립니다.
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
스택프레임 관련 질문드립니다.
안녕하세요 항상 강의 잘 듣고 있습니다.5.합이같은 부분집합 문제에서 flag 변수를 이용해서 yes가 나오면 스택에 남아 있는 함수들만 호출되고 다른 재귀호출은 없이 끝내셨는데 혹시 아래 풀이에서와 같이 for, while의 반복문에서 break를 사용하면 불필요한 재귀호출 없이 끝낼 수 있나요?아래 풀이는 프로그래머스 스킬트리 문제 풀이에서 발췌했습니다!for (let i = 0; i < skillTree.length; i++) { if ( mySkillSet.has(skillTree[i]) && skillTree[i] === mySkill[mySkillIndex] ) { mySkillIndex++; } else if (mySkillSet.has(skillTree[i])) { canSkill = false; break; } }
-
미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
권한요청드립니다
인프런 아이디 : dang7323@naver.com인프런 이메일 : dang7323@naver.com깃헙 아이디 : dang7323@naver.com깃헙 Username : dang7323권한요청 부탁드립니다! 감사합니다:)
-
미해결애플 웹사이트 인터랙션 클론!
영상 속 코드와 배포하신 소스 코드가 다르네요.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * { margin: 0; padding: 0; } body { height: 500vh; } .sample-video { position: fixed; top: 0; left: 0; width: 100%; } </style> </head> <body> <div class="container"> <!-- <video class="sample-video" src="../video/sample-low.mp4" muted></video> --> <video class="sample-video" src="../video/sample-high.mp4" muted></video> </div> <script> const videoElem = document.querySelector('.sample-video'); let videoDuration; videoElem.addEventListener('loadeddata', function() { console.log('비디오 로드 완료'); videoDuration = videoElem.duration; init(); }) let progress; let currentFrame; function init() { window.addEventListener('scroll', function () { progress = pageYOffset / (document.body.offsetHeight - window.innerHeight); console.log(progress); if (progress < 0) progress = 0; if (progress > 1) progress = 1; requestAnimationFrame(function() { videoElem.currentTime = videoElem.duration * progress; }) }); } </script> </body> </html>복붙해서 사용하세요.
-
미해결Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
포스트 목록 페이지 수정하기2 중에서 막히는 부분이 있습니다. (미분류)
안녕하세요 선생님. 강의 열심히 듣고 있습니다^^;다름이 아니라 아래와 같이 미분류 카운트가 입력되지 않아 오류가 발생하는 부분때문에 계속 찾아보았으나,답답한 마음에 질문글을 남깁니다.우선 카테고리 분류에서프로그래밍, 문화&예술 까진 카운트가 잘 입력됩니다.그렇지만 "미분류" 부분은 계속 () 으로 표시됩니다.분명 미분류 부분이 존재함에도 불구하고, 카운트가 되지 않는 건 무엇이 잘못되었는지 도저히 알기가 어렵습니다. 혹시 확인이 가능할까요?^^;; test.py 실행시 오류화면미분류() 카운트 부분을 주석처리하면 테스트는 잘 완료됩니다.총 4개의 페이지에 대한 코드를 올려봅니다.test.pybase.htmlviews.pypost_list.html test.pyfrom django.test import TestCase, Client from django.contrib.auth.models import User from bs4 import BeautifulSoup from .models import Post, Category # Create your tests here. class TestView(TestCase): def setUp(self): self.client = Client() # 방문하는 사람의 브라우저다 Client() self.user_trump = User.objects.create_user( username='trump', password='somepassword' ) self.user_obama = User.objects.create_user( username='obama', password='somepassword' ) self.category_programming = Category.objects.create( name='programming', slug='programming' ) self.category_music = Category.objects.create( name='music', slug='music' ) self.post_001 = Post.objects.create( title='첫 번째 포스트입니다.', content='Hello, world, we are the world', category=self.category_programming, author=self.user_trump, ) self.post_002 = Post.objects.create( title='두 번째 포스트입니다.', content='1등이 전부는 아니잖아요. 저는 개발을 좋아할겁니다.', category=self.category_music, author=self.user_obama, ) self.post_003 = Post.objects.create( title='세 번째 포스트입니다.', content='Category 가 없을 수도 있죠.', author=self.user_obama, ) def navbar_test(self, soup): navbar = soup.nav self.assertIn('Blog', navbar.text) self.assertIn('about_me', navbar.text) logo_btn = navbar.find('a', text='Do it Django') self.assertEqual(logo_btn.attrs['href'], '/') home_btn = navbar.find('a', text='Home') self.assertEqual(home_btn.attrs['href'], '/') blog_btn = navbar.find('a', text='Blog') self.assertEqual(blog_btn.attrs['href'], '/blog/') about_me_btn = navbar.find('a', text='about_me') self.assertEqual(about_me_btn.attrs['href'], '/about_me/') def category_card_test(self, soup): categories_card = soup.find('div', id='categories-card') self.assertIn('Categories', categories_card.text) self.assertIn( f'{self.category_programming} ({self.category_programming.post_set.count()})', categories_card.text ) self.assertIn( f'{self.category_music} ({self.category_music.post_set.count()})', categories_card.text ) self.assertIn( f'미분류 ({Post.objects.filter(category=None).count()})', categories_card.text ) def test_post_list_with_posts(self): self.assertEqual(Post.objects.count(), 3) # 1.1 포스트 목록 페이지 (post_list)를 연다. response = self.client.get('/blog/') # 1.2 정상적으로 페이지가 로드된다. self.assertEqual(response.status_code, 200) # 1.3 페이지 타이틀에 Blog 라는 문구가 있다. soup = BeautifulSoup(response.content, 'html.parser') self.assertIn('Blog', soup.title.text) self.navbar_test(soup) self.category_card_test(soup) # 3-2. 포스트 목록 페이지를 새로 고침 했을 때, response = self.client.get('/blog/') soup = BeautifulSoup(response.content, 'html.parser') # 3-3. 메인영역에 포스트 2개의 타이틀이 존재한다. main_area = soup.find('div', id='main-area') self.assertNotIn('아직 게시물이 없습니다.', main_area.text) post_001_card = main_area.find('div', id='post-1') self.assertIn(self.post_001.title, post_001_card.text) self.assertIn(self.post_001.category.name, post_001_card.text) post_002_card = main_area.find('div', id='post-2') self.assertIn(self.post_002.title, post_002_card.text) self.assertIn(self.post_002.category.name, post_002_card.text) post_003_card = main_area.find('div', id='post-3') self.assertIn(self.post_003.title, post_003_card.text) self.assertIn('미분류', post_003_card.text) self.assertIn(self.post_001.author.username.upper(), main_area.text) self.assertIn(self.post_002.author.username.upper(), main_area.text) self.assertIn(self.post_003.author.username.upper(), main_area.text) def test_post_list_without_post(self): Post.objects.all().delete() self.assertEqual(Post.objects.count(), 0) response = self.client.get('/blog/') self.assertEqual(response.status_code, 200) soup = BeautifulSoup(response.content, 'html.parser') self.navbar_test(soup) self.assertIn('Blog', soup.title.text) # 2-2. 메인영역에 "아직 게시물이 없습니다." 라는 문구가 나온다. main_area = soup.find('div', id='main-area') self.assertIn('아직 게시물이 없습니다.', main_area.text) def test_post_detail(self): self.assertEqual(Post.objects.count(), 3) # 1.2 그 포스트의 url은 '/blog/1/' 이다. self.assertEqual(self.post_001.get_absolute_url(), '/blog/1/') #.2. 첫 번째 포스트의 상세 페이지 테스트 # 2-1. 첫 번째 포스트의 url로 접근하면 정상적으로 작동한다. (status code : 200). response = self.client.get(self.post_001.get_absolute_url()) self.assertEqual(response.status_code, 200) soup = BeautifulSoup(response.content, 'html.parser') # # 2-2. 포스트 목록 페이지와 똑같은 네비게이션 바가 있다. self.navbar_test(soup) # 2-3. 첫 번째 포스트의 제목이 웹 브라우저 탭 타이틀에 들어있다. self.assertIn(self.post_001.title, soup.title.text) # 2-4. 첫 번째 포스트의 제목이 포스트 영역에 있다. main_area = soup.find('div', id='main-area') post_area = main_area.find('div', id='post-area') self.assertIn(self.post_001.title, post_area.text) # # 2-5. 첫 번째 포스트의 작성자(author)가 포스트 영역에 있다. (아직 구현할 수 없음) self.assertIn(self.user_trump.username.upper(), post_area.text) # # 2-6. 첫 번째 포스트의 내용(content)이 포스트 영역에 있다. self.assertIn(self.post_001.content, post_area.text) base.html<!DOCTYPE html> {% load static %} <html> <head> <title>{% block head_title %} Blog | 하도영 웹사이트 {% endblock %}</title> <link href="{% static 'blog/bootstrap/bootstrap.min.css' %}" rel="stylesheet" type="text/css"> <!-- <link href="./practice.css" rel="stylesheet" type="text/css"> --> <!-- 주석처리 키 ctrl + / --> <script src="https://kit.fontawesome.com/c1d4d1ab30.js" crossorigin="anonymous"></script> </head> <body> {% include 'blog/navbar.html' %} <div class="container"> <!-- 블로그 리스트 페이지 만들기 강의 5:04 blog 글자 부분 container 클래스에 의해 do it django 와 같은 간격으로 맞춰짐 --> <!-- 이 아래는 9:3, 좁을때는 8:4 로 나눌거임 --> <div class="row my-3"> <div class="col-md-8 col-lg-9", id="main-area"> {% block main_area %} {% endblock %} </div> <div class="col-md-4 col-lg-3"> <!-- Search widget--> <div class="card mb-4"> <div class="card-header">Search</div> <div class="card-body"> <div class="input-group"> <input class="form-control" type="text" placeholder="Enter search term..." aria-label="Enter search term..." aria-describedby="button-search" /> <button class="btn btn-primary" id="button-search" type="button">Go!</button> </div> </div> <!-- Categories widget--> <div class="card mb-4", id="categories-card"> <div class="card-header">Categories</div> <div class="card-body"> <div class="row"> <ul> {% for category in categories %} <li> <a href="#!">{{ category.name }} ({{ category.post_set.count }})</a> </li> {% endfor %} <!-- views.py 에 def get_context_data(self, **kwargs): 를 참고한다. --> <li> <a href="#!">미분류 ({{ no_category_post.count }})</a> </li> </ul> </div> </div> </div> </div> </div> </div> {% include 'blog/footer.html' %} <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> </body> </html> views.pyfrom django.shortcuts import render from django.views.generic import ListView, DetailView from .models import Post, Category class PostList(ListView): model = Post # template_name = 'blog/post_list.html' ordering = '-pk' def get_context_data(self, **kwargs): context = super(PostList, self).get_context_data() context['categories'] = Category.objects.all() context['no_category_post.count'] = Post.objects.filter(category=None).count() # 미분류인 애들이 몇개인지 확인한다. filter기능을 이용해 none 인 애를 확인하고 count() 에 숫자를 담아 no_category_post.count에 넣어준다. return context class PostDetail(DetailView): model = Post template_name = 'blog/post_detail.html' # def index(request): # posts = Post.objects.all().order_by('-pk') # # pk는 순서대로 -pk 는 역순으로 최신 쓰레드가 위로 나오도록 조회 # return render( # request, # 'blog/index.html', # { # 'posts': posts, # } # ) # def single_post_page(request, pk): # post = Post.objects.get(pk=pk) # # return render( # request, # 'blog/single_page.html', # { # 'post': post, # } # ) post_list.html{% extends 'blog/base.html' %} {% block main_area %} <h1> Blog </h1> {% if post_list.exists %} {% for p in post_list %} <!-- Blog Post --> <div class="card mb-4", id="post-{{ p.id }}"> {% if p.head_image %} <img class="card-img-top" src="{{ p.head_image.url}}" alt="{{ p.title }}" /> {% else %} <img class="card-img-top" src="https://picsum.photos/seed/{{ p.id }}/600/200" alt="{{ p.title }}" /> {% endif %} <div class="card-body"> <!-- <div class="small text-muted">January 1, 2022</div>--> {% if p.category %} <span class="badge badge-secondary float-right">{{ p.category }} </span> {% else %} <span class="badge badge-secondary float-right">미분류</span> {% endif %} <h2 class="card-title h4">{{ p.title }}</h2> {% if p.hook_text %} <h5 class="text-muted">{{ p.hook_text }}</h5> {% endif %} <p class="card-text">{{ p.content | truncatewords:45 }}</p> <a href="{{ p.get_absolute_url }}" class="btn btn-primary">Read more →</a> </div> <div class="card-footer text-muted"> Posted on {{ p.created_at }} by <a href="#">{{ p.author | upper }}</a> </div> </div> {% endfor %} {% else %} <h1> 아직 게시물이 없습니다. </h1> {% endif %} <!-- Pagination--> <ul class="pagination justify-content-center my-4"> <li class="page-item"> <a class="page-link" href="#!">← Older</a> </li> <li class="page-item disabled"> <a class="page-link" href="#!">Newer →</a> </li> </ul> {% endblock %}
-
미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
권한 요청드립니다!
인프런 아이디: skatkd7571인프런 이메일: skatkd7571@naver.com깃헙 이메일: skatkd7571@naver.com깃헙 아이디: applevalley 감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
메인페이지 출력 오류
안녕하세요 메인 페이지 출력이 안되어서 질문 남깁니다해당 코드와 실행결과 사진으로 첨부했습니다
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
조언 부탁드립니다. mini-project
현재 puppeteer-crawling해서스타벅스메뉴와 이미지는 잘 긁어 왔는데요.자꾸 MongoDB에 저장되어 있는 img를 불러올 때 에러가 발생하는데, 성공하신 분 있나요?스키마에서 이미지 형식을 Buffer했습니다.import mongoose from "mongoose"; const StarbucksSchema = new mongoose.Schema({ name: String, img: Buffer, }); export const Starbucks = mongoose.model("Starbucks", StarbucksSchema); //이미지 URL로부터 이미지 다운로드 if (!fs.existsSync("img_crawling")) { fs.mkdirSync("img_crawling"); } let fileName = `img_crawling/${menuName}.jpg`; request(menuImage).pipe(fs.createWriteStream(fileName)); console.log(`이미지 ${fileName} 저장 완료`); 저는 fs모듈과 request모듈을 추가로 사용했는데,이미지의 주소를 MongDB에 저장하고,이미지는 별도의 폴더에 저장되게 만들었습니다.질문 요약1. MongDB에 이미지 저장할 때 fs라이브러리와 request라이브러리를 사용하게 맞나요?2. 이미지를 저장은 잘 됐는데, 화면에 뿌려 줄려고 하는데 자꾸 에러가 나요.3.몽고DB에 접속해서 이미지 주소를 가져와서, 그 주소를 기반으로 뿌려줘야 되는지4.아니면 몽고DB에 접속해서 그 메타주소(?)를 기반으로 현재 컴퓨터에 저장된 이미지를 화면에 뿌려줘야 하는지자꾸 구글링하면 몽고DB에 이미지파일을 직접적으로저장하는 것은 DB에 무리를 일으킨다. 그래서 어떠한라이브러리를 사용해서 DB에는 메타주소(?)만을 저장하고,이미지파일을 별도의 localStorage에 저장한다.또한 이미지를 그냥 가져(load) 올 수 없어서 인코딩을 해줘야 한다. 뭔 말인지 모르겠어요 ㅠ.ㅠ
-
미해결몇 줄로 끝내는 인터랙티브 웹 개발 노하우 [초급편]
배경질문
배경을 색 대신에 이미지 넣을 수 있는거죠?
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
질문 드립니다.
BFS에서 queue 배열 활용 할 때, shift로만 처리하시던데,pop을 사용하면 어떤 차이가 있을까요???단순히 해당 Level에서 처리하는 순서만 달라지지, 층 먼저 탐색한다는 BFS 개념에 위배되지는 않다고 생각해도 맞을까요?
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
노션 섹션3 미니프로젝트 제공 프론트엔드
스타벅스 미니프로젝트 프론트엔드 소스의 회원가입, 메뉴조회 등 HTML 모달창을 띄우면 잠시 보여진 후 모달창이 사라집니다. Js의 CloseModal()의 내용을 전부 주석처리해도 마찬가지입니다. 브라우저 개발자 도구의 네트워크에서 확인해보니까 일정 시간 간격으로 리소스를 다시 불러오는 것 같이 보였습니다.VS code의 Open with live server를 통해 크롬으로 실행시켰으며 회원가입 모달창을 유지하려면 어떻게 해야하는지 코멘트해주시면 감사하겠습니다.
-
해결됨[코드캠프] 시작은 프리캠프
반복문 강의 예제 질문
안녕하세요.반복문 강의 예제를 복습하다가 궁금한 점이 생겨서 질문 남깁니다.나이를 12살에서 5살로 바꿔서 해봤는데, 어린이입니다가 뜨지 않고 에러 메세지가 뜨는데왜그런건지 모르겠습니다 ㅠㅠ
