풍성한 한가위 되세요~

작성자: -
풍성한 한가위 되세요~
사랑하는 반려동물과 함께 넉넉하고 풍성한 한가위 되시길 바랍니다.




아이프렌즈펫 구경하기
http://bit.ly/2QNS98c

댓글

댓글 쓰기

주간 인기글

SPA(Sigle Page Applications) 란 무엇인가?

작성자: -
이미지
먼저 SPA (Single Page Application)가 필요한 이유부터 살펴 보면, 단일 페이지 응용 프로그램은 수년간 사용되어 왔지만 일반적인 웹상에서는 찾아보기가 어렵습니다.

그렇지만, 앞으로 많은 웹사이트가 SPA로 개발될 아주 좋은 계기가 있습니다.

SPA는 SaaS (Software as a Service) 플랫폼 또는 인터넷 서비스의 상황판 같은 대시보드 부분을 구축하고 기업의 데이터 기반 및 폼 기반 애플리케이션을 구축하기 위해 지난 몇 년 동안 많이 채택되어  왔으며, 추후에 개발될 웹 어플리케이션에서 우선적으로 고려될 것으로 예상되어 집니다.



그러면 Angular2(이하 Angular)로 개발하는 어플리케이션은 SPA로 개발해야 하는 건가요?

처음 Angular2를 접하게 되면 당연히 SPA로 개발 된다고 생각할수 있지만, 다르게 구축할 수도 있습니다.



SPA는 단순하게 다음과 같이 정의해 볼 수 있습니다.

1개의 페이지만 있는 어플리케이션

