배움을 기록으로

프로젝트에 처음 투입되어 개발환경을 세팅할 때, 서버나 DB 접속 정보가 정확한 경우에도

연결이 안되는 경우가 종종 발생하곤 한다.

이런 경우, 보통 방화벽이 막혀있는 경우가 대다수이며 방화벽 차단 여부를 확인하기 위해

telnet 명령어를 주로 활용한다.

윈도우의 경우 telnet 명령어를 사용하기 위해서는 간단한 설정이 필요하여 해당 포스팅을 통해

telnet 활성화 방법 및 telnet, ping 명령어의 사용법 등을 정리하고자 한다.

1. TELNET

1.1. 개념

'텔넷(telnet) 이란?'

• 텔넷(telnet)은 인터넷이나 로컬 영역 네트워크 연결에 쓰이는 네트워크 프로토콜
• 보통 해당 포트(Port)에 접속 가능한지 확인하는 용도로 사용
• 예) DB connection 에러, 원격 접속 실패 등

telnet [IP] [PORT]
예) telnet 142.250.206.206 443

1.2. 텔넷 활성화 (Windows 10 기준)

• 윈도우에서는 텔넷을 활성화하지 않고, 텔넷 명령어 실행이 불가하다.

• 시작메뉴 > Windows 기능 켜기/끄기 실행
  (제어판 > 프로그램 > 프로그램 및 기능 > Windows 기능 켜기/끄기)

• 텔넷 클라이언트 기능 활성화

• 다시 telnet 명령어 실행하여, 텔넷 활성화 여부 확인

1.3. 텔넷 사용법 (Windows 10 기준)

• '시작메뉴' 또는 '윈도우즈키 + R'로 실행창 실행 후 '명령 프롬프트' 실행

• telnet 실행

2. PING

2.1. 개념

'IP 접속 가능 여부만 확인하고 싶을 때는?'

• ping은 IP 네트워크를 통해 특정한 호스트가 도달할 수 있는지의 여부를 테스트
• 네트워크 상태를 점검하는 가장 기본적인 명령어
• 패킷을 보낸 후 대상 컴퓨터가 이에 대해 응답하는 메시지를 보내면 이를 수신, 분석하여 대상 컴퓨터가 작동하는지,
  또는 대상 컴퓨터까지 도달하는 네트워크 상태가 어떠한지 파악

ping [IP 또는 도메인] [옵션]
예) ping 142.250.206.206 -a

2.2. 핑(ping) 사용법

• 텔넷과 동일하게 cmd 창에서 진행
• 텔넷처럼 활성화가 따로 필요하지는 않다.
  

References

https://taewooblog.tistory.com/130

https://server-talk.tistory.com/53

디지털 ARS 관련 업무 프로세스 분석 중 온라인 결제 방식인 인증/비인증 결제에 대한 부분을 정리하고자 한다.

1. 인증결제

 1.1) 인증결제란?

    고객이 직접 보안 및 금융 프로그램을 통해 카드 또는 휴대폰 번호 등 본인의 정보를 입력을 통해

    인증을 진행하고 결제하는 방식

 1.2) 장단점

   - 장점

       > 비교적 높은 안정성 및 신뢰성

       > 고객이 직접 인증 후, 결제하기 때문에 사업자의 법적인 책임이 비교적 덜함

   - 단점

       > 고객 입장에서 보안 프로그램 설치 등 결제 절차가 복잡함

       > 구매도달률이 상대적으로 낮다.

 1.3) 종류

   - 온라인 PG : 카드사와 PG사(결제대행사)를 통해 온라인 '비대면인증결제'를 할 수 있도록 하는 솔루션

       > 종류: 나이스페이, 이니시스, 다우페이 등

2. 비인증결제

 2.1) 비인증 결제란?

    - 비인증결제 솔루션을 통해 고객의 카드번호 및 카드 날짜를 입력하거나 등록해놓고 결제를 진행하는 방식으로

      고객의 별도 인증 없이 결제를 요청하는 방식을 통칭

 2.2) 장단점

   - 장점 (=인증 결제의 단점)

       > 간편하다.

       > 구매도달률이 높다.

   - 단점 

       > 보안상 이슈가 발생할 확률이 높음.

       > 사업자의 법적인 책임이 상대적으로 크다.

 2.3) 종류

   - 정기/구독 결제 : 최초 등록된 결제정보로 "반복" 결제가 이루어지는 방식  ex) 넷플릭스, 유튜브 프리미엄 등

       * 정기적으로 같은 일자에 결제가 되는 방식이 아닌 등록된 결제정보로 재결제가 되는 방식도 정기/구독 결제에

         포함됨  ex) 카카오 택시, 따릉이 등

   - 키인(수기) 결제 : 구매자 인증 없이 카드번호 입력만으로 결제되는 방식 (일회성)  ex) CGV, 코레일, ARS 결제 등

4. 정리

 디지털 ARS가 모바일 화면을 통해 고객에게 노출이 되고, 모바일에서는 인증 결제를 통해 결제를 진행하고 있어

 인증 결제로 진행해도 무리는 없어 보이나, 타사 보이는 ARS 사례나(SK스토아) ARS 특성(간편함)을 생각한다면

 간편 결제로 진행하는 것이 맞는 것으로 판단된다.

<리액트의 컴포넌트 LifeCycle>

 - 이 싸이클을 알아야 컴포넌트를 만들 때 효율적으로 만들 수 있다.

