전체 글

발단이전 게시글에서 html2canvas를 이용하여 화면 스크린캡처 후 이미지 저장 기능을 구현해봤다.회사에 출근해서 바로 프로젝트에 적용해봤는데 생각지 못한 이슈가 있었다..! 이미 공식문서를 통해서 봐서 알고있었지만, html2canvas는 DOM을 canvas에 그린 후 image로 데이터를 내려받는 형식이라서 이 과정에서 css스타일이 빠지거나, svg이미지와 같은 요소들은 누락이 되었다 이 라이브러리를 프로젝트의 들일 때의 요건 사항으로는 테스트 기간에 QA가기능/UI테스트 이미지 증적을 쉽고 빠르게 업로드 할 수 있도록 하기 위함이였고,지금 개발중인 시스템은 컨텐츠나 디자인적요소가 많아  화면 캡쳐가 깨져버린다면 무슨소용이람? 싶었다🤷‍♀️그래서 htlml2canvas말고 다른 대안의 라이브..

SI프로젝트에서는 아직 많은 환경이 폐쇄망에서 이루어 진다.내가 있는 금융권 프로젝트는 특히 더더욱 그러함😂🤣 그래서 이러한 요구사항이 나온적이 있다. 단위테스트/통합테스트 단계에서 결함 이미지를 따서 이미지를 반입요청하고, 이를 프로젝트 관리시스템(PMS)에 업로드하기까지 너무 번거롭다는 것이다..! 그래서 테스트기간 중 화면에 챗봇버튼처럼 플로팅 버튼을 두어 클릭하면 해당 화면을 캡처하면 해당 프로그램에 대한 정보로 PMS업로드 까지 연결해달라는 것!   그래서 알아보았다!화면을 캡처하고 이미지로 내려받게하는 아주 요긴한 라이브러리~이름하여 'html2Canvas' !  이미지 캡처를 도와주는 라이브러리에는 html2canvas, dom-to-image, html-to-image 등 여러개가 있지..

service-worker.ts/// /* eslint-disable no-restricted-globals */import { clientsClaim } from 'workbox-core';import { ExpirationPlugin } from 'workbox-expiration';import { precacheAndRoute, createHandlerBoundToURL } from 'workbox-precaching';import { registerRoute } from 'workbox-routing';import { StaleWhileRevalidate } from 'workbox-strategies';declare const self: ServiceWorkerGlobalScope;clients..

Classes Dart는 객체지향 프로그래밍(OOP) 언어이다. 자바 공화국의 나라에서 대부분의 개발자들은 JAVA를 통해 이미 객체지향에 대해서 알고 있을지도 모른다.객체지향에서 실제 현실세계를 대상을 반영한 객체(Object)를 메모리에 작성되어 인스턴스(Instance)가 된다.이 인스턴스화를 위해 설계도가 필요한데, 이 설계도가 바로 클래스(Class)이다. 클래스 안에는 해당 객체가 표현할 수 있는 속성을 가지는데 이를 프로퍼티(Property)라고 한다.  Constructors(생성자)생성자는 인스턴스화 하는 방법을 제공하는 메소드이다.Dart는 기본 생성자를 제공하는데 기본 생성자는 클래스의 이름과 생성자의 이름을 동일하게 사용하여야 한다.  클래스와 생성자를 정의하는 방법은 아래 코드와 ..

Typedeftypedef 키워드는 타입에 alias를 참조하게 만드는 방법이다.복잡한 프로그램을 만들때 자료형을 명확히 하여 개발자로 하여금 헷갈림을 방지하는데에 도움이 될 수 있기 때문에 꼭 알아보자! 코드 예제로 알아보자. 예를 들어 아래 코드와 같이 숫자 List를 역정렬하여 반환하는 reverseListOfNumbers라는 함수가 있다고 하자.List reverseListOfNumbers(List list) { return list.reversed.toList(); } void main() { List list = [1,2,3,4,5]; print(reverseListOfNumbers(list)); } 이때 함수 사용을 위해 반복적으로 사용되는 List라는 타입이 해당 함수를 위한 것임을 typ..

'이가 없으면 잇몸으로 살겠다'_며 Postgresql의 merge문이 없음을 한탄하며 UPSERT썼던 이 글을 쓴지도 벌써 어연 4년이 지난 지금...!  PostgreSQL 15 릴리즈 부터 Merge문을 공식적으로 지원하기 시작했다!  아니 이놈들아~ 하면 되잖여~ 이걸 왜 이제 해줬냐며~~아무튼 신나는 마음으로 궁디빵디를 흔들며 호다닥 공식 문서를 읽으러 들어가보자😙🥳   ✔️ 공식 문서에 따르면 15버전 이하의 버전에서는 아직 INSERT ... ON CONFLICT 구문을 사용하여UPSERT문을 써서 사용해야한다고 공지하고 있으니, 현재 개발하는 환경의 DB버전을 꼭 확인해보고 쓰자!  문법(Syntax)Merge 구문은 이미 오라클을 썼던 분들이라면 익숙할테지만 한번 더 톺아보고 가자.M..

Functions파라미터는 크게 positional parameter와 named parameter가 존재한다.positional parameter는 순서에 따라 파라미터의 값을 넣어주는 것이고, named는 '이 파라미터가 어떤 파라미터다~' 라고 명시해줌으로써 코드를 작성하는 것을 의미한다. Named Parametersdart에서 function을 만들 때 arguments는 기본적으로 null이 될 수도 있다.named parameter는 function 내부에서 parameter를 참조하였으나, 호출부에서 정의해주지 않아서 런타임 에러가 발생할 수 도 있는 위험을 제거하고자 할 때 사용한다.예를 들어, 아래와 같은 sayHello라는 메소드가 있다고 정의해보자.String sayHello(Str..

Data TypesDart의 기본 자료형은 다음과 같다Dart 자료형의 종류string : '' 또는 "" 둘 다 사용 가능하여 초기값 정의 가능, $ 또는 ${}를 통해서 변수의 값을 차용하여 사용할 수 있다. boolintdoubleObject (class) : String, int, double과 같은 자료형도 타입정의가 class로 이루어진 객체 타입이다.List : collection if, collection for를 지원MapSet ListCollection-Ifcollection if는 List를 만들 때 조건으로 있을수도 없을수도 있는 값을 추가할때 사용할 수 있다.코드로 예를 들자면, 기존의 클래식한 코드스타일 가이드에서 조건에 의해 List의 요소를 추가한다면 아래와 같은 방식으로 코..