북마크 서비스 개발기

Bookmark Service 개발기

/ 변용훈 @river

ASP 개발자

@riverabout me

ClassicPHP, javascript, nodejs

Bookmark Service

Read Trend bookmarkly

구성요소

도메인 등록@river

river.io (X)river + iorivario.com

도메인 등록 / 이메일 등록도메인 등록비 9,000원i@rivario.com 등록

Google Apps 로 개인 도메인 이메일 주소 무료로 만들기

https무료 ssl 인증서 StartSSLStarSSL 설치과정

Screen Capture

Screen Capture무료 API

http://url2png.com http://urlbox.io

Screenshot as a Servicehttps://github.com/fzaninotto/screenshot-as-a-service

/ CasperJS PhantomJS

phantom_capture.jsvar page = require('webpage').create();page.open('http://www.daum.net', function () { page.render('daum.png'); phantom.exit();});

Screen Shot System

Laravel PHP Framework

Laravel

MigrationRESTful API

MigrationTable 생성/삭제용 php 파일 생성

$ php artisan migrate:make create_bookmarks_table --table bookmarks --create

yyyy_mm_dd_create_bookmark_table.php<?php

class CreateBookmarksTable extends Migration { public function up() { Schema::create('bookmarks', function(Blueprint $table) { $table->increments('id'); $table->timestamps(); }); }

public function down() { Schema::drop('bookmarks'); }}

Table 생성$ php artisan migrate

Laravel RESTful APIcontroller 생성

$ php artisan controller:make BookmarkController

BookmarkController.php<?php

class BookmarkController extends BaseController { public function index() {} public function create() {} public function store() {} public function show($id) {} public function edit($id) {} public function update($id) {} public function destroy($id) {}}

Routes.phpRoute::resources('bookmark', 'BookmarkController');

Laravel RESTful APIActions handled by Resource Controller

backbone.js

Flat UI Kit

Save This Page Chrome Extensionbackground.js

chrome.browserAction.onClicked.addListener(function(tab) { var action_url = 'https://rivario.com/bookmark/bookmarklet?url='+encodeURIComponent(tab.url)+ //새로운탭 생성 chrome.tabs.create({ url: action_url });});

manifest.json{ "name": "Bookmark This Page", "manifest_version": 2, "description": "Add this website to your bookmarks", "version": "0.1", "homepage_url": "https://rivario.com/bookmark",

"permissions": [ "tabs", "http://*/*", "https://*/*" ],

"background": { "scripts" : ["background.js"] },

"browser_action": { "default_icon": "icon-19.png" }, "icons": { "128": "icon-128.png",

Resourcebookmark sourcebookmarklyRead TrendGoogle Apps 로 개인 도메인 이메일 주소 무료로 만들기StarSSL 설치과정Combining Laravel 4 and BackboneMasonryisotopeFlat UI KitDeveloping Google Chrome Extensions

Q & A

감사합니다.