https://fastapi.tiangolo.com/tutorial/ Tutorial - User Guide - Intro - FastAPITutorial - User Guide - Intro This tutorial shows you how to use FastAPI with most of its features, step by step. Each section gradually builds on the previous ones, but it's structured to separate topics, so that you can go directly to any specific one tofastapi.tiangolo.com 파이썬 프로그램을 수행하기 위한 백엔드 서버를 구축해야하는데 FastAPI를 ..
1. python-shell 설치 딥러닝 모델같은 파이썬 프로그램을 웹 프로젝트에서 사용하고 싶을때가 있다 node.js에서 파이썬 프로그램을 사용할 수 있는 모듈이 존재하는데 python-shell을 먼저 설치 $npm install python-shell 2. 기본 구조 기본 구조는 다음과 같다 PythonShell.run(파일경로, options, function) const { PythonShell } = require('python-shell'); PythonShell.run('./makeup.py',options,function(err,results) { if (err) { throw err; } console.log(results); }) 여기서 options는 파일 실행할때 설정할 옵션을 ..
1. 이미지 데이터 저장? 관계형 데이터베이스 MySQL에 비정형 데이터인 이미지를 그냥 저장할 수는 없다 보통 이미지를 클라이언트에서 서버로 보내 저장할때, 이미지 위치 경로만 DB에 저장하고 실제 이미지 파일은 서버 내에 저장시킨다 2. input 태그 input태그에서 type='file'로 지정하면 파일을 업로드 받을 수 있다 accept 속성은 입력받을 파일의 형식을 지정 image/*하면 image 파일인데 확장자 jpg, png등 상관없다는 말 하지만 accept로 하더라도 다른 파일을 입력받을 수는 있다 특정 파일만 받게할 수는 있다고 하는데 당장 필요한건 아니니.. 3. FileReader() 자바스크립트에서 FileReader() 객체를 이용해 파일을 읽어들일 수 있다 const sav..
1. App.js 수정 front의 App.js에 데이터를 삭제하는 deleteData 함수 작성 async function deleteData(el) { const remove = window.confirm(el.name + '을 삭제합니까?'); if (remove) { const body = {id:el.id} const res = await axios('/delete/data',{ method : 'POST', data: {'delete':body}, headers: new Headers() }) if (res.data) { alert('데이터를 삭제했습니다.') return window.location.reload(); } } } 삭제 버튼도 추가해서, 누르면 삭제할 수 있도록 return ( ..
1. App.js 수정 App.js에 데이터를 수정하는 함수 modifyData를 작성 async function modifyData(el) { const modify = prompt(el.name + '을 어떤 이름으로 변경할까요?') if (modify !== null) { const body = { name : modify, id : el.id } const res = await axios('/modify/data', { method : 'POST', data : {'modify' : body}, headers : new Headers() }) if (res.data) { alert('데이터를 수정했습니다.') return window.location.reload() } } } 그리고 return에..
1. 데이터 조회 front의 App.js를 다음과 같이 수정 async function getData() 함수 작성 list, update state 추가 useEffect()를 사용해서, 렌더링하면 데이터를 조회하도록 import React, {useState} from 'react'; import './App.css'; import axios from 'axios'; const App = (props) => { const [name,setName] = useState('') const [list,setList] = useState([]) const [update,setUpdate] = useState(false) async function addData(e) { e.preventDefault(); ..
내 블로그 - 관리자 홈 전환 |
Q
Q
|
---|---|
새 글 쓰기 |
W
W
|
글 수정 (권한 있는 경우) |
E
E
|
---|---|
댓글 영역으로 이동 |
C
C
|
이 페이지의 URL 복사 |
S
S
|
---|---|
맨 위로 이동 |
T
T
|
티스토리 홈 이동 |
H
H
|
단축키 안내 |
Shift + /
⇧ + /
|
* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.