Copy Coding

홈페이지에 보안을 위하여 SSL을 적용하는 것이 얼마나 쉬운지 알아보도록 하겠습니다.

1. 프로젝트 생성

테스트를 위해 SSLProj라는 이름으로 프로젝트를 하나 생성합니다.

나머지 설정 값은 SpringBoot 버전에 따라 수정을 하거나 기본값을 선택해 줍니다.

Dependency에서는 간단한 테스트 용이라 Web만 선택했습니다.

[Finish] 버튼을 클릭하여 소스를 생성합니다.

workspace에 프로젝트가 생성 완료되었습니다.

2. SSL 인증서 생성

명령 창을 관리자 권한으로 하나 열고 path를 생성된 프로젝트의 메인으로 이동합니다.

그리고 keytool 명령어를 입력하여 인증서를 생성합니다.

아래와 같이 대충 입력 값을 기입합니다.

마지막에 y를 입력하면 인증서가 생성됩니다.

keystore.p12 파일이 새로 생성 되었습니다.

3. SSL 인증서 적용

application.properties 파일에 다음 내용을 입력하여 프로젝트에 인증서를 등록합니다.

server.port: 8989

server.ssl.key-store:keystore.p12

server.ssl.key-store-type=PKCS12

server.ssl.key-store-password=test123@!

password는 keytool로 생성할때 입력한 비밀번호입니다.

신규로 프로젝트를 생성하였으니 maven을 설치합니다.

프로젝트에서 maven install을 선택하여 설치합니다.

[INFO] ------------------------------------------------------------------------

[INFO] BUILD SUCCESS

[INFO] ------------------------------------------------------------------------

maven 설치가 성공하면 프로젝트를 실행하고 페이지를 오픈합니다.

아.  생성한 페이지가 없으니 Whitelabel Error 페이지가 나오겠네요.

공인 인증서가 아니다 보니 보기에는 안 좋아도 테스트는 잘 되었습니다.

진짜 서비스를 하려면 공인인증서를 구매해서 교체하면 됩니다.

- copy coding -

작업의 환경에 따라 화면 밝기를 높여야 하는 경우에 어플리케이션까지 밝게 되어 장시간의 작업에 눈이 피로해지는 경우 간단한 설정으로 배경 테마를 변경하는 방법입니다.

1. 배경 테마 변경

DBeaver 를 켜고 상단 메뉴에서 [윈도우 > 설정] 을 선택합니다.

[환경 설정] 팝업이 나타나는데

좌측 메뉴의 [User Interface > 모양]을 선택하면 우측에 [테마] 설정 항목이 나타납니다.

여기서 콤보 박스를 번경하여 [Dark]를 선택하고 [적용] 과 [Apply and Close] 버튼을 클릭해주면

검은색 바탕으로 화면이 변경되어 눈부심으로부터 해방되어 작업이 가능합니다.

2. 기타 색상변경

테마 이외에 세부적인 색상을 변경하기 위해서는 위와 동일한 방법으로 [윈도우 > 설정] 을 선택하여 [환경 설정] 팝업의 띄우고

[User Interface > 모양 > 색상 및 글꼴]

이렇게 한단계 더 들어가는 선택을 해줍니다.

그러면 여러가지 항목에 대해 색상 설정을 변경할 수 있는데 간단하게 query에서 숫자의 색상을 변경해 보겠습니다.

우측에서 스크롤을 내려 [SQL 편집기]를 선택합니다.

[SQL 편집기] 항목을 확장하면 하단으로 이동하여 [SQL number color]를 선택합니다.

[미리 보기]를 확인하면 기본값으로 숫자는 파란색으로 표현되도록 설정이 되어 있습니다.

설정을 변경하기 전에는 숫자가 아래처럼 보이겠죠.

[SQL number color]를 선택하면 우측의 [편집] 버튼이 비활성에서 활성으로 변합니다.

[편집]을 클릭하면 색상표 팝업창이 나옵니다.

[기본 색] 또는 [사용자 지정 색 만들기]로 선택을 할 수 있는데 저는 빨간색으로 선택했습니다.

설정이 빨강색으로 변하고 실제로 표현되는 모양을 하단에 미리보기에서 확인 가능하니 가독성이 좋을 색상으로 선택을 하면 됩니다.

