èé (id:secondlife / @hotchpotch) ã§ãã
ã¯ãã¯ãããã§ã¯ä¼ç¤¾ã®ä¸å¿ã«ãããã³ãããã社å¡å士ã§ã©ã³ãããèåãä½ã£ãããã¤ãã³ããéãããã¨ç¤¾å ã®ã³ãã¥ãã±ã¼ã·ã§ã³ç¨éã§åºã使ããã¦ãã¾ãããããªãããã³ã§ä½ããã¦ããæ§ã ãªæçãã楽ããããªã³ããã¥ã±ã¼ã·ã§ã³ããã®å ´ã«å± ãªã人ã«ãä¼ããããªã¼ãã©ãã«ãä¼ããæ¹æ³ã¯ç¡ãã®ããªãã¨æã£ã¦ãã¾ããã
ãããªä¸ãããè¯ãçµç¹ãä½ãããã« ã®ä¸ã§ã触ãããã¦ããã³ããã¥ã±ã¼ã·ã§ã³æ¹åã®è©±ããã¦ããæä¸ã社å ã«å ±ç¨ã®ã«ã¡ã©ãç½®ãã¦ãã£ã¦ãæ®ã£ãåçãä½ãããã¨ãèªåã§ç¤¾å¡ãè¦ããå ´ã«ã¢ãããã¼ãããã ãã®ä»çµã¿ãæä¾ããã ãã§ãã¾ãè¡ããããã¨æã£ãã®ã§2014å¹´æ«ã«ä½ã£ã¦ã¿ã¾ããã
ãµã¼ãã¹ã®ã³ã³ã»ãã
ä½ãã¨ãã«çãè¾¼ãã ã³ã³ã»ããã¯ä»¥ä¸ã®äºç¹ã§ãã
- éç¨ã³ã¹ããã¼ã
- ã¢ãããã¼ãã³ã¹ããã¼ã
éç¨ã³ã¹ããã¼ã
ããã§è¨ãéç¨ã³ã¹ãã¯ã人çãªéç¨ã³ã¹ãã§ãã社å ã®èª°ãããããªãã«é¢åãè¦ã¦éç¨ãããã¨ã«ãªãã¨ãã¾ãä½è¨ãªç©ä½ãããã£ã¦â¦*1ãã¨ãããã¨ã«ãªããããªãã§ããã
ãã®ããä½ã£ãå¾ã人ã®éç¨ã®ã³ã¹ããç¡ããµã¼ãã¹ã«ãããã¨æãã¾ããã
ã¢ãããã¼ãã³ã¹ããã¼ã
ã¢ãããã¼ãã³ã¹ããã¼ããã¨ããã®ã¯äººãæèçã«ã¢ãããã¼ãããè¡çºãå ¥ããªããã¨è¨ããã¨ã§ããUI 㧠1 ã 0 ã«ããã¨å¤§ããªå¤åãèµ·ãããã¨èª°ããè¨ã£ã¦ã*2ã®ã§ããããä½ãè¡çºãå¿ è¦ããªäºã¨ãä½ãããªãããã¨ã¯å¤§ããªéãããããã¾ãã
è½åçãªã¢ãããã¼ããå¿ è¦ã ã¨ãã¢ãããã¼ããããã¨èªä½ã®ã³ã¹ãã¨ãã©ã®åçãã¢ããããããã¨ããåçã®åæ¨é¸æã³ã¹ããããã£ã¦ãã¾ãã¾ãã
ãã£ã¨æ°è»½ã«ã¢ãããã¼ãããã¦æ¬²ãããã¨ããæããããæèçã«ã¢ãããã¼ãããªãã¦ãè¯ããã¢ãããã¼ãã³ã¹ããã¼ãã®ãµã¼ãã¹ã«ãããã¨æãã¾ããã
ãã®ã³ã³ã»ããäºã¤ã¯ã人ã®ã³ã¹ããç¡ããã¨ããç¹ã§ã¯å ±éãã¦ã¾ããã
ãããã¿ã¤ãã³ã°
ã¾ãã¯ãããã¿ã¤ãã³ã°ããã¨ãããã¨ã§ãã®äºã¤ã®ã³ã³ã»ãããæºããããµã¼ãã¹ãä½ã£ã¦ã¿ã¾ãã*3ãã¢ãããã¼ãã³ã¹ããã¼ãã¨ããè¦ç¹ã§ã¯ EyeFi (æ§ãã¼ã¸ã§ã³ã®æ¹ã§ãç¾è¡ãã¼ã¸ã§ã³ã¯ç°ãªãä»æ§ã§ã)ã使ãã¾ããã EyeFi(æ§) ã¯åçãæ®ãã¨ããã« EyeFi ãµã¼ãã«ã¢ãããã¼ããããããçµç±ã§æ§ã ãªãã©ãã¹ãã¬ã¼ã¸ã«ã¢ãããã¼ããããã¨ãå¯è½ã§ãã
éç¨ã³ã¹ãã¼ããã¨ããè¦ç¹ããã¯ã¢ãããã¼ãå ã« Google Photos ãé¸ã³ã¾ãããGoogle Apps ãä¼ç¤¾ã§å©ç¨ãã¦ããå ´åã社å¡ã®ã¿é²è¦§å¯è½ã«ããå¤æ´å¯è½ãªãã¨ã便å©ã§ããã
ããã§åé¡ãªããã°â¦ã¨æã£ãã®ã§ãããã¢ã«ãã æ©è½ãæ°ããæ¥ä»é ã§ã®ã½ã¼ãã® Permalink ãä¿æã§ããªãã£ããâ¦çãä»åã®ç¨éã«ããããªãã£ããããGoogle Photos ã¯ããã¾ããã
â»ãããã®ã使ããæå°ã³ã¹ãã§ã®ãããã¿ã¤ãã³ã°
ãããã¿ã¤ãã³ã° ãã®2 ~ å®æã¾ã§
ç¶ãã¦ã¯ãEyeFi(æ§) ã¯èªåã®ãµã¼ãã®APIãå©ããã¨ãã§ããã®ã§
- Heroku ã® API ãµã¼ã㸠Post
- Heroku å´ã§ ImageMagick çµç±ã§ããã¤ãã®ãµã¤ãºã¸ãªãµã¤ãº
- ã¹ãã¬ã¼ã¸ã¸ã¢ãããã¼ã
ã¨ããä»çµã¿ã§ã¹ãã¬ã¼ã¸ã¸ãã¡ã¤ã«åã 2016/02/14/142010_{hash}.jpg ã®ãããªãã¡ã¤ã«åã§ã¢ãããã¼ããã¾ãããªãè£å´ã®ã¹ãã¬ã¼ã¸ã¯ã http(s) ã® permalink ã«ã¢ãããã¼ãããã ãã§ã¢ã¯ã»ã¹ã§ãã*4æ©è½ãæã¡ãã¾ããã¡ã¤ã«ãªã¹ããAPIã§åãããµã¼ãã¹ã§ããã°ã©ãã§ãè¯ãã£ãã®ã§ãAWS S3 ãé¸ã³ã¾ãã*5ã
é²è¦§å´ã¯ API ããç»åä¸è¦§ãåå¾ãããããå ã« permalink ãçµã¿ç«ã¦ãã°å®äºã§ãã社å ã« dokku ãç«ã£ã¦ããã®ã§ãç»åä¸è¦§ãè¿ã JSON API ããã¦ãhtml + JavaScript 㧠UI ãå®è£ ãã¨ãããããããã¿ã¤ãã³ã°å®äºã§ãã
ç»å URL ãææ¥ãã¨ã® URL ã¨ãªã£ã¦ãã®ã§ãå種ã¹ãã¬ã¼ã¸ã®ãã¡ã¤ã«ãªã¹ããåå¾ãããªãã·ã§ã³ã« prefix ãæå®(2016å¹´2æã®åçãªã 2016/02/ ãªã©)ãããã¨ã§ãç¹å®æãæ¥ã®åçä¸è¦§ã®åå¾ãªã©ãç°¡åã«ã§ãã¾ãããæ¥æã permalink ã«å ¥ã£ã¦ãã®ã§ç»åã®ã¡ã¿æ å ±ç¡ããpermalink ãã½ã¼ãããã ãã§åçã®æ¥æé ã«ä¸¦ã¹æ¿ããè¡ãã¾ãã
ã¨è¨ãã®ããä½ããããã®æ å ±ãRDBãNoSQLçã¸è¨é²ãã¦ãã¾ãã¨ããããç¶æããéç¨ã³ã¹ããçºçãã¦ãã¾ãããã使ããªãã¦ãåé¡ãªããããªä»æ§ã«ãã¾ããã
â»è»½ãå®è£
ã¨è¨ãããã§è»½ãå®è£ ãã¦ã¿ã¦ãè¦æ±ã¯æºãããããªã®ã§ JS + CSS ã§ä½è£ãæ´ãå®æã§ãã
ãªãåé¤ã¯ãé²è¦§å´ã® UI ã«åé¤ãã¿ã³ãä»ããã¢ãããã¼ãããããã©æ¶ãããå ´åã«èª°ã§ãæ°è»½ã«æ¶ããããã«ãªã£ã¦ãã¾ãã
â»æ°è»½ã«åé¤ã§ããUI
社å ãªãªã¼ã¹ã¾ã§
ç¶ãã¦ã社å ãªãªã¼ã¹ã®ããã®å¨ç¥ã§ããä½ã£ã¦ãããããèªç¥ãããªãç©ã«ãªã£ã¦ãã¾ãã¨æ²ããã§ãããã®ããã社å ãã¼ã¿ã«ã®ãããç»é¢*6ãã XHR ã® CORS 㧠é²è¦§å´ã® JSON API ãå©ãããã¼ã¿ã«ã®ãããã«ææ°ã®åçãåºãããã«ãããããã®å ±ç¨ã«ã¡ã©ã¯ãªãããï¼ã¨ãã解説ãã¼ã¸ãä½ããªã³ã¯ãå¼µããªã©ãèå³ãæã£ã¦ããããããªå°ç·ãå ¥ãã¾ããã
çµæãå½åã®ã³ã³ã»ããéããã¢ãããã¼ãã³ã¹ããã¼ãã®ããæ°è»½æ®ãããåçãéã¾ãããã«ãªããä¸å¹´éã§5,000æ以ä¸ã®åçãã¢ãããã¼ããããããããæçã®åçã楽ããããªåçãã¤ãã³ãã®åççã ãä¼ç¤¾å ¨ä½ã«ä¼ããããã«ãªãã¾ããã
æåã®é ã¯ã·ã£ãã¿ã¼ãæ¼ãããã©ã®åçãã¢ãããã¼ãããã¦ãã¾ããã¨ã«æ £ããªã人ãå± ã¾ããããã»ã¨ãã©ã®åçã¯ã¨ãããåé¤ãå¿ è¦ã«ãªããããªåçã§ã¯ç¡ããããä»ã§ã¯æ°è»½ã«æ®ã£ã¦ãããã©ããã¦ãåé¤ãããå ´åã§ãç°¡åã«æ¶ãããã¨ãããæ £ãã¦ãã£ãããã§ãã
ã¾ãããä¸ã¤ã®ã³ã³ã»ããã§ããã人ã«ããéç¨ã³ã¹ãã¼ãããS3çã®ãªãã¸ã§ã¯ãã¹ãã¬ã¼ã¸ãã使ã£ã¦ãªããããã¯ã©ã¦ããµã¼ãã¹é害æã®ã¹ãã¬ã¼ã¸é害確èªã®å¿ è¦æ§ãç¡ããæéç¡ãéç¨ã§ãã¦ããã¨ãããã¨æã£ã¦ã¾ãã
使ãããªãã£ãæ©è½
社å åããã¼ã«ã®ãããæ©è½ãèªç±ã«å®è£ ã§ããããããããããªæ©è½ã追å ããããªã欲æ±ã«é§ããã¾ããããã¦å®è£ ãã¦ãã¾ãã¾ããã説æããæ©è½ä»¥å¤ã«
- æ®ã£ãåçã社å ãã£ããã«æµã
- åçãç¹å®ã¡ã¼ã«ã¢ãã¬ã¹ã«éä¿¡ããã¨ã¢ãããã¼ã
- åçããã©ã¦ã¶ä¸ã«ãã©ãã°ããã¨ã¢ãããã¼ã
çã ã®æ©è½ãå®è£ ããã®ã§ãããä¸ã¤ç®ã¯æ®ãããåçããªã¢ã«ã¿ã¤ã ã®ããã¼ã§è¦ããã¨ãã欲æ±ã¯ãã¾ããªãããªãªã¼ã¹ããå½æã¯ãããªãã®äººãå± ãã®ã§ãããä»ã¯ãã®ãã£ããã«ã¼ã ã¯å¯ãã¦ãããéè¦ãç¡ããã¨ã解ãã¾ãããInstagram çã®åçããªã¢ã«ã¿ã¤ã ã§è¦ããã¨ããããã¯ã空ãã¦ãæéã«è¦ãã欲æ±ã®æ¹ãå¼·ãã§ãããä»äºä¸ PC ããã¤ãéãã¦ãç¶æ ã§ã¯ããã©ã¦ã¶ä¸ã® UI ã§ä¿¯ç°ãã¦è¦ããæ¹ã便å©ã§ããã
ã¾ãå¾è äºã¤ã¯ãå¥ã®ã«ã¡ã©ãã¹ãã¼ããã©ã³ã§æ®ã£ããã¡ã¤ã«ã®ã¢ãããã¼ãã«ã使ãããããã¨ãããã¨ã§å®è£ ããã®ã§ãããã¢ãããã¼ãã³ã¹ããã¼ãã®ã³ã³ã»ããã«åãã¦ãã¦ãè½åçãªã¢ãããã¼ããå¿ è¦ã«ãªã£ã¦ãã¾ãããã¯ãã»ã¼ä½¿ãããªãçµæã«çµããã¾ããã
Tipsã»äºåããããªã¼ãç¨æãã
å ±ç¨ã§èª°ã§ã使ããã«ã¡ã©ã®ããããã£ããå é»ãå¿ãã¦ã«ã¡ã©ã®ããããªã¼ã使ãåã£ã¦ãã¾ã£ãç¶æ ã«ãªããã¨ãããã¾ããã«ã¡ã©ã使ããã¨æã£ãã®ã«ãæ®å½±ãããã®ã«å é»ããã¦ãªãâ¦ãã¨ããç¶æ³ãçºçãã¦ãã¾ãã¨æ²ããã§ãããã
å ±ç¨ã«ã¡ã©ã®ç½®ãå ´æã®ãã°ã«å¤é¨å é»å¨ + äºåããããªã¼ãããã¦ãããã¨ã§ãã«ã¡ã©æ¬ä½ã®ããããªã¼ãåãã¦ãã¦ãå³åº§ã«äº¤æã§ããã¾ã交ææã«ã¤ãã§ã«å é»ããã®ã§é»æ± ãåããã¨ããäºã¯åºæ¬ããã¾ãããæ®ãããã¨ãã«æ®ããªãã¬ãã«ãªãæ¸ããããã«ããå é»å¨ + äºåããããªã¼ãããã¨ä¾¿å©ã§ãã
ã¾ã¨ã
ã¯ãã¯ãããã§ã¯å ±ç¨ã«ã¡ã©ãç¨ããæ®å½±å¾èªåã§ã¢ãããã¼ããã¦ç¤¾å ãã¼ã¿ã«ããé²è¦§ã§ããä»çµã¿ãéç¨ãã¦ã¾ãããã®ã«ã¡ã©ããããã¨ã§ããããã³ã®æ¥½ãããç¾å³ããåçã社å ã§å ±æãããã³ããã¥ã±ã¼ã·ã§ã³ã®ä¿é²ã«ãå½¹ç«ã£ã¦ãã¨æã£ã¦ãã¾ãã
社å ã«ãã®ãããªã«ã¡ã©ãä¸ã¤ããã¨ä½ãã¨ä¾¿å©ãªã®ã§ãçããã®ä¼ç¤¾ãæ°è»½ã«æ®å½±ã§ãã¦ã¢ãããã¼ããããå ±ç¨ã«ã¡ã©ãæ¤è¨ãã¦ã¿ã¦ã¯ã©ãã§ãããããæ¬ã¨ã³ããªã¼ã§ãç´¹ä»ãã¦ããæ§çã® Eye-Fi ã使ããã¨ã§ãææºãã¦ããã¯ã©ã¦ããµã¼ãã¹çã ã«ãæ®å½±ããåçãã¢ãããã¼ãã§ãã便å©ã§ãã
å¤ããµã¼ãã¹ã¯çµäºã«ãªããã¡ã§ããã Eye-Fi ã¯ãµã¼ãã¹æä¾ãã¦ãã¦ãããããâ¦ã¨æã£ã¦èª¿ã¹ã¦ã¿ãã
ãã®åº¦ãçç£ã販売çµäºåã®æ§è£½åã«ããããEye-Fi Viewåã³ãEye-Fi Premiumãä»ç¤¾ãªã³ã©ã¤ã³ãµã¼ãã¹ã¨ã®é£æºã«ã¤ãã¾ãã¦ã2015å¹´9æ9æ¥ããã¡ã¾ãã¦ãçµäºãããã¾ããã¨ããç¥ãããããã¾ãã
ãµã¼ãã¹çµäºåç¥ãåºã¦ãã(çµäºæ¥æ以éãä½æ ã使ãã¦ããã©â¦)ãã¨ãããªããâ¦ãããããã
*1:â»ããç§ãéç¨æ å½ã§ããã©ãããã·ã¹ãã ãæ¼ãã¤ãããããããæã£ã¦ãã¾ããã
*2:â»è¦åºå ¸
*3:* Google Photos ã«ã¢ããããã ããªã®ã§ä½ã£ã¦ã¿ãã¨ã¯éãã¾ããâ¦
*4:[permalink ãä¸ãä¸æ¼ããã¨ã¢ã¯ã»ã¹ã§ããå¯è½æ§ã¯ããã¾ãããæ©å¯äºé ãåãæ±ã£ã¦ããªã&ãããã³ã¯å·åã¹ãã¼ã¹å¤ã®ããããªã¹ã¯ã¨ãã¦è¨±å®¹ãã¦ã¾ã
*5:ãªãç¾å¨ã¯ Azure blob storage ãã¡ã¤ã³ã®ã¹ãã¬ã¼ã¸ã¨ãã¦ä½¿ã£ã¦ã¾ã
*6: èªå®¶è£½ã® Wiki + Blog ã·ã¹ãã ã§ãJavaScript ãæ¸ãã¾ã