코딩30 [React] + express + mariadb /post insert 하기 inputComp.js 추가할 input 값 App.js 로 넘겨주기 import '../css/InputComp.css'; import { Component } from 'react'; class InputComp extends Component{ constructor(props){ super(props) this.state={ id:'', todo:'' } } addTodoList=()=>{ alert('추가(InputComp)') // const {id} = this.props+1 const {id} = this.props.id+1 // alert('추가할 id ' + this.props+1) alert('추가할 id ' + id) const{todo} = this.state this.props.a.. 2023. 7. 8. [SpringBoot] Httpsession HttpSession 객체를 사용하여 "user"라는 이름으로 유저 정보를 세션에 저장하는 예시 @Controller public class MyController { @RequestMapping(value = "login", method = RequestMethod.POST) public String login(HttpSession session, UserEntity user) { // 로그인 로직 수행 // ... // 로그인이 성공한 경우 세션에 "user" 속성으로 유저 정보 저장 session.setAttribute("user", user); return "redirect:/home"; } } 위의 예시에서 /login 경로로 POST 요청이 들어오면 로그인 로직을 수행하고, 로그인이 성공한 경.. 2023. 7. 6. [NodeJS] Router 객체로 라우팅 분리 익스프레스에서는 라우터를 분리할 수 있는 방법을 제공한다. routes 폴더를 만들고 index.js와 user.js 파일 생성하기 index.js const express = require('express'); const router = express.Router(); //GET / 라우터 router.get('/', (req, res) => { res.send('Hello, Express'); }); module.exports = router; user.js const express = require('express'); const router = express.Router(); //GET / 라우터 router.get('/', (req, res) => { res.send('Hello, User');.. 2023. 7. 1. [NodeJS] multer 파일업로드 multer : 이미지, 동영상 등을 비롯한 여러 가지 파일을 멀티파트 형식으로 업로드할 때 사용하는 미들웨어이다. form을 통해 업로드하는 파일은 body-parser로는 처리할 수 없고 직접 파싱하가도 어려우므로 multer를 사용한다. 1.multer 설치 npm i multer 2. 화면 만들어주기 multipart.html 업로드 app.js 작성하기 전에 multer 기본적인 설정 알아두기 const multer = require('multer'); const upload = multer({ storage: multer.diskStorage({ destination(req, file, done){ done(null, 'uploads/'); }, filename(req, file, done){.. 2023. 7. 1. [NodeJS] 실무에서 자주 사용하는 패키지 콘솔 $ npm i morgan cookie-parser express-session dotenv dotenv를 제외한 다른 패키지는 미들웨어이다. dotenv는 process.env를 관리하기 위해 설치했다. .env파일 생성 COOKIE_SECRET=cookiesecret dotenv패키지가 .env파일을 읽어서 process.env로 만들어준다. COOKIE_SECRET 에 cookiesecret 값이 할당. 키=값 비밀키들을 소스 코드에 그대로 적어두면 키도 같이 유출 되기 때문에 별도의 파일로 관리한다. app.js 수정 const express = require('express'); const path = require('path'); //추가 const morgan = require('mor.. 2023. 7. 1. [NodeJS] 익스프레스 자주 사용하는 미들웨어 미들웨어는 익스프레스의 핵심이다. 요청과 응답의 중간에 위치하기 때문에 미들웨어라고 부른다. 미들웨어는 요청과 응답을 조작해 기능을 추가하기도 하고, 나쁜 요청을 걸러내기도 한다. 미들웨어는 app.use와 함께 사용된다. app.use(미들웨어) 꼴이다. 익스프레스 서버에 미들웨어 연결해보기 const express = require('express'); const path = require('path'); const app = express(); app.set('port', process.env.PORT || 3001); app.use((req, res, next) => { console.log('모든 요청에 다 실행됩니다. '); next(); }); app.get('/', (req, res, ne.. 2023. 7. 1. [NodeJS] 익스프레스 웹 서버 만들기 익스프레스는 http 모듈의 요청과 응답 객체에 추가 기능들을 부여했다. 더 이상 if문으로 요청 메서드와 주소를 구별하지 않아도 된다. 익스프레스 프로젝트 시작하기 1. 폴더 생성 learn-express * 항상 package.json 을 제일 먼저 생성해야 한다. 콘솔에서 npm init 명령어 호출 package name : (폴더명) [프로젝트 이름 입력] version : (1.1.0) [프로젝트 버전 입력] description : [프로젝트 설명 입력] entry poion : index.js (app.js) 지금 프로젝트에서는 app.js 로 바꿈 test command : [엔터 키 클릭] git respository : [엔터 키 클릭] keywords : [엔터 키 클릭] autho.. 2023. 7. 1. [NodeJS] http - 요청과 응답 서버는 클라이언트가 있기에 동작한다. 클라이언트에서 서버로 요청(request)을 보내고, 서버에서는 요청의 내용을 읽고 처리한 뒤 클라이언트에 응답(response)을 보낸다. 따라서 서버에는 요청을 받는 부분과 응답을 보내는 부분이 있어야 한다. 요청과 응답은 이벤트 방식이라고 생각하면 된다. 클라이언트로부터 요청이 왔을 때 어떤 작업을 수행할지 이벤트 리스너를 미리 등록해둬야 한다. 아래는 이벤트 리스너를 가진 노드 서버이다. const http = require('http'); http.createServer((req,res) => { //여기에 어떻게 응답할지 적어줍니다. }) http 서버가 있어야 웹 브라우저의 요청을 처리할 수 있으므로 http 모듈을 사용했다. http 모듈에는 creat.. 2023. 6. 30. [NodeJS] 예외 처리하기 예외란? - 처리하지 못한 에러 멀티 스레드 프로그램에서는 스레드 하나가 멈추면 그 일을 다른 스레드가 대신한다. 하지만 노드의 메인 스레드는 하나뿐이므로 그 하나를 소중히 보호해야 한다. 메인 스레드가 에러로 인해 멈춘다는 것은 스레드를 갖고 있는 프로세스가 멈춘다는 뜻이고, 전체 서버도 멈춘다는 뜻이다. 예외 처리 -> 에러 로그가 기록되더라도 작업은 계속 진행될 수 있도록 아래 예제는 프로세스가 멈추지 않도록 에러를 잡는 방법이다. 에러가 발생할 것 같은 부분을 try/catch 문으로 감싸면 된다. 프로세스가 멈추면 setInterval도 멈출 것이다. setInterval(()=>{ console.log('시작'); try{ throw new Error('에러 강제 발생') }catch(err).. 2023. 6. 29. 이전 1 2 3 4 다음 728x90