실제 SPA 확인해보고 싶으시면 남도패스 사이트(https://m.namdopass.co.kr)를  방문해보면 알수 있습니다.

하단의 홈/지역별/로그인/남도패스 각각 메뉴를 이동해 보면 실제 하나의 페이지에서 내용만 바뀌는 것을 확인할 수 있습니다.

웹사이트를 둘러보기를 시작하면 페이지가 완전히 다시 로드되지 않는다는 것을 알 수 있습니다. 화면 전환 시마다 REST API 서버를 통해 데이터를 바인딩하고 있습니다.

그럼 SPA 구축 할 때의 장점은 무엇이며 어떻게 작동하는지 살펴보면

남도패스 사이트(https://m.namdopass.co.kr) 첫화면을 소스보기 해보면

자세한 내용 보기

[앱 디자인] 디자인 가이드 만들기 - 안드로이드

작성자: -
이미지
*아이프렌즈펫 앱 디자인 가이드 경험을 공유합니다. 이게 처음 작업한 앱 디자인 가이드라서 미흡한 점이 많을 수도 있는데 문제가 있는 부분이 있다면 댓글로 알려주시면 반영하겠습니다 ^^

* 안드로이드 앱 디자인 가이드 작업의 특징

안드로이드의 해상도입니다


보시다시피 어마어마하게 많습니다 ^^ 이 모든 해상도를 일일이 지원할 수가 없어요~
그래서 몇 가지 대표적인 해상도를 지원하는 방향으로 가이드를 잡고 이미지 작업을 합니다.

아이프렌즈펫의 경우에는 저해상도, 중간 해상도, 고해상도 3개를 지원해서

720 x 1280
1080 x 1920
1440 x 2560

이 세 가지로 이미지를 오렸구요, 가이드는 720 x 1280 기준으로 작업했습니다.

*좌표
안드로이드는 상대 좌표로 작업합니다. 워낙 다양한 폰 사이즈 때문에 절대 좌표로 잡기 어려워요. 그래서 가이드에 중요한 정보는 좌표보다는 간격, 크기입니다.

*색상값 
#123456 헥사 컬러 코드를 주로 사용합니다. 가이드에 이 값을 표기해주세요.

*이미지 작업
수치값 계산 작업을 했다면 아이콘 등등을 잘라서 PNG 로 공유합니다.

이건 당연히 해상도별로 아이콘을 오려야 하는데요... 수치값은 720 기준으로 했다 하더라도 1440 등 다른 해상도 기준으로도 아이콘을 잘라드려야 합니다.

따라서 당연히 이미지는 Vector 아이콘으로 작업하셔야합니다 ^ㅁ^ Ctrl + I 눌러서 해상도 크기 늘리시면 되구요 (디자인 경력 1개월 미만을 위한 충고 ㅋ )

이미지 버튼의 경우
단순한 사각형, 원형 같은 버튼의 경우 코딩으로 작업이 가능하지만 특별한 모양의 버튼의 경우 이미지를 잘라드려야 하는데요, 버튼을 자를 때는 기본적으로 세 가지 상태에 대해서 만들어 주셔야 합니다. (경우에 따라 한두가지 필요없는 게 있을 수 있구요)



* 나인 패치

안드로이드에서는 앱 퍼포먼스를 높이기 위해 최소한의 그래픽으로 화면을 표현합니다. 그래서 나온 특별한 것이 '나인 패치'인데요.


이렇게 생긴 이미지 파일이구요 (단순 PNG) 아래…
자세한 내용 보기

[ubuntu] 신규 계정에 sudo 권한 추가하기

작성자: -
이미지
NCP 에서 신규 서버를 생성하면  AWS 와는 다르게
root 계정과 패스워드를 발급해 줍니다.
해당 계정정보를 잘 보관한 후 실제 사용할 계정을 생성해서 서버를 관리하게 됩니다.


1. 우선 ubunbu 에서 신규 계정을 생성  합니다.


# adduser namsan cs


namsan 이라는 계정을 생성하고 패스워드를 설정하였습니다.






2. 신규 생성된 계정으로 전환 후 명령어를 실행해 봅니다.

su 명령어를 통해 신규 생성 계정으로 전환 합니다.

# su namsan cs
sudo 명령어를 실행해 보겠습니다.

# sudo date cs


“namsan is not in the sudoers file.  This incident will be reported.” cs
sudoers file 에 해당계정이 포함 되어있지 않다는 메시지가 출력됩니다.


/etc/sudoers 에 신규 계정이 추가 되어 있지 않아 표출되는 에러 메시지 입니다.


다시 root 계정으로 전환하여 sudoers 파일을 수정해보겠습니다.

su 명령어를 통해 다시 root 계정으로 전환 합니다.

# su root cs



3. vi 명령어를 통해  /etc/sudoers 파일을 편집합니다.

# vi /etc/sudoers cs

# User privilege specification 항목에 아래와 같이 신규 생성된 계정 정보를 추가합니다. root  ALL=(ALL:ALL) ALL namsan  ALL=(ALL:ALL) ALL cs 이제 신규 생성된 사용자로 전환하여 sudo 명령어 실행 시 정상적으로 작동하는 것을 확인 할 수 있습니다.
자세한 내용 보기

Nodejs 날짜 관련 유용한 moment.js

작성자: -
안녕하세요. 남산돈가스입니다.

오늘은 제가 개인적으로 Node JS를 개발하면서 굉장히 유용하게 사용하는 모듈을 소개드리려고 합니다.

데이터들을 처리하는 과정에서 꼭 빠지지않는 것들이 날짜 데이터들이죠.

이 날짜 데이터들을 아주 유연하게 변경 및 비교, 계산까지 해줄 수 있는 것이 이 moment.js라고 할 수 있습니다.

지금부터 moment.js를 설치하고 사용하는 방법에 대해서 간단하게 소개드리겠습니다.

먼저 moment.js 모듈을 설치하기 위해서 npm 명령어를 실행합니다.

npm install --save moment
moment가 설치되었다면 이제 간단하게 사용법을 익혀보겠습니다.


◆ moment 선언

let moment = require('moment'); ◆ 현재 시각

console.log(`moment => ${moment()}`)//moment => Mon Jan 15 2018 10:50:08 GMT+0900
◆ Date 객체로부터 초기화 *month는 -1 값 지정

console.log(`Date to moment => ${moment(new Date(2018,0,15))}`);//Date to moment => Mon Jan 15 2018 00:00:00 GMT+0900
◆ 포맷을 지정하여 출력

console.log(`포맷 지정 출력 => ${moment().format("YYYY년 MM월 DD일")}`)//포맷 지정 출력 => 2018년 01월 15일 console.log(`포맷 지정 출력 => ${moment().format("YYYY-MM-DD HH:mm:ss")}`)//포맷 지정 출력 => 2018-01-15 11:01:16
◆ 단위 별 출력

console.log(`연도 => ${moment().year()}`)//연도 => 2018 console.log(`월 (※ 0〜11의 값)=> ${moment().month()}`)//월…
자세한 내용 보기

[Android] Parcelable 에 대한 쉬운 이해

작성자: -
이미지
안녕하세요 명동 콜링입니다.

오늘은 Android에서 Model Class를 다룰 때 사용하는 Serializable 의 한 분류인 Parcelable에 대해 써보려고 합니다.

일단 Serializable이란 무엇인가, 영어의 뜻을 풀이하자면 '직렬화' 라고 얘기할 수 있는데 막연히 '직렬화' 라고 얘기하기엔 무슨 뜻인지 이해 하기 어렵습니다. 그래서 Android 시스템에서 동작하는 방식으로 이야기 하자면,

A Activity에서 B Activity로 데이터를 전달할 때, 데이터를 묶어서 전달한다
 라고 쉽게 풀이할 수 있습니다. 이해를 하는데 도움이 되도록 많이 함축된 문장이지만 이 안에는 "하나의 Class화 된 여러 데이터들이 순서대로 Byte형식으로 변환되어 A -> B로 전달된다." 는 식의 어려운 말 들이 포함되어 있기 때문에 패스를 하도록 하겠습니다.
 여기까지 Serializable의 정의에 대해 간단히 알아봤고 이제는 본격적으로 이 글의 주제인 Parcelable에 대해 알아보도록 합시다.
 일단 Parcel, '소포', '꾸러미' 라는 뜻을 가지고 있습니다. 이 단어의 뜻처럼 Android에서의 Parcel이라는 것도 "여러 데이터가 하나의 꾸러미(Class) 안에 담겨 있다." 라는 의미를 가지게 됩니다. 그래서 이 데이터 꾸러미가 A Activity에서 B Activity로 한꺼번에 전달되고 받아 볼 수 있도록 해 주는 것이 Parcelable의 의미가 되겠습니다.
 그럼 이 Parcelable을 어떻게 사용하는 지 보도록 하겠습니다.
1. 클래스 정의
 먼저 Data(Model) Class를 하나 만들어 보도록 합니다.
public class ProfileCls { String name;int age;String gender;}
간단하게 이름, 나이, 성을 입력 할 수 있는 Class를 만들었습니다. 이 상태에서는 A Activity…
자세한 내용 보기