묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결입문자를 위한 자바스크립트 기초 강의
고양이 api 안되서 알려주신 강아지 api 검색했는데요
이렇게 뜨는데.....안되는 건가요..?
-
해결됨[코드캠프] 훈훈한 Javascript
함수의 리턴에 대해서 질문드립니다.
함수 안에 return을 써주면 함수가 종료된다고 하셨는데,그럼 반대로 return을 써주지 않은 함수는 종료가 되지 않고 계속 실행 중인 건가요?(캡처에 있는 dateFormMaker, counterMaker 함수같이 return이 없을 경우에요)함수가 종료된 것과 종료되지 않은 것의 차이가 뭔지 잘 모르겠어요.
-
미해결처음 만난 리액트(React)
Chapter12 Calculaotr.jsx 질문
안녕하세요, 소플님. Chapter12 Calculaotr.jsx 파일에 있는섭씨, 화씨 온도 변환 코드와관련해서 문의드리고 싶은 부분이 있어 글을 남깁니다. 만약 사용자가 섭씨 온도 입력한에 섭씨 온도를 입력했다고 했을 때온도는 temperature 변수에 저장되고, 섭씨 온도를 입력했기에celsius란 변수에 저장됩니다. 또한 scale은 c 입니다. 사용자가 섭씨 온도를 입력했으니 화씨 온도로 바꿔줘야 할 차례인데이 부분부터 잘 이해가 가지 않습니다. const celsius = scale === "f" ? tryConvert(temperature, toCelsius) : temperature; 저는 위의 코드를 섭씨 온도를 화씨 온도로 바꿔주는 부분으로 이해했습니다.하지만 그러기 위해선 scale === f 로 두고, tryConvert(temperature, toCelsius) 로 두는 게 아닌 const celsius = scale === "c" ? tryConvert(temperature, toFahrenheit) : temperature;위의 코드처럼 scale을 c로 두고tryConvert(temperature, toFahrenheit) 로 바꿔줘야사용자가 입력한 섭씨 온도를 화씨 온도로 바꿔줘.가 되는 걸로 이해했습니다. scale을 c로 둔 이유는 사용자가 섭씨 온도를 입력하면온도는 temperature 변수, 그리고 celsius 변수에 저장되며celsisus 변수에 저장되면서 동시에 위의 코드에 의해 scale은 c가 되기에scale을 c로 뒀습니다. const celsius = scale === "c" ? tryConvert(temperature, toFahrenheit) : temperature; 그래서 위에처럼 코드를 작성해야섭씨 온도를 화씨 온도로 바꿔주는 거라고 생각했습니다. 혹시 제가 어떤 부분에서 잘못 생각하고 있는지 알 수 있을까요?
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
그래프와 탐색- 4. 미로탐색 시간복잡도 관련
안녕하세요 항상 좋은 강의 잘 듣고 있습니다!선생님께서 가르쳐주신 풀이 방식이 생각한대로 나름 직관적(?)이여서 다른 문제에서도 잘 사용하고 있는데 아무래도 재귀방식이다보니 시간복잡도에서 시간초과가 발생합니다. 이러한 DFS 방식에서 시간복잡도를 낮추는 방법이 있을까요?또한 선생님께서는 이러한 문제 풀때 시간복잡도 관련해서 어떻게 해결하시나요?(예를들어 다른 풀이방식을 선호한다던지.. 등등)
-
미해결비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
Axios로 API 요청시 에러
Axios로 아래와 같이 요청시 Object가 안나오고 에러가 발생합니다.에러내용은 아래와 같습니다참고로 MySQL 데이터는 아래와 같습니다.Axios dummy 테스트는 문제가 없었는데, Network Error는 뭘까요?
-
미해결실습 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 감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
메인페이지 출력 오류
안녕하세요 메인 페이지 출력이 안되어서 질문 남깁니다해당 코드와 실행결과 사진으로 첨부했습니다