전체 글 (58) 썸네일형 리스트형 res.json() 과 res.render() res.render('storesearch', { storeList: storeList });와 res.json({ store });는 Express.js에서 서로 다른 응답 방식을 나타냅니다. res.render('storesearch', { storeList: storeList }); 이 코드는 Express.js의 뷰 엔진을 사용하여 HTML 템플릿을 렌더링하는 응답 방식입니다. res.render() 함수는 지정된 뷰 템플릿 파일을 렌더링하고 클라이언트에게 HTML 형식의 응답을 보내줍니다. 이를 통해 서버에서 렌더링된 HTML을 클라이언트로 전달하여 웹 페이지를 표시하는데 사용됩니다. res.json({ store }); 이 코드는 JSON 데이터를 클라이언트에게 응답으로 보내는 방식입니다. r.. API 만들기 ✏️서비스 로직과 라우터를 작성한 다음에는 이 두 요소를 서로 연결하고 서버에 등록하는 단계가 필요합니다. 이 단계를 거쳐야 클라이언트의 요청에 대해 서비스 로직이 실행되고 응답이 제공될 수 있습니다. 서비스 로직과 라우터 연결: 서비스 로직(storeService.js)에서 작성한 함수들을 라우터(storeRoutes.js)에서 호출하여 사용해야 합니다. 예를 들어, 클라이언트의 요청이 들어오면 라우터에서 해당 요청에 맞는 서비스 함수를 호출합니다. 라우터 등록: 라우터 파일을 Express 애플리케이션에 등록하여 요청을 라우팅하도록 설정해야 합니다. 이렇게 하면 클라이언트의 요청 경로에 따라 해당하는 라우터가 실행됩니다. Express 애플리케이션에 라우터 등록: Express 애플리케이션의 핵심 파.. .countDocuments({ field: value }) .countDocuments()는 MongoDB의 명령 중 하나 특정 쿼리 조건에 맞는 문서(Document)의 개수를 반환하는 함수입니다. 즉, 해당 쿼리 조건을 만족하는 문서의 갯수를 계산하여 반환합니다. 예를 들어, MongoDB에서 .countDocuments({ field: value })와 같이 사용하면 field 필드의 값이 value와 일치하는 문서의 개수를 반환합니다. const reviewCount = await Review.countDocuments({ storeId: a._id }); 위 코드에서는 Review 모델에서 storeId가 a._id와 일치하는 리뷰 문서의 개수를 가져옵니다. 이를 통해 특정 가게의 리뷰 갯수를 계산할 수 있습니다. .countDocuments() 대신에.. localeCompare() a.localeCompare(b)은 JavaScript에서 문자열을 비교할 때 사용하는 함수입니다. 이 함수는 두 문자열을 비교하고, 문자열의 정렬 순서에 따라 비교 결과를 반환합니다. localeCompare() 함수는 두 문자열을 비교하여 다음과 같은 값을 반환합니다: 음수 값: 첫 번째 문자열이 두 번째 문자열보다 사전적으로 앞에 옴. 양수 값: 첫 번째 문자열이 두 번째 문자열보다 사전적으로 뒤에 옴. 0: 두 문자열이 동일한 문자열. 이를 사용하여 문자열을 사전순으로 정렬하는 데 사용할 수 있습니다. 지도 API 정보 다루기 카카오맵의 지도 API를 사용할 때, 주소와 위도/경도 정보를 어떻게 다루는 여러 가지 방법이 있을 수 있습니다. 어떤 방법을 선택하느냐는 주로 데이터의 활용 목적과 데이터 구조에 따라 달라질 수 있습니다. 1. 주소 필드 안에 위도/경도 정보 포함: 주소 필드에 위도와 경도 정보를 포함시켜 사용할 수 있습니다. 이 방법은 주로 사용자 친화적인 데이터 표시를 위한 목적으로 활용될 수 있습니다. 사용자가 주소를 봤을 때 바로 위치를 파악할 수 있어 편리합니다. 그러나 프로그래밍적인 접근이나 위치 기반 검색에는 적합하지 않을 수 있습니다. 2. 위도/경도 필드 별도 생성: 데이터베이스나 데이터 구조에서 위도와 경도 정보를 별도의 필드로 관리하는 것도 일반적인 방법입니다. 이 방법은 주소와 위치 정보를 분리하.. 2023.08.14.월 : 프로젝트 시작 . 초기설정 오늘부터 프로젝트 시작! 오늘 할 일은 프로젝트 시안을 짜고 피그마를 완성하는 것! 힘을 내보자 1. 언어와 렌더링 방식 결정 리액트 - 타입스크립트 (CSR) 방식으로 가기로 결정 백은 - express.js 로 결정 CSR로 결정 : 초기 페이지 로딩 후, 클라이언트 측 JavaScript가 실행되어 동적으로 컨텐츠를 렌더링 및 업데이트하고 이로 인해 페이지 전환 시에 부드럽고 빠른 사용자 경험을 제공할 수 있고, 사용자가 바로 인터렉션해야하는 사이트이기 때문에 CSR로 결정 2. 메인 페이지 대강적인 ui 및 로고 대표컬러 결정 화면 사이즈 (가장 사용률 높은 사이즈로 결정) height: 1024px; width: 1440px; 로고(메인로고, 미니로고) 3. 파트배분 로그인/회원가입 마이페이지(.. 패키지 잠금 package.json에 이미 모든 의존성에 대한 데이터가 있는데 왜 package-lock.json이 추가로 필요할까? 이유는 package.json에 버전을 설정할 때 특정 버전이 아니라 버전 범위를 설정하면 패키지를 설치하는 시점에 따라 다른 버전이 설치되기 때문이다. npm에 등록된 패키지들은 엄격하게 관리가 되고 있지 않는 오픈소스가 대부분이다. 하위 호환에 대한 검증을 npm에서도 진행하지 않기 때문에 패치 버전으로 변경되었는데도 동작하지 않는 경우가 생각보다 굉장히 많다. 설치 시 올바르게 동작하는 버전을 고정하면 된다. package-lock.json에 패키지의 의존성 트리 정보를 저장해두고 설치 시 package.json이 아니라 package-lock.json을 확인하고 설치한다. 이를.. npx npm은 명령어를 지정해 실행하는 스크립트 기능도 제공한다. 스크립트 기능은 앱시작, 중지, 빌드, 배포, 테스트 등의 명령어를 터미널에 매번 입력하지 않고 package.json에 정의함으로써 조금 더 간편하게 명령어를 실행하는 기능이다. 보통 스크립트는 node_modules디렉터리 아래에 설치된 패키지에 있기 때문에 경로를 지정해야 하지만, npx를 이용하면 경로를 지정하지 않고 간편하게 사용할 수 있다. 1. npm 스크립트 파일을 정의하기 Node.js 프로젝트의 package.json에는 scripts 항목이 있다. scripts에 등록된 항목들은 npm run 명령으로 실행할 수 있다. npx 테스트용 package.json { "name": "sample-package", "version".. 이전 1 2 3 4 ··· 8 다음