남산 아래 개발자들

안녕하세요. 남산돈가스입니다.  이번 포스팅에서는 웹을 개발하면서 가장 골칫거리지만 자주 쓰이게 될 수 있는 파일 업로드 기능 구현에 대해서 포스팅하려고합니다.  하지만 일반적인 파일업로드가 아닌, Lambda로 S3에 파일을 업로드 시키는 함수를 생성하고, 해당 Lambda함수를 API Gateway에 연결하여 multipart-form 형식으로 파일을 업로드하는 Serverless 파일업로드를 구현할 예정입니다.  이런 방식으로 업로드기능을 구현하게 되면, 추후에 어디든지 파일업로드 기능을 쓸 수 있는 Micro Service가 될 수 있습니다. 포스팅은 다음과 같이 3회에 걸쳐 진행되겠습니다. #1. Lambda 함수 생성 #2. API Gateway, S3 셋팅 #3. API Gateway - Lambda 연결 및 테스트 그렇다면 지금부터 그 첫번째 단계인 Lambda 함수 생성을 진행해보겠습니다. 먼저 Lambda 서비스에 접속한 뒤 Node.js 기반의 새로운 함수를 생성합니다. 함수를 생성하면 아래와 같이 트리거가 추가되지 않은 날것의 함수가 생성된 것을 확인하실 수 있습니다.  쥐도 새도 모르게 변하는 AWS 콘솔 덕분에(?) 매번 포스팅할 때마다 Lambdad의 콘솔화면이 다채롭게  변하고있네요...ㅎㅎ 기존의 포스팅에서는 위 사진처럼 인라인으로 편집하는 포스팅만 진행했었는데 금번 포스팅에서는 외부 node_module을 사용하는 경우라 로컬에서 작업한 소스를 ZIP파일 형식으로 업로드하여 함수를 생성해보겠습니다. 로컬 터미널에서 upload라는 폴더를 생성하고 index.js을 생성합니다. index.js 그리고 해당 함수에 필요한 node_module을 install 하기 위해서 npm install 명령어를 사용합니다. 필요 모듈 aws-sdk : AWS javascript sdk 모듈 parse-multipart : multipart형식으로

