7주차
단일 파일 업로드, 다중 파일 업로드, 동적 form에서 Multer 미들웨어를 이용한 파일 업로드에 대해 배웠으며, 실습 과제로 회원가입 form을 만들고, 파일 업로드된 이미지와 결과를 화면에 보여주는 실습을 해볼 수 있었다.
MySQL을 사용해 sql 쿼리를 작성해보고 연습했으며,조건에 맞는 sql쿼리를 스스로 작성해보는 실습을 진행했다.
1. Multer 미들웨어
: 이미지, 동영상을 비롯한 파일들을 멀티파트 형식으로 업로드할 때 사용하는 미들웨어이다.
- 멀티파트 ? 클라이언트와 서버 간 전송되는 http 요청 또는 응답에서 여러 종류의 데이터를 동시에 전송하기 위해 사용되는 방식 => enctype이 multipart/form-data인 폼을 통해 업로드 하는 데이터 형식
enctype="multipart/form-data"
: Multer는 멀티파트가 아닌 폼에서는 동작하지 않는다. => Multer 를 사용하기 위해 const multer = require('multer')로 미들웨어를 불러줘야한다.
- single() : 1개의 파일 업로드 => req.file = 업로드 결과 / req.body = 나머지 정보
- array() : 하나의 요청에 여러 파일 업로드 => req.files = 업로드 파일들
- fields() : 여러개의 요청에 여러 파일 따로 업로드
+ ( )안에는 파일 업로드 input의 name을 적어준다.
: 컴퓨터에서 변환된 파일이름이 아닌 저장된 파일 이름을 그대로 출력하고 싶다면 아래의 코드를 사용하면 된다.
: 파일 한글이름을 처리하기 위해서는 아래의 코드를 사용하면 된다.
파일업로드 방법을 이용해서 회원가입 폼 정보를 화면에 출력하는 실습을 진행했다.
8000번 서버를 이용했으며, multer를 이용해 파일이름을 한글도 처리 가능하도록 만들었다.
메인화면으로는 practice.ejs파일을 렌더링하도록 했고, 파일 name이 demo인 input을 받아와 prac-result.ejs 파일에 정보를 띄우도록 구현했다.
결과페이지를 렌더링하는 과정에서 입력된 데이터 정보를 받아야하기 때문에 객체 형태로 id, name, pw, age 데이터를 보냈다.
따라서 결과화면은 다음과 같이 나타났다.
2. MySQL
: SQL문은 구조적 쿼리 언어로 관계형 데이터베이스를 제어하고 관리할 수 있는 목적의 프로그래밍 언어이다.
- 데이터 정의어 (DDL)
- 데이터 조작어 (DML)
- 데이터 제어어 (DCL)
SQL문은 MySQL workbench를 이용해 실습해볼 수 있었다.
먼저 MySQL을 설치해줬고, cmd창을 사용해서 sql문을 연습했다.
- select문을 이용한 기본 연산
- select문으로 데이터 검색 (in / between)
- select - like (% / _)
🔥 %와 _의 차이는 글자를 대체하는 기준에 있다. => %는 모든 글자를 대체하며, _는 한글자를 대체한다. 따라서 __를 사용할 때에는 글자수도 맞춰서 작성해야한다.
- create으로 데이터베이스, 테이블 형성
- drop을 이용한 데이터베이스, 테이블 삭제
sql문을 연습하기 위해 리더님께서 문제를 내주셨고, 조건에 맞는 sql문을 작성해보면서 실습을 해볼 수 있었다.
문제 1️⃣
: id varchar(10)으로 변경, age 없앰, interest varchar(100) 추가
=> 먼저 member 테이블을 형성하기 위해 다음의 sql문을 실행했다.
=> 테이블을 형성한 후 id를 변경하기 위해 alter table - modify를 사용했다.
=> age를 없애기 위해 alter table - drop을 사용했다.
=> interest 속성을 추가하기 위해 alter table - add를 사용했다.
이렇게 첫번째 문제를 해결할 수 있었다. 첫번째 문제는 기본적인 sql문이라 큰 어려움 없이 해결했다.
문제 2️⃣
: user 테이블에 다음의 데이터를 입력하세요.
-- 1. 모든 회원목록을 가져오는데, 이때 birthday 컬럼의 값을 기준으로 오름차순 정렬하여 검색
-- 2. 회원 목록 중 gender 컬럼의 값이 "M" 인 회원목록을 가져오는데, 이때 name 컬럼의 값을 기준으로 내림차순 정렬하여 가져오시오.
-- 3. 1990 년대에 태어난 회원의 id, name 컬럼을 가져오기
-- 4. 6월생 회원의 목록을 birthday 기준으로 오름차순 정렬
-- 5. gender 컬럼의 값이 'M'이고 1970년대에 태어난 회원 목록 //여기까지함
-- 6. 모든 회원목록 중에 age를 기준으로 내림차순 정렬, 처음 3개 값만 가져오기
-- 7. 모든 회원목록 중에 나이가 25 이상 50 이하인 회원의 목록
-- 8. id 컬럼의 값이 hong1234인 레코드의 pw 컬럼값을 12345678로 변경
-- 9. id 컬럼의 값이 jungkrat 인 레코드를 삭제하시오
두번째 문제는 많아서 쿼리문을 작성하는 데 시간이 조금 걸렸다.
=> 먼저, user테이블을 형성했다. 그리고 insert into - values를 사용해 데이터를 넣어줬다.
=> select, order by, where - like, limit, update set, delete 등의 쿼리를 사용해 문제를 해결했다.
모든 쿼리문을 작성하는 데 시간이 좀 걸리긴 했지만, 어렵거나 막히는 부분 없이 문제를 해결할 수 있었다.
7주차에는 파일업로드와 sql을 연습해볼 수 있었다. sql은 계속해서 해왔던 거라 특별한 어려움 없이 잘 따라갈 수 있었고, MySQL프로그램을 실습을 하면서 자주 사용해볼 수 있어서 좋았다.
파일업로드는 처음 해보는 내용인데 이전에 배운 node.js의 구조에서 특별히 변한 것이 없었고, 파일업로드와 관련한 코드만 추가적으로 이해하면 돼서 이 역시도 큰 어려움은 없었다.
업로드한 파일이 지정한 폴더에 저장될 때 컴퓨터 언어로 변환된 이름으로 저장이 되어서 원본 파일명을 그대로 저장할 수있는 방법이 없을지 궁금했는데 수업을 통해 파일명을 변경해주는 방법도 배울 수 있어서 좋았다.
특히 한글이름도 처리할 수 있는 방법을 실습하면서 확인해볼 수 있어서 궁금증을 해결하는 데 더 도움이 되었다.
앞으로 진행될 프로젝트에서 파일 업로드에 관한 내용도 적용해볼 기회가 있다면 실수없이 사용하기 위해 좀 더 연습하고 익숙해져야겠다.