쪼렙 as! 풀스택

FANZEEL.COM 프로젝트 참여 백엔드 (서버) - 100%프론트 (Angular4) - 80% 0. 개요 - 팬들의 글들을 동영상으로 만들어주는 플랫폼이다. - 실제 서버는 하나만 돌린다. - 회원 DB 운영은 FANZEEL.COM 하나로 통합한다.- 서브도메인을 구분해서, 각각의 콘텐츠마다 개별의 미니홈페이지를 운영하는것처럼(?) 보이게 만든다.- 게시글을 문장별로 split 한 후, 문장 수정요청을 할 수 있는 크라우드 라이팅(?) 시스템을 구축한다. 1.요새는 영화마다 홈페이지를 따로 제작하지 않는댄다. 그냥 '네이버 영화' 에 올리는 정도라고... 일단 '스파이더맨 - 홈커밍' 의 팬질 미니홈 을 개발했다. https://shc.fanzeel.com . 여기서 서브도메인 shc 는 "Spid..

1. 마블의 토르3 - 라그나로크의 팬질 미니홈을 작업중이다. HTML 편집기능이 있는 일반 게시판 기능을 추가해달라고 해서, 위지윅을 포함하는 게시판 기능을 개발하고 있다. 2. 위지윅 에디터 - CKEditor vs tinyMCE- 위지윅을 선택해야 했는데, CKEditor 와 tinyMCE 두개 중에 많은 고민을 했다. 두개다 강력해 보였다. - Angular4 에 compatible 한가 찾아봤는데, 둘다 공식적인 지원은 없고, 그냥 누가 만들었는지 모르지만 wrapper 가 npm 에 올라가 있다. official 래퍼가 아니면, 일단 고민을 더 하게 된다. 언제 지원이 끊길지 모르기 때문에. 그래서 그냥 Javascript 라이브러리 그대로 가져다 쓰기로 결정했다. - TypeScript 에서..

프로젝트 참여. 백엔드 (서버) - 100%프론트 (Angular) - 50% 0. 개요- 로아컨설팅과 함께 만든, 기업용 콘텐츠 (B2B) 를 보여주는 웹 사이트- 기업용 계정 관리- 유튜브 영상 플레이, PDF 보고서 보기, Audio 청취. 1. AWS 사용.- Elastic Beanstalk 로 서버를 구성했다. 로드밸런서와 오토스케일링을 자동으로 세팅해주니 무지하게 편하다. - CertificateManager 으로 아마존에서 제공하는 HTTPS 인증서를 무료로 사용할 수 있는데, 이것은 또 로드밸런서에만 사용이 가능하다. 로드밸런서도 손쉽게 구성해주니, 더욱 Elastic Beanstalk 를 사용하게 된다.- Elastic Beanstalk 에 Database Tier 도 구성해 줄 수 있긴..

Angular는 SPA 방식으로, 완벽하게 클라이언트 사이드 렌더링으로 돌아가게 되어있다. 이때문에 맨처음 index.html 파일과 관련된 js 파일 들을 단순히 다운로드만 받아도, 서버와 통신할 필요없이 사이트가 돌아갈 수 있게 된다. (물론 실제론 데이터 CRUD 를 위한 API 통신을 하겠지만, 이론적으론 이것과 별개의 이야기다) 그래서 맨처음엔 '우와, 서버리스로 구성해봐야징~' 하면서 아마존 S3 에 올려놓고, static 웹호스팅으로 연결해버렸다. S3 요금은 일반 서버를 사용하는것보다 훨씬 저렴하고, 따로 서버 컴퓨팅 리소스를 사용하지도 않기 때문에, '완전 좋네~' 하면서 만족해 했었다. 그런데 사이트를 완성해 놓고, SEO 와 페이스북 공유를 해보다 보니, 큰 문제가 있었다. ㅠㅠ HT..

프로젝트 참여 iOS 앱 - 100%Android 앱 - 100%Server- 100%... 역시 그냥 첨부터 끝까지 혼자 다 했다ㅡ,.ㅡ; 0. - 기존 홈페이지와 회원 연동- 하이브리드 방식의 수강신청 기능, 웹뷰와 세션연동- HTML 형식을 이용한 TextView- 관리자용 Admin 페이지 개발- Google Analytics- APNS, FCM, GCM 푸시 알림.- 유튜브 동영상 플레이어- 1. 개요 클라이언트는 컨설팅회사였는데, 현재 운영중인 IT 알려줌 앱이 굉장히 좋아보였나보다. 컨설팅 회사다 보니, 자체 생산하는 많은 콘텐츠들을 앱을 통해서 유통하고 싶어 했다. 그래서 IT 알려줌 앱과 비슷하게 만들어준다고 하면 된다고 해서 외주 개발을 수주하여 개발했다. 기존 소스를 많이 활용할 수 ..