부트스트랩, Angular 등을 하다보면 부수적이지만 자주 접하게 되는 것이 있습니다. 바로 font-awesome !! ( http://fontawesome.io/ ) 각종 아이콘을 폰트로 만들어 css 만 임베딩하면 다양한 아이콘을 폰트처럼 쓸 수 있는 CSS Toolkit 입니다. font-awesome 등 아이콘 검색하기 https://glyphsearch.com/ <i class="fa fa-bandcamp"></i> 이런 식으로 아이콘을 만들어 쓰면 우선 수십개의 아이콘을 CSS에서 색상, 크기 등을 코드 한줄로 자유롭게 수정할 수 있기 때문에 사용이 굉장히 편리하구요 이미지로 할 경우 padding, margin 주면서 복잡하게 레이아웃을 맞춰야하는데 폰트 기반이다 보니 아무래도 정렬 등도 덜 신경쓰면서 웹페이지를 만들 수 있어 좋습니다. 그런데 아무리 600가지가 넘는 아이콘을 font-awesome 에서 제공한다 하더라도 모든 디자인이 다 있지는 않아서.. 딱 관리자 페이지 만드는 정도에는 유용한 것 같습니다. 특별한 브랜드 디자인이 들어가거나, 특별한 이미지 아이콘이 필요한 상황에서는 그 이상이 필요합니다. 이번 아이프렌즈펫 쇼핑몰을 만들면서 강아지/고양이 용품 관련 특화된 아이콘들이 다수 필요했는데요, 관련 아이콘들은 기존에 폰트로 만들어져 제공되는 font-awsome 이나 line icon 등에서는 찾을 수 없었습니다. 그렇다고 모든 아이콘을 기존 방식대로 일일이 이미지로 만드는 작업은 저 혼자서 디자인, 코딩 모두를 짧은 시간 내에 해내야 하는 상황에서는 어려울 것 같았구요. 그래서 이미지를 폰트로 바꾸어주는 사이트가 없을까 해서 찾아봤는데 있었습니다 ^ㅁ^ 여러 군데를 뒤져봤지만 이곳이 제일 편하더라구요 https://www.flaticon.com 1. 초간단 가입 가입을 안해도 되지만.. 찜한 아이콘을 관리하거나 다운받으려면 가

Ionicframework는 하이브리드 모바일 앱 개발에 가장 많이 사용되는 프레임워크입니다.  Ionic 3 릴리스부터는 프레임워크 자체적으로 page의 lazy loadingd을 제공합니다. 이 글에서는 하이브리드 모바일 앱에서 lazy loading page를 사용하는 방법에 대해 알아 보겠습니다. Lazy Loading 이란? 간단히 말하면 Lazy Loading은 Component를 필요할 때 즉시 로드하는 방식이라고 말할 수 있습니다. Angular 2+ 를 사용하면 기존보다 모듈화되고 확장성이 뛰어난 웹어플리케이션을 쉽게 만들 수 있습니다. 웹어플리케이션을  여러 기능에 대한 모듈을 만들 수 있으며,  사용자가 어플리케이션을 참조할 때 즉시 로드 할 수 있습니다. 즉, 사용자가 필요없는 components는 전혀 로드되지 않습니다.  Ionic은 Angular 위에 구축되었지만 두 가지 주요 차이점은 Navigation이 구현되는 방식입니다. Angular는 기본적으로 웹에 초점을 맞추기 때문에 URL 기반 라우팅을 사용하고 ionic 은 주로 모바일에 초점을 맞추기 때문에 모바일 앱의 네비게이션 방식 즉, 페이지를 밀어서 여는 방식인 네비게이션 스택을 사용합니다. Ionic CLI를 사용하여 네비게이션 데모 애플리케이션 생성하여 내비게이션이 작동하는 방식을 살펴보겟습니다.. 컴퓨터에 ionic을 설치하지 않은 경우 npm install -g ionic을 실행하여 설치 하면됩니다.이 데모에 사용한 CLI 버전은 v3.1.2입니다. Step1 : 초기 아이오닉 앱 생성 Ionic으로 새로운 앱을 만드는 것은 매우 쉽습니다. 명령 프롬프트 또는 터미널을 열고 다음 명령을 입력하면 됩니다. 빈 템플릿을 기반으로 새로운 ionic 응용 프로그램을 가져와 생성합니다. ionic start ionic - multi - module - demo blank 다음 명령어를 입력하여 앱을 실행합니다. ionic serve

Kotlin Programming Language 2017년 5월에 있었던  Google I/O  에서 안드로이드 공식 언어로  Kotlin  이라는 프로그래밍 언어가 추가되었습니다. 안드로이드 개발 언어로는 보통 Java를 생각하게 되는데 새로운 언어라니, 게다가 공식 언어로 지정까지 하다니 자연스레 호기심이 생겼습니다. 이번 포스팅에서는 Kotlin 프로그래밍 언어가 무엇인지, 어떤 장점이 있길래 공식 언어로 지정까지 되었는지 간략히 살펴보고자 합니다. 소개(뒷조사) Kotlin(코틀린)은  JetBrains  라는 회사에서 만든 프로그래밍 언어 입니다. JetBrains하면 각종 IDE로 유명한 회사죠. 저만 해도 IntelliJ, RubyMine, PyCharm, WebStorm 등 여러 제품을 접해보았습니다. IDE들이 공통적인 UI를 제공하는 점도 그렇고 단축키, 확장성, 구성의 편의성 등 많은 장점들이 있습니다. 어떤 개발자들은 더 이상 이 회사의 제품에 적응한 뒤로는 이클립스를 버렸다는 얘기도 들었습니다. 그런 회사에서 Java보다 나은 언어(“better language” than Java)를 목표로 만들어진게 바로 Kotlin 이라고 합니다. 2011년에 개발 발표가 있었고 2016년에 첫 안정화 버전(v1.0)이 출시 되었습니다. 갓 나온 뜨끈뜨끈한 신상 언어라고 볼 수 있겠죠. 데뷔한지 얼마 안 되었는데 벌써 안드로이드 공식 지원 언어가 되고 수 많은 안드로이드 개발자들로 부터 좋은 평가를 받는게 참 대단한 것 같습니다. Serious한 프로그래머는 결국 자신만의 언어를 만들게 된다는데..그런 사례 중 아주 성공적인 케이스인 것 같습니다. 든든한 뒷배경에 데뷔 하자마자 뜨거운 인기를 한 몸에 받고 있는 이 언어, 왠지 두근두근 기대를 갖게 만들지 않나요? 특징 몇 가지 주요한 특징을 살펴보겠습니다. 간결한 코드 : Java에 비해서 동일한 내용의 코드를 훨씬 간결하게 작성할 수 있습니다. 파이썬/그루비

지난 시간에 이어서 Realm DB에 대해 알아볼까 합니다. 오늘은 android에서 간단한 활용법을 알아보겠습니다. 모델클래스를 만들어 보도록 하겠습니다. public class User extends RealmObject { private String name ; private int age ; public String getName ( ) { return name ; } public void setName ( String name ) { this . name = name ; } public int getAge ( ) { return age ; } public void setAge ( int age ) { this . age = age ; } } 모델클래스의 형태는 기존의 모델들과 크게 다르지는 않고  RealmObject를 상속 받았는 것이 특징 입니다. 모델클래스로 객체를 생성해서 저장하면 되기때문에 모델클래스 하나가 테이블 하나라고 생각하면 이해하기 쉬울 것입니다. Realm realm = Realm . getDefaultInstance ( ) ; realm . beginTransaction ( ) ; User user = realm . createObject ( User . class ) ; user . setName ( " John " ) ; user . setAge ( " 30 " ) ; realm . commitTransaction ( ) ; Insert 하는 부분입니다. createObject 함수를 통해 Realm 모델 객체를 생성 하고 DB에 저장 됩니다. Realm realm = Realm . getDefaultInstance ( ) ; User user = new User ( )

android에서 로컬에 데이터를 저장한다면 어떤 방법을 사용 하시나요? 이 물음에 답을 생각하면 제일 처음 고민 하는 것은 첫번째로 DB를 사용 할까 SharedPreferences를 사용할까를 생각 하게 되는 것 같습니다. SharedPreferences경우에는 간단하게 데이터를 저장하고 불러오기 편하여 많이 사용하지만 구현해야할 사항에 따라 DB를 생각해야 하는 경우가 생깁니다. 기본적으로는 android에서는 SQLite를 제공하여 구현할수 있지만 SQL에 대한 개념이 있다면  쉬울수 있고 모르면 어려울수도 있는 부분들이 생기기 때문에 보다 쉽게 구현할수 있는 방법은 없을까 생각하면서 찾는다면 Realm이란 모바일DB가 쉽게 검색 될 것입니다. 1. Realm 이란?  오픈소스로 모바일에 최적화된 데이터베이스 라이브러리 입니다.   ORM이 아닌 데이터컨테이너 모델을 사용하고 데이터객체는 Realm에 객체로 저장됩니다.  <특징>   - 네이티브 객체 저장   - zero-copy : 데이터베이스 안팎으로 복사없이 그대로 직접 작업 가능   - 라이브 오브젝트 패턴 : Reaml에 저장된 객체의 인스턴스가 있고 다른곳에서 해당 인스턴스 업데이트시 기존 인스턴스도 업데이트   - 크로스 플랫폼   - 오프라인-우선   - ACID 준수  <성능>   2. android에서 Realm 연동  1) gradle 설정 buildscript { repositories { jcenter ( ) } dependencies { classpath " io.realm:realm-gradle-plugin:3.5.0 " } } 프로젝트 수준의 build.gradle 파일에 위와 같이 추가합니다. apply plugin: 'realm-android' realm-android 플러그인을 애