[Django/React] 장고와 리액트 연동 (3) React App 생성 yarn create react-app React-project +) yarn 이 없다면 다음과 같이 설치한다. npm -g install yarn react 프로젝트 src 폴더 내에 RestAPI.js 파일을 생성해준다. App.js 파일에 다음과 같이 추가한다. import logo from './logo.svg'; import './App.css'; import RestAPI from "./RestAPI.js" import React from "react"; function App() { return ( ); } export default App; Axios Axios는 브라우저, Node.js를 위한 HTTP 비동기 통..
[Django/React] 장고와 리액트 연동 (2) Serializer 생성 frontend로 데이터를 보내기 위해 장고 내부의 복잡한 테이터들을 json/xml 등의 형태로 데이터를 변환해준다고 생각하면 된다. Serializer는 DRF가 제공하는 클래스로, DB 인스턴스를 JSON 형식으로 생성한다. 반대로 JSON을 DB로 변경하기 위해선 deserializer가 사용된다. serializer시엔 각각 DB 칼럼들로 정의를 해야한다. App 디렉토리에 serializers.py를 생성하고, 모델과 필드를 작성해준다. from rest_framework import serializers from .models import Review class ReviewSerializer(serializers...
[Django/React] 장고와 리액트 연동 (1) 장고와 리액트의 연동은 장고의 REST 프레임워크(DRF, Django Rest Framework)를 사용하여 연동한다. 프론트엔드(React)가 Django 백엔드로 API 요청을 보내면, 장고는 요청을 서버 사이드 로직에 따라 처리하여 HTTP 응답으로 포장하여 프론트엔드로 보낸다. 데이터를 변경해야하는 경우엔 장고는 데이터베이스에서 필요한 작업을 수행한 다음, 프론트엔드로 성공/실패 여부를 확인하는 응답을 보낸다. Django 백엔드에서 응답을 받으면, 프론트엔드는 UI를 업데이트한다. 위와 같이 프론트 엔드와 백엔드가 상호 작용을 하기위한 연동을 진행해보자. DRF 설치 API 서버로 사용할 Django Rest Framework를 먼저 설치해..
[Python] 파이참으로 django 프로젝트 세팅하기 파이참으로 장고 프로젝트를 세팅하려고한다. 새프로젝트에서 Django로 생성을 해도되고, Python 프로젝트를 실행해 장고를 설치해도 된다. Django 프로젝트 생성 가상환경은 venv 가상환경으로 설정했다. 프로젝트를 생성 경로와 파이썬 인터프리터 경로를 지정해주면 장고가 알아서 설치 된다. 장고 설치 장고를 pip로 설치하여 사용할 때에도 venv 가상 환경을 사용해준다. 참고로 venv 가상환경을 cli로 설치하는 방법은 다음과 같다. mkdir venv cd venv python3 -m venv web-project .web-project/bin/activate 파이참 프로젝트가 생성됐으면, pip 명령어를 통해 장고를 설치한다. pip..
[React] 윈도우에 리액트(React.js) 설치 reactjs 의 공식 문서를 참고하여 설치 설치 - React A JavaScript library for building user interfaces reactjs-kr.firebaseapp.com react 설치에 필요한 npm을 사용하기 위해선 node.js 설치가 선행이 되어야한다. 아래 링크에서 os에 맞는 버전을 다운받는다. 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org node.js를 설치하면 npm이 자동으로 설치가 된다. Create React App을 사용하면 최신 자바스크립트 기능을 사용할 수 있게 개..
[Python] pymysql 사용하기 pymysql을 db와 연동 후 select 하는 과정을 알아보자. pymysql 연동 먼저 pymysql 라이브러리를 import 해준다. import pymysql DB와 Python 연동을 위해 pymysql.connect() 함수에 DB 정보를 입력 후, 연결한다. conn = pymysql.connect( host = db_host, user = db_user, password= db_passwd, port = 3306, db = 'test_db', charset='utf8' ) DB 정보를 코드에 직접 사용하지말고, 분리해서 넣는게 좋다. [Python] 민감 정보 분리해서 사용하기 (config 파일 분리) [Python] 민감 정보 분리하기 파이썬에서..
[Pandas] 데이터프레임 리스트로 변환하기 데이터 프레임을 리스트로 변환하여 처리해야 할때, 리스트로 변환하는 방법은 여러가지가 있다. 먼저 샘플 df를 생성한다. import pandas as pd df = { 'key': ['A', 'B', 'C', 'D'], 'value': [1, 2, 3, 4] } df = pd.DataFrame(df, columns=['key','value']) 칼럼 선택 후 리스트로 변환하기 데이터 프레임의 각 칼럼은 시리즈(Series)라는 데이터 타입으로 이루어져있다. 시리즈는 to_list() 함수를 이용해 리스트로 변환하거나, list() 함수를 이용해서 리스트로 변경할 수 있다. df['key'].to_list() ['A', 'B', 'C', 'D'] list(d..
[HTML/CSS] HTML/CSS 시작하기 HTML? HTML (Hypertext Markup Language,하이퍼텍스트 마크업 언어) 는 우리가 보는 웹페이지가 어떻게 구조화되어있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어다. HTML은 elements로 구성되어 있으며 이들은 각 컨텐츠의 여러 부분들을 감싸고 마크업한다. HTML 요소(Element)의 구조 여는 태그, 닫는 태그, 내용으로 구성되며 위 사진과 같은 경우엔 가 태그가 되며 그 안의 텍스트가 내용이 된다. 그리고 여는 태그, 닫는 태그, 내용을 통틀어 요소(element)라고 한다. 속성(Attributes) 속성은 요소에 실제론 나타내고 싶지 않지만 추가적인 내용을 담고 싶을 때 사용한다. 위 사진은 목표를 구분할 수 ..
[API] REST API WEB API란? 웹 서버 또는 웹 브라우저를 위한 애플리케이션 프로그래밍 인터페이스 HTTP 서비스이고, 다양한 클라이언트에서 접근이 가능하도록 설계되어 있다. HTTP 표준 접근 방식을 이용하며, 플랫폼 환경, 클라이언트 환경의 제한이 없는 서비스 구현이 가능하다. REST API 두 컴퓨터 시스템이 인터넷을 통해 정보를 안전하게 교환하기 위해 사용하는 인터페이스 자원을 이름으로 구분하여 해당 자원의 상태 (정보) 를 주고 받는 모든 것을 의미한다. 🤔API? Application Programming Interface의 약자로, 프로그램들이 서로 상호 작용하는 것을 도와주는 매개체 HTTP 프로토콜의 인프라를 그대로 사용하므로, HTTP 표준 프로토콜에 따르는 모든 플랫폼..
[Python] 리스트끼리 빼기 리스트에 중복 값이 없을 때 a = [1, 2, 3, 4] b = [3, 2, 5] 리스트의 중복 값이 없을 때나, 중복을 제거하고 리스트끼리 빼고싶은 경우엔 다음과 같은 방법을 사용할 수 있다. #리스트 컴프리헨션 사용 [_ for _ in a if _ not in b] #집합 사용 list((set(a) - set(b)) 출력 값 : [1, 4] 리스트에 중복 값이 있을 때 a = [1, 2, 2, 3, 4] b = [3, 2, 5] 리스트끼리 빼서 [1,2,4]의 값을 얻고싶을때, 위 방법을 사용하면 중복값이 제거되서 [1,4]가 출력된다. 그럴땐 collections 라이브러리의 conter 함수를 사용해서 쉽게 구할 수 있다. from collections imp..
[Pandas] 특정 위치에 새로운 컬럼 삽입하기 특정 조건에 부합했을 때, 새로운 열을 생성하여 조건에 부합하는 데이터를 삽입하고 싶었다. 말로 설명하니 이해하기가 조금 어려운데, 예제를 들어 확인해보자. df 생성 아래과 같은 데이터 프레임이 있을때, 숫자면 num, 문자면 chr인 행을 추가하고싶다. df = pd.DataFrame({'data' : ['가', '123', '나', 'A', '5555']}) 신규 컬럼 생성 df.iterrows 함수를 사용해 idx와 row를 가져온다. ✔ df.iterrows() Dataframe의 각 행에 있는 정보를 담은 객체 tuple의 형태로 출력이되며, 첫번째 자리에는 index 두번째 자리에는DataFrame의 행 정보가 Series 형태로 들어있다. ..
[Python] Sorted 다중 조건 걸기 Sorted 함수 정렬을 할 때 사용하는 함수 lterable 자료형에 대해서 정렬이 가능하고, list 자료형으로 리턴한다. sort 함수와 다르게 기존의 리스트는 건드리지 않고, 새로운 리스트를 변환한다. Default가 오름차순이고 reverse=True 조건을 사용하면 내림차순으로정렬한다. a = [5, 4, 3, 2, 1] sorted(a) [1,2,3,4,5] 다중 조건 걸기 (1) 조건 하나 걸기 sorted로 정렬을 할 때 key값을 통해서 조건을 걸 수 있다. 이때 조건은 lambda를 통해서 조건을 걸 수 있다. lst = [['apple','red'],['banana','yellow'],['grape','purple']] #색깔을 기준으로 ..
