본문 바로가기

반응형

분류 전체보기

(399)
[단순용어] nestjs의 prisma 와 ORM prisma 는 뭐야 NestJS는 TypeScript로 작성된 Node.js 프레임워크입니다. NestJS는 데이터베이스 작업을 수행하기 위해 여러 가지 ORM(Object-Relational Mapping)을 지원합니다. 그 중 하나가 Prisma입니다. Prisma는 ORM으로서, TypeScript와 JavaScript에서 작성된 데이터베이스 작업을 단순화하고 안전하게 만들어줍니다. Prisma는 데이터베이스에 대한 타입 안정성을 제공하며, 쿼리 작성을 보다 쉽게 만들어줍니다. NestJS에서 Prisma를 사용하면 데이터베이스 작업을 더 쉽게 수행할 수 있습니다. Prisma는 NestJS에서 TypeORM과 Sequelize와 같은 다른 ORM과 함께 사용할 수도 있습니다. Prisma를 사용..
[단순용어]비즈니스 로직(Business Logic) 비즈니스 로직(Business Logic)은 애플리케이션의 핵심적인 기능을 구현하는 코드로, 비즈니스 규칙에 따라 데이터를 처리하고, 처리된 결과를 반환하는 역할을 합니다. 비즈니스 로직은 애플리케이션의 목적과 사용자 요구에 따라 다르며, 일반적으로 다음과 같은 역할을 합니다. 데이터 검증: 입력된 데이터의 유효성을 검사하고, 필요한 경우 오류를 반환합니다. 데이터 가공: 입력된 데이터를 기반으로 계산이나 연산을 수행합니다. 데이터 조작: 데이터베이스에 데이터를 저장하거나, 수정, 삭제 등의 작업을 수행합니다. 예외 처리: 예기치 않은 상황이 발생했을 때, 적절한 예외 처리를 수행합니다. 비즈니스 로직은 애플리케이션의 핵심 기능을 담당하며, 애플리케이션의 성능과 안정성, 유지 보수성 등에 영향을 미칩니다..
[js] Web Speech API 를 이용해 음성인식 가능한 검색창 만들기 체험하기 및 코드 확인 - ⏺️ 클릭 시 음성녹음 동의 창이 뜨고 동의를 누르면 녹음이 시작됩니다. - 일정시간이 지나면 인식된 음성이 텍스트로 전환되어 input 창에 나타납니다. - 만일 녹음 도중에 중지하고자 한다면 🛑 버튼을 클릭하면 일정 대기 시간 없이 즉시 종료 됩니다. - 만일 여기서 실행이 안 된다면 아래 표의 우측 상단의 코드팬 로고를 클릭하면 해당 사이트에서 실행해볼 수 있습니다. HTML 삽입 미리보기할 수 없는 소스 HTML 코드 🔎 ⏺️ 🛑 JS 코드 const searchConsole = document.getElementById("search_console"); // ----- 현재 브라우저에서 API 사용이 유효한가를 검증 function availabilityFunc() {..
[js] fetch 를 이용한 HTTP 요청 fetch API는 HTTP 요청을 보내고 응답을 받기 위한 메서드를 제공하는데, 이 중 GET, POST, PUT, DELETE 메서드를 이용하여 요청을 보내는 방법을 정리한다. GET 요청 GET 요청 GET 요청은 서버로부터 데이터를 가져오기 위한 메서드. GET 요청을 보내려면 fetch() 메서드에 URL을 전달하면 된다. fetch() 메서드는 Promise 객체를 반환한다. 따라서 then() 메서드를 사용하여 응답 데이터를 처리할 수 있다. fetch('https://~~') .then(response => response.json()) .then(data => console.log(data)) .catch(error => console.error(error)); POST 요청 POST 요..
[js] 자바스크립트 아코디언(toggle 메서드를 이용한 단순 아코디언) HTML 삽입 미리보기할 수 없는 소스 HTML 제목 1 내용 1 제목 2 내용 2 제목 3 내용 3 CSS .accordion { font-family: Arial, sans-serif; width: 100%; background-color: #f6f6f6; /* 배경색 지정 */ } .accordion-item { border: 1px solid #ddd; margin-bottom: 10px; } .accordion-header { background-color: #eee; color: #333; cursor: pointer; display: flex; justify-content: space-between; padding: 10px; } .accordion-header h3 { margin: 0; ..
[html/css] js 코드 없는 아코디언 "클릭하면 스르륵 답변창이 나오는 게시판?" 결과 See the Pen Untitled by youngwan2 (@youngwan2) on CodePen. HTML 제목▽ accrodionaccrodionaccrodionaccrodionaccrodionaccrodi onaccrodionaccrodionaccrodionaccrodionaccrodionaccrod ionaccrodionaccrodionaccrodionaccrodionaccrodionaccro dionaccrodionaccrodionaccrodionaccrodionaccrodionaccrod ionaccrodion 제목▽ 여기에 추가되는 답변 영역 제목▽ 여기에 추가되는 답변 영역 제목▽ 여기에 추가되는 답변 영역 CSS body { width: 100vw; } /* id *= "" 은..
[js] 카테고리 클릭 시 자동으로 따라오는 밑줄 애니메이션 만들기 결과 - 0.5x 로 각 메뉴를 클릭해 보세요. - 그 후 더 작은 x 배율로 바꿔 보세요. 브라우저 크기에 맞춰 위치가 변경되는 것을 볼 수 있습니다. HTML 삽입 미리보기할 수 없는 소스 HTML 코드 Home About Programs Products Images CSS 코드 body { background-color: mediumaquamarine; } * { list-style: none; } /* nav */ .menu_nav { position: relative; width: 100vw; text-align: center; } /* 유니크 요소 */ .menu_nav .menu_ul { min-width: 600px; } /* 각 리스트 요소 */ .menu_nav .menu_ul .men..
[js] 우주선이 지나가는 진행바(프로그래스바) 완성본(체험용) 예시 코드에 보면 로딩바가 적힌 부분이 있는데, 진행바 이다(오타). - UFO 이미지는 픽시베이에서 링크 해온거라 어느 순간 안 될 수도 있음. HTML 삽입 미리보기할 수 없는 소스 HTML 코드 스크롤 CSS 코드 * { margin: 0; box-sizing: border-box; } body { width: 100%; height: 10000px; background: linear-gradient(160deg, black, black); } h1 { width: 100%; top: 3rem; color: rgb(219, 204, 74); position: fixed; text-align: center; } /* 프로그래스 테두리 */ .progress { position: fix..

반응형