본문 바로가기

전체 글85

회원가입시 패스워드 유효성(Validation) 검사하기 웹사이트 개발시 회원가입 기능을 구현하는데 기본적인 패스워드 등록하기 위해 패스워드 유효성에 대해 설정 및 확인하는 방법에 대해 실제 예시를 통해 설명하고자 합니다. 기본적인 사용 프로그램은 Node.js, Express, Passport, Helmet 입니다. 1. 패스워드 기본 설정 만들기 패스워드 입력 폼의 pattern에 정규식을 지정하여 입력방식을 제한할 수 있습니다. 정규식 구성 예시 (?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,} - 대문자, 소문자, 숫자, 특수문자 포함 - 8글자 이상 아래는 입력창의 예시화면으로 ?=.*\d 는 숫자가 일치하는지 확인, 소문자, 8자 이상 입력해야 하도록 구성하였습니다. 비밀번호 Looks go.. 2023. 10. 28.
데이터 검색 화면 만들기(mongoDB) MongoDB 데이터베이스를 이용하고 Node.js-express 이용하여 데이터를 조회하는 화면을 만들어 보겠습니다. 예시 화면은 관광지명을 검색하여 조회하는 화면입니다. 1. MongoDB 여행지 정보 데이터 구성 관광지 정보는 공공데이터포탈의 전국관광지정보표준데이터를 활용하였습니다. https://www.data.go.kr/data/15021141/standard.do MongoDB에 tourinfo Schema를 아래와 같이 만듭니다. models>campgroud.js - 기본적인 관광지 정보외 경위도 위치, 이미지 데이터 정보도 같이 관리하는데 이번은 검색 기능에 대한 설명으로 제한하고자 합니다. - 검색은 관광지명칭(trrsrNm) 기준으로 검색하겠습니다. const mongoose = re.. 2023. 10. 20.
Express 보안 - Helmet 사용하기 웹애플리케이션 개발시 보안 패키지로 Helmet에 대해 알아 보고자 합니다. Helmet은 인기 많은 보안 패키지로 13개 미들웨어로 구성되어 있습니다. 모두 HTTP 헤더와 관련된 것들 로써 헤더의 동작을 바꾸거나 켜고 끄고 또는 조작하는 것들에 해당됩니다. 1. 사용법 설치하기 : npm install helmet app.js 파일에 helmet 불러와 사용하기 const helmet = require('helmet'); app.use(helmet()); 상기와 같이 사용등록을 하면 helmet 패기키 13개 미들웨어를 모두 사용 가능합니다. 미들웨어 종류는 다음과 같습니다. 세부 사항은 아래 사이트에서 제공하는 설명서를 참조바랍니다. https://www.npmjs.com/package/helmet.. 2023. 10. 2.
이미지 서비스 제공 - Cloudinary(클라우디너리) 활용하기 웹서비스 제공에 있어서 이미지 관리는 중요한 부분중에 하나입니다. 별도의 저장 및 관리 영역이 필요한데 일반 기업형으로는 별도 Storage서버를 통해 관리하지만 클라우드 기반 서비스 또는 개인 프로젝트의 경우 AWS 등 클라우드에서 제공하는 솔루션을 사용하게 됩니다. 이번에 소개하는 Cloudinary는 이러한 저장의 고민 뿐만아니라 웹, 모바일 등 다양한 매체를 위한 기능을 제공하고 있어 개인 프로젝트를 진행하는데 무료로 사용이 가능합니다. 1. Cloudinary 소개 cloudianry는 이미지, 동영상의 업로드, 저장, 관리, 변환(사이즈, 자르기 등), URL 기반 자동 변환, 최적화 등 다양한 기능을 제공하고 있습니다. 개발 편의성을 위해 여러 플랫폼의 호환용 sdk 를 지원합니다. (Rea.. 2023. 9. 26.
dotenv 파일 만들기 개발환경에서는 상관없지만 상용 배포를 하기 위해서는 외부 연동과 데이터베이스 연동시 필요한 Secret Key나 Password를 별도의 파일로 관리해야 외부 노출로 인한 해킹이나 과금문제를 예방할 수 있습니다. 이를 위해 사용하는 모듈이 dotenv 입니다. dotenv(.env) 는 다양한 환경 변수들을 .env 파일에서 process.env 로 보내주는 프로그램 언어 의존도가 없는 모듈입니다. 따라서 .env file은 Github에 코드를 제출할 때 제외되어야 합니다.(.gitignore file에 .env 등록) 1. dotenv 설치 $npm install dotenv 2. dotenv 사용법 프로젝트 최상위 디렉토리에 .env file을 만들고 아래와 같이 키-밸류 값 형태로 입력해 봅니다... 2023. 9. 23.
이미지 파일 저장하기 - multer 서비스를 제공하는 웹애플리케이션에서 사용자가 이미지파일을 등록하여 서비스를 제공하기 위해서는 이미지 파일을 불러와서 서버에 저장해야 합니다. express와 multer를 이용하여 이미지 파일의 정보를 파싱하여 저장하는 방법에 대해 알아보겠습니다. 1. multer 란? multer 는 파일 업로드를 위해 사용되는 multipart/form-data를 다루기 위한 node.js의 미들웨어 입니다. 효율성을 최대화 하기 위해 busboy를 기반으로 하고 있습니다. https://github.com/mscdex/busboy 2. multer 설치하기 $npm install multer multer는 body객체와 한 개 file또는 여러 개의 files객체를 request 객체에 추가합니다. body객체는 .. 2023. 9. 23.
반응형

티스토리툴바