728x90 Daily 학습일기30 [패스트캠퍼스 챌린지 30일차] Express - 사용자 이미지 업로드 패스트캠퍼스 작심 30일 챌린지 30일차. 드디어 패스트캠퍼스 작심 30일 챌린지의 마지막날이다. 마지막 날인만큼 학습 내용에 대해 간략히 작성하고 챌린지를 통해 느낀점을 작성해야지! 오늘 학습한 내용은 그동안 Express로 사용자 정보를 조회하고 입력하는 API 기능을 수정하여, 사용자의 이미지를 업로드하는 기능을 배웠다. 먼저 업로드를 하기 위해 pug 파일에 Form을 추가한다. form(action=`/user/${userId}/profile` method="post" enctype="multipart/form-data") input(type="file" name="profile") button UploadProfile Picture 코드에서 보는것과 같이 /user/사용자ID/profile이라.. 2021. 10. 5. [패스트캠퍼스 챌린지 29일차] Express - Jest를 통한 API 테스트 패스트캠퍼스 작심 30일 챌린지 29일차. 오늘은 그동안 작성했던 API 코드를 테스트하는 방법에 대해 학습하였다. Java에서 Junit을 이용하여 테스트하는 것처럼 Nodejs에서는 Javascript에서 제공하는 jest와 super test 패키지를이용해 테스트 코드를 작성하였다. 코드를 작성하기 전에 jest는 Jabascript Testing Framework로 여러 시나리오의 테스트를 도와주는 Tool이고, Super Test는 Express App에 대해 Test를 도와주는 도구라는 점을 알고 있자. 코드를 작성하기 위해 먼저 npm을 통해 다음 네가지 패키지를 다운로드 받자. jest @types/jest supertest @types/supertest jest와 supertest를 사용.. 2021. 10. 4. [패스트캠퍼스 챌린지 28일차] Express - Pug Template 패스트캠퍼스 작심 30일 챌린지 28일차. 어느덧 28일차 강의를 듣고 있다. 오늘은 지난 시간에 RestAPI와 Middleware, Router 개념을 이용해 작성한 Page에 CSS를 추가하고 존재하지 않는 User를 조회할 때 Error Message를 Handling하는 것에 대해 학습하였다. 그럼 먼저 CSS 적용부터! CSS는 '스태틱 파일 서빙'이라는 개념을 이용하여 적용하게 되는데 HTML의 CSS를 작성하고 적용해본 사람이라면 쉽게 이해할 수 있을 것이다. 그럼 아래 JS파일, CSS파일과 PUG 파일을 살펴보자 [index.css] body { background-color: green; } .blue { color: blue; } .orange { color: orange; } .b.. 2021. 10. 3. [패스트캠퍼스 챌린지 27일차] Express - Pug Template 패스트캠퍼스 작심 30일 챌린지 27일차. 지난 시간에 Express를 통해 Rest API를 간단히 구현해봤다. 보통 실무에서 Rest API를 통해 특정 Data를 JSON 형태로 전달받는 경우가 많다. (물론 내 경험을 기준으로...) 이전까지 구현한 Rest API는 모두 JSON 형태로 전달받도록 구현하였다. 오늘은 JSON이 아닌 웹 페이지가 출력되도록 수정하였다. Web Page를 구현하기 위한 가장 간단한 방법은 HTML 파일을 직접 만들어서 화면에 전달하면 된다. 하지만 이번 강의에서는 Pug라는 Template Engine을 활용해서 화면을 구현하였다. Pug에 대해 알아보기 전에 Template Engine이란 Template 언어로 작성된 코드를 HTML로 변환해주는 역할을 하는 것.. 2021. 10. 2. [패스트캠퍼스 챌린지 26일차] Express - Rest API 라우팅 패스트캠퍼스 작심 30일 챌린지 26일차. 25일차 강의를 통해 미들웨어의 개념을 어느정도 알았을 것이다. 오늘은 25일차 소스코드를 개선하여 Rest API를 작성하고 Express에서 지원하는 라우터의 기능에 대해 학습하였다. 라우터에 대해 알아보기 전에 아래 소스코드에서 '/'는 URL Path인 것을 지난 시간에 배웠다. app.use('/', (req, res, next) => { ... }) 이 Path에 대해 Express는 다양한 Express Path Pattern을 지원하고 있다. Path Pattern에 대해 간략히 알아보자. - /ab?cd : acd 또는 abcd로 접속 가능 - /ab+cd : abcd, abbcd, abbbcd, abbbbbbbbbbcd 접속 가능 - /ab*c.. 2021. 10. 1. [패스트캠퍼스 챌린지 25일차] Express - Middleware 패스트캠퍼스 작심 30일 챌린지 25일차. 오늘은 Express의 미들웨어 개념에 대해 학습하였다. 미들웨어하면 일반적인 컴퓨터보다 조금 더 큰 컴퓨터를 생각했는데, Express에서의 미들웨어는 다른 개념이다. Express가 실행되면 사용자가 서버로 접근하면서 request를 전달하는데, 이때 request가 응답으로 반환되기 전까지 데이터 처리를 위해 거치는 모든 함수 하나 하나를 미들웨어라고 한다. 단 request가 거치는 함수들 사이의 연관성이 없으면 미들웨어는 의미가 없다. 그러므로 함수끼리 데이터를 전달하며 데이터를 처리하게 되는데 이처럼 앞의 미들웨어가 처리한 데이터를 뒤의 미들웨어로 전달하여 서로 연관된 기능을 하는 함수들을 미들웨어라고 한다. 그럼 이전 Express 개념에서 작성한 .. 2021. 9. 30. 이전 1 2 3 4 5 다음 728x90
