자바스크립트 ES6+: fetch를 사용해 blob 데이터 받아오기 (AJAX)

fetch를 이용하면 매우 간단하게 Blob 형태의 데이터를 받을 수 있습니다. await 키워드는 blob 변수를 최초 사용할 때까지만 사용하면 됩니다(await blob). 파일을 전송하는 백엔드 서버(자바 스프링) 만드는 방법은 아래 글을 참고하세요. 그리고 구버전 자바스크립트에서도 사용 가능한 XMLHttpRequest를 사용해 Blob 데이터를 받아오는 방법도 첨부합니다. JSP, Spring: URL을 입력하면 파일이 바로 다운로드되게 하기 자바스크립트: 더보기…

macOS: 내 컴퓨터에서 아마존 EC2로 파일 업로드 (scp 사용)

참고 블로그 문법 scp -i [pem_file] [upload_file] [user_id]@[ec2_public_IP]:[transfer_address] pem_file – 아마존 EC2 인스턴스를 만들 때 발급받은 pem키 파일의 경로를 입력합니다. user_id – 터미널에 접속하면 보이는 빨간색 부분 (또는 루트 디렉토리에서 pwd를 누르면 home/ 뒤에 나오는 정보)이 유저 아이디입니다. ec2_public_ip – 퍼블릭 DNS나 퍼블릭 IP(v4) 중 하나를 사용합니다. transfer_address – 루트 더보기…

macOS: 터미널에서 말하기 명령 사용 (say)

출처 바로가기 (영문) say 텍스트를 들을 수있는 음성으로 변환(음성 합성)합니다. 이 도구는 음성 합성 관리자를 사용하여 입력 텍스트를 음성 음성으로 변환하고, 시스템 환경 설정에서 선택한 사운드 출력 장치를 통해 재생하거나 AIFF 파일로 저장합니다.   문법 say [-v voice] [-o out.aiff | -n name:port ] [-f file.in | string …]   더보기…

자바(Java) 8: 자바스크립트 람다 예제로 알아보는 Stream 사용법

자바 8 이상부터 도입된 Stream이라는 타입은 람다식을 이용해 컬렉션 자료의 순회, 필터링 등을 할 수 있습니다. 자바스크립트에서는 ES5 도입 이후 자주 쓰이는 형태인데 자바의 Stream은 상대적으로 사용법이 낯설기 때문에 동일한 로직의 코드를 비교해가면서 사용법을 알아보도록 하겠습니다. 자바스크립트에서는 배열에서 바로 사용할 수 있지만 자바에서는 List, Set 등 Iterable을 구현하는 자료형이 forEach()만을 더보기…

자바(Java) 8: 람다식에서 콜론 두개 (:: – 이중 콜론 연산자, 메소드 참조 표현식)의 용도와 사용법

자바8 람다식: 자바(Java): 람다식 (Lambda Expression) 기초 (Java 8 이상)   콜론 두개 (:: – 이중 콜론 연산자)의 정식 명칭은 메소드 참조 표현식(method reference expression)이며, 결론부터 말하자면 람다식에서 파라미터를 중복해서 쓰기 싫을 때 사용합니다. 말 그대로 람다 표현식(expression)에서만 사용 가능하고, 사용 방법은 [인스턴스]::[메소드명(또는 new)]으로 사용하는데, 예제를 통해 보는 것이 이해가 빠릅니다. 더보기…

Travis CI (Continuous Integration) + AWS Code Deploy로 깃허브(GitHub)에 올리면 자동 배포되게 하기

Travis CI (Continuous Integration)와 AWS Code Deploy를 이용하면 깃허브에 푸시만 해도 자동으로 웹 서비스가 빌드 및 배포되도록 할 수 있습니다. 하나의 EC2 계정에 여러 레퍼지토리를 빌드 및 배포할 수 있습니다. 아래 차례에서 6번 부분만 조심하면 됩니다. 자세한 내용은 위 출처에 나와 있으며, 이 게시물은 제가 나중에 다시 보기 위해 요약하였습니다. 더보기…

스프링 부트 웹 사이트 예제: 아마존 웹 서비스 게시판 (Spring Boot + JPA + AWS + Travis CI)

개요 이 예제는 예전에 만들었던 Spring Boot 예제: 초간단 게시판 과 비슷한 예제인데, 이클립스 대신 인텔리제이 커뮤니티 버전을 바탕으로 이전에 사용하지 않았던 JUnit 단위 테스트, JPA, Lombok 등을 사용하였고, 아마존 웹 서비스와 Travis CI라는 자동 배포 서비스를 이용해 외부 인터넷 상에서 접속할 수 있도록 하였습니다. 과정의 대부분은 스프링 부트와 AWS로 혼자 구현하는 웹 더보기…

아마존 웹 서비스 카카오체크카드로 프리 티어 가입 + EC2 서비스 생성

카카오체크카드로 아마존 웹 서비스 가입이 가능합니다.   1) 아마존 웹서비스 회원가입 페이지 접속   2) 이메일 및 비밀번호 입력   3) 주소 및 카드 정보 입력(비자, 마스터카드 등 국제 결제 가능 카드)   4) 핸드폰 ARS 인증 진행   5) 지원 플랜 선택에서 기본 플랜(무료) 선택   6) 상단 메뉴에서 더보기…

스프링 부트(Spring Boot): 구글 로그인 연동 (스프링 부트 스타터의 oauth2-client) 이용 + 네이버 아이디로 로그인

  이 방법은 JSTL, Thymeleaf, Mustache 등 서버 사이드 템플릿 엔진을 사용하는 로그인 방법입니다. SPA에서 사용할 수 있는 소셜 로그인 연동 방법은 아래 글을 참고하세요, 스프링 부트(Spring Boot): SPA에서 사용할 수 있는 OAuth2 소셜 로그인 (구글, 페이스북, 깃허브) 순서 build.gradle에 디펜던시 추가 application-oauth.properties 작성 + .gitignore 등록 Role enum 클래스 더보기…

구글 OAuth2 연동용 클라이언트 아이디 및 비밀번호 발급받는 방법

1. 구글 클라우드 플랫폼(https://console.cloud.google.com/) 에 접속합니다. 2. 빨간색 네모 부분을 클릭합니다. 기존에 생성된 프로젝트가 없다면 [프로젝트 선택]이라는 문구가 표시됩니다.   3. [새 프로젝트] 버튼을 클릭합니다.   4. 프로젝트 이름을 입력하고 [만들기] 버튼을 클릭합니다.   5. 왼쪽 [API 및 서비스] 메뉴의 [대시보드] 를 클릭합니다.   6. 방금 만든 프로젝트를 선택합니다.   더보기…