전체 글
-
39일차 - 장고 프로젝트 (3)AI 솔루션 개발자과정(Java, Python) 2022. 12. 1. 18:54
포스트 목록 페이지 테스트 테스트 코드 작성은 만들고자 하는 코드의 내용을 정리하는 것부터 시작하는게 좋다. 포스트 목록 페이지는 앞에서 이미 만들었지만 아직 만들지 않았다 가정하고 테스트 코드를 만들어 보자. 처음에 만들려고 했던 포스트 목록 페이지의 디자인은 맨 위에 내비게이션 바가 있고, 그 아래는 포스트 목록이 있다. 옆에는 검색창과 카테고리가, 포스트 목록에는 제목과 작성일 등이 정리되어 나타난다. blog/tests.py 에는 이런 형식으로 테스트 코드를 작성할 것이다. 모두 작성하면 이런식의 코드가 된다. 1.1 사용자가 블로그에 접속했을 때, 열리는 웹 페이지 정보를 response에 저장한다. 1.2 정상적으로 열렸다면 status_code의 값으로 200이, 웹페이지를 찾을 수 없을 때..
-
38일차 - 장고 프로젝트 (2)AI 솔루션 개발자과정(Java, Python) 2022. 11. 30. 17:06
부트스트랩 : 디자인 툴킷 => CSS + JS 라이브러리 장고 : 파이썬 기반의 웹 프레임워크 웹 프레임워크 : 웹 사이트를 쉽게 만들기 위해서 짜놓은 틀 - 데이터베이스와의 연계 - 서버 프로그램의 동작 구현(서버 앱) - 사용자에게 제공할 화면 구현(프런트엔트 사이드) - 서버 호스팅 CBV로 페이지 만들기 CBV형식을 사용하면 장고는 웹 개발할 때 사람들이 반복해서 사용하는 기능들을 클래스 형태로 제공한다. 여러 포스트를 나열할 때는 ListView 클래스를 활용한다. blog/views.py 에서 기존에 작성한 index함수를 주석처리하고, import문과 클래스선언 2줄만 작성하면 index함수를 대체할 수 있다. blog/urls.py 에서도 index함수를 호출했기 때문에 주석처리하고 변경..
-
37일차 - 장고 프로젝트AI 솔루션 개발자과정(Java, Python) 2022. 11. 29. 17:42
프런트엔드와 백엔드 간단한 웹 사이트는 백엔드 없이 프런트엔드만으로 간략하게 개발하고 운영하기도 한다. 이전에 HTML, CSS, 자바스크립트만으로 만들었던 페이지도 프런트엔드만으로 구성된 웹 사이트이다. 이러한 웹 사이트는 단순하기 때문에 개발하기 쉽다는 장점이 있다. 그러나 웹 사이트 운영자가 일방적으로 정보만 제공하는 기능을 할 뿐, 사용자의 행동을 저장하고 보여줄 수 없다는 한계가 존재한다. 그래서 대부분의 웹 사이트는 데이터베이스를 활용한다. 데이터베이스를 활용하면 사용자 계정, 사용자들의 게시글과 댓글, 조회수, 추천수 같은 정보를 수시로 저장할 수 있다. 또한 HTML에 빈 칸이 있는 템플릿을 만들어 놓고, 필요한 정보를 데이터베이스에서 수시로 불러와서 보여줄 수 있다. 이러한 기능을 고려한..
-
36일차 - 장고 + 부트스트랩 파이썬 웹 개발AI 솔루션 개발자과정(Java, Python) 2022. 11. 28. 17:59
앞으로 공부할 책은 장고+ 부트스트랩 파이썬 웹 개발의 정석이다. 이 책에서 만들며 배우는 웹 사이트에서는 실제로 이용하는 사이트처럼 다음과 같은 기능이 있다고 한다. 기능 1. 회원가입을 할 수 있다. 기능 2. 댓글을 작성하고, 수정하고, 삭제할 수 있다. 기능 3. 게시글을 검색할 수 있다. 기능 4. 스태프 권한이 있는 사람은 블로그 글을 쓸 수 있도록 사용자 권한 설정이 가능하다. 기능 5. 복잡한 가입 절차가 필요 없도록 소셜 로그인 기능을 제공한다. 기능 6. 인터넷 상에서 실제로 접속 가능하다. 기능 7. 보안을 위해 HTTPS 인증을 받는다. 장고 웹 프레임워크 알아보기 웹 사이트는 다음과 같이 작동한다. 사용자(클라이언트)는 서버에 요청(request)를 보낸다. => 웹 브라우저에 웹..
-
-
34일차 - 리액트 입문 (1), 불변성AI 솔루션 개발자과정(Java, Python) 2022. 11. 24. 17:58
props props 는 properties 의 줄임말이다. 우리가 어떠한 값을 컴포넌트에게 전달해줘야 할 때, props 를 사용한다. props 의 기본 사용법 App 컴포넌트에서 Hello 컴포넌트를 사용 할 때 {name} 이라는 값을 전달하려면 다음과 같이 작성한다. Hello.js에서 Hello 컴포넌트의 매개변수를 props로 지정한다. props는 객체 형태이며, name을 조회하려면 {props.name}을 지정해 주면 된다. 여기에 color값을 지정하여 폰트 색상을 변경하려면 다음과 같이 추가한다. 속성이 추가될 때마다 props를 입력하여 조회를 하는데, 함수의 파라미터에서 비구조화 할당(구조 분해)문법을 사용하면 조금 더 코드를 간결하게 작성 할 수 있다. defaultProps ..
-
33일차 - node.js(2) 그리고 리액트(JSX 규칙)AI 솔루션 개발자과정(Java, Python) 2022. 11. 23. 17:26
요청 처리하기 post 서버에 요청을 보내어 작업을 수행한다. 서버에 있는 데이터를 추가/수정/삭제한 후에 응답을 받아낸다. 서버의 정보를 ‘조작하겠다’는 성격의 요청이다. url에 매개변수를 추가하지 않는다. post 요청을 처리할 때는 body-parser 모듈을 이용해 요청을 읽어 들인다. = > body-parser는 추가 설치 없이 사용 가능한 기본 모듈이다. 라우팅 라우팅(routing)은 어떤 네트워크 안에서 통신 데이터를 보낼 때 최적의 경로를 선택하는 과정이다. 쉽게 말해, 경로에 따라 적절한 데이터를 전송할 수 있도록 하는 것이 라우팅이다. 아래는 웹에서 라우팅이 필요한 예이다. 네이버 금융 국내증시 : https://finance.naver.com/sise/ 네이버 금융 해외증시 : ..
-
32일차 - node.jsAI 솔루션 개발자과정(Java, Python) 2022. 11. 22. 17:17
리액트js : 프론트엔드 라이브러리 노드js : 리액트 어플리케이션을 동작시키는 환경 노드js 에서 주로 사용하는 문법 ECMAScript ECMAScript(ES)는 범용 목적의 스크립트 언어 표준을 뜻한다. 쉽게 말해, ‘스크립트 언어를 사용할 때는 이렇게 사용하세요’라는 것을 제정해둔 명세이다. ECMAScript는 스크립트 언어가 준수해야 하는 규칙, 세부 사항 및 지침을 제공한다. 그리고 자바스크립트(JavaScript)는 ECMAScript 명세를 준수하는 스크립트 언어이다. ECMAScript 버전 ECMAScript는 자바스크립트의 표준을 제정하기 위해 1997년 처음 등장했으며, 그 후로 꾸준히 새로운 버전의 ECMAScript 명세가 발표되었다. 초기에는 ES1, ES2, ES3와 같이..