react & node.js 개발 - mysql에 배열 데이터 저장하기

여러가지 방법이 있는 것 같은데 성능적으로는 배열 자료형을 문자열로 바꿔서 문자열로 저장하는 방법이 좋은 것 같다 배열이나 객체를 문자열로 바꾸는 방법은 JSON.stringify() 그리고 이렇게 바뀐 문자열을 다시 배열이나 객체로 바꿀려면 JSON.parse()하면 된다 다음과 같이 객체 optionData를 JSON.stringify()로 문자열로 바꿔서 서버에 보내준다 var optionData = { title: title, description: description, data: data.map(x => { return { optionTitle: x.optionTitle, targetUploadType: x.targetUploadType, uploadTargetPath: x.targetUplo..

• format_list_bulleted node.js
• · 2023. 1. 31.
• textsms

react&node.js 개발 - 로그인하면서 JWT 토큰 발급받고 유저 정보 알아내기

1. 비밀 키 생성 백엔드에 config.js 파일 작성 다음과 같이 secret key를 작성 JWT 토큰 검증시 해싱에서 사용할 키라고함 //backend//config.js //jwt verification secret key module.exports = { 'secret':'대혁이다' } 2. 서버에 secret key 세팅 서버에 작성한 config 파일을 불러오고 secret key를 다음과 같이 세팅 //backend/server.js // set the secret key variable for jwt const config = require('./config') app.set('jwt-secret', config.secret) 3. 로그인 api 작성 $npm install jsonwe..

• format_list_bulleted node.js
• · 2023. 1. 22.
• textsms

MYSQL에서 스키마(데이터베이스) 생성하기

navigator 창에서 우클릭하면 "create schema"라고 있음 스키마 이름을 작성하고 charset이랑 collation을 선택 charset은 텍스트 데이터를 어떤 방식으로 인코딩하여 저장할지 결정한다고함 한글데이터는 utf-8을 많이 사용함 최근 추세로 이모티콘도 표현하고 싶으면 utf8mb4를 쓴다고 함 https://velog.io/@chosj1526/Charset%EA%B3%BC-Collation [MySQL] Character set과 Collation의 모든것 텍스트 데이터를 어떤 방식으로 인코딩하여 저장할 것인가를 결정하는 값한글 인코딩을 위해 가장 널리 사용되는 방식 : utf-8, EUC-KR\-> 한글자당 3bytes를 사용하는 utf-8보다, 4bytes를 사용하면서 이 ..

• format_list_bulleted SQL
• · 2023. 1. 19.
• textsms

react와 express 서버 연동 익히기 9편 -DB 데이터 삭제하기-

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 ( ..

• format_list_bulleted node.js
• · 2023. 1. 18.
• textsms

react와 express 서버 연동 익히기 8편 -DB 데이터 수정하기-

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에..

• format_list_bulleted node.js
• · 2023. 1. 18.
• textsms

react와 express 서버 연동 익히기 7편 -DB에서 데이터 조회-

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(); ..

• format_list_bulleted node.js
• · 2023. 1. 18.
• textsms