여기서는 숫자를 빨강색으로 선택했으니 아래처럼 바로 색상이 변경됩니다.

변경한 색상을 다시 원상 복구하려면 미리보기 하단에 있는 [기본값 복원] 버튼을 클릭하고 적용해주면 됩니다.

- copy coding -

노트북에 처음으로 안드로이드 스튜디오를 설치하고 기본적인 프로젝트를 생성한 후 실행하려고 하는데 에뮬레이터가 나타나지 않고 아래와 같은 오류가 발생하였습니다. 

Intel HAXM is required to run this AVD. HAXM is not installed

AVD(Android Virtual Device)를 만들 때 에뮬레이터가 HAXM(Hardware Accelerated Execution Manager : 하드웨어 가속 실행 관리자)를 실행 하려는 데 오류가 발생한 것 이라고 하네요.

해결 방법은 Windows의 Hyper-V를 실행하면 된다고 합니다.

Hyper-V 설정 위치를 찾아가는 길을 알고 있으면 바로 설정을 변경하면 되는데 모른다면 아래의 방법을 따라서 찾아가 봅니다.

1. 실행 창을 이용하는 방법

혹시 [프로그램 및 기능] 창의 실행 위치를 알고 있다면 바로 열어도 되는데 모르겠다면

키보드에서 [윈도우 키]를 누른 상태에서 [R] 키를 눌러줍니다.

실행창이 나타나면

appwiz.cpl 을 입력하고 [확인] 버튼을 클릭합니다.

[프로그램 및 기능] 창이 열렸다면 좌측에 있는 [Windows기능 켜기/끄기]를 클릭합니다.

Hyper-V 설정이 있는 팝업창이 나타납니다.

여기서 [Hyper-V]를 찾아 체크를 해주고 [확인] 버튼을 클릭합니다.

2. 검색을 이용하는 방법

위 방법이 번거롭다면 검색을 이용하는 방법도 있습니다.

이렇게 윈도우 창 하단에 있는 돋보기 모양의 아이콘을 클릭해서 검색을 합니다.

그러면 위의 실행 창에 했던 것과 동일한 [Windows 기능 켜기/끄기] 창이 나옵니다.

Hyper-V를 체크하고 [확인] 버튼을 클릭하면 설정이 적용되기 시작합니다.

체크한 내용이 적용되는 진행 창이 나타납니다.

변경이 적용되고 시스템에 반영을 하려면 컴퓨터를 다시 시작 해야합니다.

컴퓨터를 재부팅 하였다면 안드로이드 스튜디오를 열고 프로그램을 다시 실행해 봅니다.

오류 없이 결과를 볼 수 있습니다.

- copy coding -

Visual Studio Code로 파일을 불러왔는데 한글이 깨지면서 아래처럼 모두 물음표로 나오는 경우가 있습니다.

    //id �� �� ����

    $("#input_id").val("set input Value by id");

    //class �� �� ����

    $(".input_class").val("set input Value by class");

    //name���� �� ����

    $('input[name="input_name"]').val("set input Value by name");

Visual Studio Code 프로그램의 언어 설정은 프로그램 하단 우측을 보면 확인하면 알 수 있습니다.

그림에서 보이는 것처럼 현재 VS Code의 언어 설정은 UTF-8로 되어있지만 한글이 깨지는 경우입니다.

이런 경우 불러온 파일의 생성을 UTF-8가 아닌 다른 언어로 설정하여 작업했기 때문에 한글이 깨지는 상황입니다.

원래의 한글 인코딩을 찾기 위해서는 하단에 있는 인코딩 상태 값의 [UTF-8]을 클릭하면 상단 가운데에 다음처럼 [Reopen with Encoding] 메뉴를 볼 수 있습니다.

[Reopen width Encoding]을 클릭하면 문서의 인코딩을 변경할 수 있는 character set 값들이 나오는데

가능하면 한글 인코딩 설정을 먼저 선택해 보고 안되면 가능성 있는 인코딩 값을 선택합니다.

목록에서 [Korean (EUC-KR)을 찾아서 선택해 보았습니다.

    //id 로 값 설정

    $("#input_id").val("set input Value by id");

    //class 로 값 설정

    $(".input_class").val("set input Value by class");

    //name으로 값 설정

    $('input[name="input_name"]').val("set input Value by name");

이제 한글이 제대로 보이는군요.

- copy coding -