Render 싸이클: componentWillMount( ) -> render( ) -> componentDidMount( )

 - willMount : 사이클이 시작되었음을 확인

 - render: 컴포넌트가 리액트 세계에 '존재'하게 되었음을 확인

 - didMount : 성공적으로 리액트 세계에 컴포넌트가 자리잡았음을 확인

ex) 영화앱을 만든다고 치면,

     will Mount 에서 api에 작업을 요청

     render 에서 데이터 관련 작업 등... 

     각 단계에 맞는 작업을 작성하여 효율적으로 처리한다.

Update 싸이클 : componentWillReceiveProps( ) -> shouldComponentUpdate( ) -> componentWillUpdate( ) -> render( ) -> componentDidUpdate( )

 - componentWillReceiveProps : 컴포넌트가 새로운 props를 받았다는 뜻

 - shouldComponentUpdate : old props, new props를 살펴보고 old와 new가 다르면 '업데이트=true'로 업데이트가 발생하도록 함

 - componentWillUpdate : 업데이트를 직접적으로 하는 단계

 - render : 렌더링 작업

 - componentDidUpdate: 업데이트가 완료되었음을 확인      

ex) component will update 를 수행할 때, 어플리케이션에 '뱅글뱅글 돌아가는 spiner'를 붙혀서, 업데이트중임을 표시할 수 있고,

     업데이트 이 후에는(componentDidUpdate), 돌고있던 spinner를 숨기면 됨

<create-react-app>

 : 리액트 입문 시, 초반 복잡하게 설정하는 부분을 빼고, 바로 리액트 프로젝트를 만들 수 있는 도구

0. 설치해야할 것

1. node js

2. npm

3. yarn

4. create-react-app 도구

5. visual studio code (에디터)

6. git

cf. 2~4번은 윈도우 cmd를 이용하여 설치

1. node js 설치

 - https://nodejs.org/ko/ 에서

 - 8.12.0 LTS 버전 설치

 - cmd에서 node --version으로 설치 확인

 - 개발 폴더 생성 ( 경로: C:\dev\react )

2. npm 설치

 - npm은 node js 패키지 매니저로, 모듈을 설치할 수 있게해준다.

 - npm은 node js 와 함께 설치된다. node js를 설치했다면 기본으로 설치되며, 따로 설치할 필요 없음

3. yarn 설치

 - yarn 도구는 npm 문제점을 개선한 패키지 매니저로, 패키지를 훨씬 빨리 설치할 수 있다.

 - npm을 통해 설치해야한다.

 - npm install --global yarn

 - 설치확인: yarn --version

4. create-react-app 도구 설치

 - yarn 또는 npm을 통해 설치

 - yarn 권장 (npm 지역적, yarn 전역적으로 사용 가능, 모든 디렉토리에서 create-react-app을 사용해야하므로 yarn을 선택)

 - yarn global add creat-react-app

5. 프로젝트 생성

 - npx를 이용해서 프로젝트를 생성한다. (윈도우일 경우 npx로 해야지 정상적으로 생성된다)

 - npx create-react-app todo-list 를 하면 1~3분 정도 소요되며, 프로젝트가 생성된다.

 - 생성된 todo-list 프로젝트로 이동 (cd todo-list)

 - yarn으로 프로젝트 시작

 - yarn start 

6. 정리

 - node js 설치 후 개발 디렉토리 생성

 - yarn 설치 (npm install --global yarn)

 - create-react-app 글로벌 설치 (yarn global add create-react-app)

 - 프로젝트 생성 npx create-react-app todo-list)

 - 프로젝트 디렉토리로 이동 (cd todo-list)

 - yarn으로 프로젝트 시작 (yarn start)

출처) https://liante0904.tistory.com/128

       리액트를 다루는 기술 (김민준 / 길벗 )

구분 )

1. 기존의 웹 페이지가 모바일 화면에 맞춰진 것 : 모바일 웹

2. 웹 페이지를 앱처럼 보이게 만들어 놓은 것 : 웹 앱

3. 웹 앱이지만 마켓에서 다운로드 받을 수 있고, 하드웨어 제어가 가능 한 것 : 하이브리드 앱

4. OS 언어로 개발되고, 마켓 다운 및 오프라인에서도 작동하는 전형적인 앱 : 네이티브 앱

선택 방식 )

 - 업데이트가 빈번한 콘텐츠형 서비스 : 웹앱, 하이브리드앱

 - 마켓에서 판매를 목적으로 하는 서비스 : 하이브리드앱, 네이티브앱

 - PUSH 가 꼭 필요한 서비스 : 네이티브앱, 하이브리드앱

 - 속도가 매우 중요한 서비스 : 네이티브앱

 - 배포와 빠른 서비스 접속이 중요한 서비스 : 웹앱

 - 저비용으로 구현해야하는 경우 : 웹앱, 하이브리드앱

 - 고객사에 납품해야하는 앱인 경우 : 네이티브앱

정리 )

 - 속도 : 웹앱

 - 성능 : 네이티브앱

 - 중간 : 하이브리드앱

참고) https://muluti.wordpress.com/2013/08/30/%EC%95%A0%EB%A7%A4%ED%95%9C-%EC%9B%B9%EC%95%B1web-app%EC%9D%98-%EA%B0%9C%EB%85%90%EC%9E%A1%EA%B8%B0/