개발9 콜백함수 콜백함수란? 01. 정의 예시) addEventListener 예시) 콜백 함수를 사용하는 고차 함수 - map(), filter(), reduce() 02. 설명 예시) 덧셈을 출력하는 로직 03. 용도 01. 순차적 실행 보장 02. 로직의 추상화 04. 콜백 함수의 장단점 05. 정리 정의 콜백 함수는 다른 함수의 인자(파라미터)로써 넘겨지는 함수 특정 이벤트에 의해 호출되는 함수 예시) addEventListener button.addEventListener("click", myFunction); function myFunction() { document.getElementById("demo").innerHTML = "Hello World"; } addEventListener 함수에 안에 myFu.. 2023. 2. 6. [FE/Test] MSW에 대하여 MSW(Mock Service Worker)란? MSW는 Mock Service Worker로 서비스 워커를 이용하여 API를 모킹하는 라이브러리입니다. 즉, 서비스 워커 API를 활용하여 네트워크 요청을 가로채 MSW에 전달하여 handler에 정의된 모의 응답을 받습니다. mocking(모킹) : 테스트하고자 하는 코드가 의존하는 함수나 클래스에 대해 가짜 객체를 만드는 기법 도입하기 1. msw 설치 yarn add msw --dev 2. 핸들러 정의 src/mocks/handlers.js 생성 REST API, GraphQL API 두가지 유형의 API를 mocking 할 수 있습니다. 여기선 rest api를 mocking하기 위해 rest를 import합니다. api 요청 시도를 위해 함수를 .. 2023. 2. 4. PWA 도입하기 - CRA 4.x 버전에서 PWA 도입하기 Progressive Web App (이하 PWA)? PWA는 'Progressive Web App'의 줄인 말로, 모바일 사이트에서 네이티브 앱과 같은 사용자 경험을 제공하는 기술입니다. 즉, 웹 기술을 통해 모바일 앱과 같은 경험을 할 수 있게 합니다. PWA는 서비스 워커 파일을 활성화시켜 서비스가 백그라운드에서 동작하게끔 만듭니다. 핵심은 이 서비스 워커란 녀석입니다. 서비스워커는 브라우저가 백그라운드에서 실행하는 스크립트이며 웹 페이지와 별개로 동작합니다. 서비스 워커에 대한 내용은 다음 글에서 살펴보도록 하고, 본 글에선 PWA 도입을 위한 서비스 워커 활성화 방법과 PWA로 구현할 수 있는 기능에 대해 살펴보겠습니다. PWA로 무엇을 할 수 있을까? 앞서, PWA에 대한 설명 중 앱과 백그라.. 2023. 2. 4. 스프링에서 데이터베이스를 다루는 방법 개요 웹서비스를 개발 및 운영함에 있어 피할 수 없는 문제는 데이터베이스를 다루는 일입니다. 데이터베이스를 다루기 위해 사용되는 JDBC, SQL Mapper, ORM에 대해 알아보고자 합니다. 들어가기 앞서... 먼저, 당연히 데이터베이스를 사용하는 이유는 우리가 다루는 이 데이터들이 프로그램이 종료되어도 사라지지 않고 어떤 곳에 저장하기 위함입니다. 이러한 개념을 영속성(Persistence)라고 부릅니다. JAVA에서는 데이터의 영속성을 위해 JDBC(Java Database Connectivity) 라고 불리는 자바 API를 지원해줍니다. 하지만, JDBC에서 DB에 접근하여 SQL을 수행하고, 결과값을 다시 dataType으로 매핑시켜주는 작업을 일일히 수행해야 하는 번거로움이 존재합니다. 이러.. 2023. 2. 4. 웹의 렌더링 기술: CSR vs SSR 개요 "Web Rendering" 기술 방식에는 Client Side Rendering(CSR) 방식과 Server Side Rendering(SSR) 방식이 존재합니다. 우리가 흔히 알고 있는 프론트엔드 프레임워크/라이브러리는 Vue와 React가 있습니다. 이는 대표적인 Single page application(SPA) framework으로 Client Side Rendering(CSR) 방식으로 View를 만듭니다. 반면, PHP는 Multi page application(MPA) 방식으로 Server Side Rendering(SSR) 방식으로 View를 만듭니다. 본 글에서 각각의 방식에 대한 차이와 장단점에 대해 알아보고, 모던 웹페이지는 어떤 방식을 채택하는 지 알아 보겠습니다. (참고로 .. 2023. 2. 4. 이전 1 2 다음 728x90 반응형