안드로이드의 TextView 는 일반적으로 textSize, textColor, textStyle 같이, 서식을 한번 지정하고 사용하지만, HTML 형식을 이용하여 하나의 TextView 에서 여러형태의 문자열을 표현할 수 있다. 그러나 모든 HTML 태그를 다 사용할 수는 없고, TextView 에서 지원가능한 태그 속성들이 제한되어 있는데, 특히 이미지 태그같은 경우에는, 이미지 로더를 직접 구현해 줘야만 한다. 먼저 HTML형식의 문자열을 TextView 로 보여줄 때는, 태그가 포함된 문자열을 Spanned 객체로 만들어서 TextView 에 보여주는데, 이때 HTML 태그에서 태그를 발견하게 되면, Html.ImageGetter 인터페이스에 에 있는 getDrawable 을 호출해서 이미지를 넘..

프로젝트 참여 iOS 앱 - 100%Android 앱 - 100%Server- 100%... 역시 그냥 첨부터 끝까지 혼자 다 했다ㅡ,.ㅡ; 0. 개요- '알려줌 앱' 무한정 추가 찍어내기 시스템 구축- 시사회 / 예매권 등의 상품 참여 이벤트 시스템.- 투표 시스템, 라이브방송 퀴즈풀이 시스템- 당첨자 & 관리자 채팅용 개별 공지 시스템- 유튜브 플레이, 푸시알림, 페북 로그인, 공유 1. '알려줌 앱' 무한정 추가 찍어내기 시스템 구축.- IT 알려줌 앱 개발 이후, 줄거리알려줌, 여행 알려줌, 패션 알려줌 등, 이런식의 앱을 계속해서 추가 개발할 예정이라 하였다.- 모두 한 계정을 사용하고 있고, 똑같은 화면과 기능이 많지만, 테마색등의 변화는 줘야 하는 상황.- 모두 다른 프로젝트로 앱을 만들면,..

1. 새로운 프로젝트를 생성한다. 일단 이름을 RedApp 으로 하겠다. 2. Empty Activity 를 선택하고, 처음 시작할 메인 액티비티의 이름을 RedMainActiity 로 변경해주자. - Finish. 3. 모듈을 추가하기 전에 현재의 모듈 이름이 app 인데, 나중에 만들 blueapp 과 구분하기 위해, 모듈 이름을 redapp 으로 리팩토링 해주겠습니다. app 에 우클릭 - Refactor - Rename -> 'redapp' 입력 4. RedApp과 BlueApp 에서 공통으로 이용할 모듈을 추가하겠습니다. 메뉴 File - New - New Module 클릭 - Android Library 선택. (Android Library 는 자체로는 앱이되지는 않고, Activity 나 D..

Intro. 흔한 경우는 아니지만, 간혹 비슷한 앱을 찍어내야 하는 경우들이 생긴다. 스토어에 정식버전 앱 과 Free 버전을 따로 등록한 경우가 그러하고, 필자같은 경우는, 'IT알려줌' 앱과 '줄거리알려줌'을 개발할 때도 같은 서버와, 같은 계정관리, 거의 비슷한 기능의 앱을 개발해야 했다. 이런 개별 앱을 모두 개별 프로젝트로 관리를 한다는건, 유지보수상 굉장히 큰 문제가 있다. 따라서 똑같은 기능을 하는건 공동의 리소스로 묶어서 관리하고, 각 앱마다 다른 부분만 분기해서 처리하는 일을 해야 한다. XCODE 로 iOS 용 앱을 개발할 때는, Target 을 추가하는 방식으로 이 문제를 해결했다. 목표- 버튼을 누르면 Alert을 띄워주는 같은 기능을 하는 RedApp과 BlueApp 두개의 앱을 ..

프로젝트 참여iOS - 100%Android - 100%Server - 100%... 그냥 첨부터 끝까지 혼자 다 만들고 서비스 운영중이다 ㅋ 0. 개요- 알려줌과 로아컨설팅에서 함께 운영하는, IT 업계 관련된 콘텐츠 유통하는 앱.- 유튜브 영상 플레이 (IT 알려줌 유튜브 채널의 동영상을 보여준다.)- 인앱 결제 (유료 PDF 보고서를 다운받을 수 있다.)- 푸시 알림 (새로운 콘텐츠 푸시알림)- 콘텐츠에 댓글 + 대댓글 시스템- 페이스북 로그인, 공유 1. 서버 - PHP 로 만들었다. 알려줌 스타트업을 창업하고나서 처음에 앱을 만드는데, 서버비용을 극도로 줄일 필요가 있었다. 요새는 서버 운용비용이 정말 싸져서, 단독호스팅을 이용한다 해도 한달에 몇만원 안한다. 그런데, 내가 보기엔 한달에 몇만원..