はやしくんさん雑記

はやしくんさんです

新しくiOSアプリを書くにあたって、VIPERを採用した

注:これはポエムです。

タイトルのままです。

最近諸事情により新しくiOSアプリを作っています。 めちゃくちゃ複雑とか、エキセントリックなアプリというわけではなく、極めて普通のアプリです。

コンプライアンス的なアレがアレなのでアレですが、Twitter公式アプリのような内容感です(?)。

今回そのアプリの開発にVIPERを採用した訳ですが、なぜそれを採用するに至ったかの経緯と理由のポエムを綴ります。

参考にした記事等は以下です

iOSアプリ設計大全集 2016 - Qiita

GitHub - pedrohperalta/Articles-iOS-VIPER: Demo app for VIPER design pattern implementation

iOS Project Architecture : Using VIPER [和訳] - Qiita

続きを読む

vibe.d(D言語製WAF)でWeb開発、DockerでAWSへデプロイ

はじめに

皆さん、vibe.dはご存知でしょうか。そもそもD言語はご存知でしょうか。

D言語 - Wikipedia

C++erがD言語を使ってみて感激した機能 - Qiita

型推論GC、テンプレートやコンパイル時関数実行などもでできて、モダンでCoolな言語仕様の言語です。 個人的には、若干Swiftに似ているかなぁ(D言語がSwiftに似ているのでは無く、SwiftがD言語に似ているのだが)という感じがあります。

残念なことに、D言語はまだユーザーが少なく、Googleにも"dlang"で検索すると"もしかして golang"と煽られる始末で、まだまだライブラリやフレームワークは発展途上です。 そんな数少ないD言語製のWeb Application Frameworkの中で、vibe.dは最も成熟したものだと思います。

vibed.org

先日Pythonで運用していたhayashikun.comのさくらVPSの契約が切れ、もう運用してないWebサービス等もあったので一新しようと思い、vibe.dで実装、dockerでAWSにデプロイしたので、備忘録を残します。

件のhayashikun.comは、以下のリポジトリで公開しております。

GitHub - hayashikun/hayashikun.com

続きを読む

阪大で大学公式の履修管理アプリを作ってた僕の時間割アプリOrario所感

はやしです. 今年度より東京大学大学院で修士1年生をしています.専攻は化学で,化学の勉強,研究をしています.

学部時代,僕は大阪大学理学部化学科に所属しており,趣味でプログラミングをしていました. そこでやっていた事の一つに,阪大の履修管理システムKOANのスマートフォンアプリの開発があります.

僕の詳しいプロフィール等は http://hayashikun.com にあります.

この記事を書こうと思ったのは,今朝こんな記事を見かけたからです.

news.livedoor.com

続きを読む

コーヒーサイフォンとの運命的出会い

熱湯は重力に逆らい、上のガラスボールへと流れていく。

f:id:hayashikunsan:20170317214133j:plain

続きを読む

2016年をサクッと振り返る

1月

研究室に配属される.第二志望の研究室で教授の退官が近いので,配属は1人で同期がいない,ぼっち.それに,院進するとしたら研究室変わらないといけないところになってしまった. 研究室入ってちょっと勉強とかしてたら就職するんじゃなくて院進したくなったので就活系を全部辞めた.

2月

学科の友達はみんな結構春休み取ってたけど,特に春休みしたいこともなかったから殆ど毎日研究室行っていろいろしてた. あと,一年ぶりにバイトを始めた.割と有名なIT企業で,時間的にそんなに余裕は無いけど働けてうれしーって感じ.

3月

特に何もなし

4月

4回生になった. 卒業研究を始めた.

5月

人生初の再履バスに乗った. 特に何もなし

6月

院試の事を考えて研究室の見学とか行った.

7月

院試出願を決める.阪大の別の研究室と東大の研究室に出願した.

8月

院試勉強を本格的に開始した.毎日(殆ど)勉強していた. 8月末に院試を受けた.

9月

院試は受かってた. 研究を再開. 東大に進学することにした.

10月

マジでクソな一ヶ月だった.

11月

実験の毎日,特に何もない単調な毎日.

12月

単調な毎日.

まとめ

クソな1年だった.来年はいい年にしたい. 来年も皆さんよろしくお願いします.

CentOS上でMeCab & Python3環境構築

概要

  • CentOS上にMeCabをインストールし、Python3から仕えるようにする
  • MeCabyumでインストールする
  • /bin/sh: mecab-config: コマンドが見つかりませんで困ってる人は解決するかも
  • 辞書はmecab-ipadicmecab-ipadic-NEologd
続きを読む

完全無欠コーヒーで圧倒的成長し(ようとし)た

はじまり

ある梅田のIT企業でバイトをしている僕、ある日健康が趣味の社員さんに「完全無欠コーヒー」なるものの存在を聞いた そこで早速材料を仕入れ、完全無欠コーヒーなる飲料で圧倒的成長をしてみんとトライしたのである

続きを読む

DeAGOSTINIの「日本の神社」を約2年4ヶ月かけてコンプリートして得られた知見を共有(自慢)する

いえーい!!!

先日やっとDeAGOSTINIの「日本の神社」をコンプリートしました。 2014年1月28日創刊で、第121号が2016年6月7日発行(5月中に届いたけど)なので約2年4ヶ月かけて……!

続きを読む

TwitterのlikeみたいなエフェクトをJSとCSSで実現する

祝 Twitter10周年!

らしい それに合わせてかTwitterのlikeのエフェクトが変わった

このlike押した時にエフェクトかかるのは去年から

これの仕組みはどうなっているのか、どうすれば自前で実現できるかについて書いていきます

仕組み

このエフェクトはどっちも横長の画像を切り替えて実現させている 旧エフェクトは f:id:hayashikunsan:20160321164758p:plain

新エフェクトは f:id:hayashikunsan:20160321164813p:plain

で成っていて、前者は2900 × 100pxで後者は15960 × 280pxなので、それぞれ29コマと57コマの画像を切り替えてアニメーションにしてる

では、この横長の画像1枚からアニメーションを実現させるのはどうすれば良いかというと、CSSのbackground-positionを使う この属性の詳細はググってみてください

この属性の値を一定時間ごとに変えて、表示させる場所を変えればアニメーションになる

デモ

Twitterの新エフェクトを動かしてみる ソースは

<html>
    <head>
        <style>
            #heart {
                background-image: url(heart.png);
                height: 280px;
                width: 280px;
                animation: like 5s steps(57) 0s 1;
                animation-fill-mode: forwards;
            }
            
            @keyframes like {
                0% { background-position: 0px center; }
                100% { background-position: -15960px center; }
            }
        </style>
    </head>
    <body>
        <div id="heart"></div>
    </body>
</html>
<html>
<body>
<style>
#heart {
    width: 280px;
    height: 280px;
    background-image: url(heart.png);
    background-position: left;
}
</style>

<div id="heart"></div>

<script>
document.getElementById("heart").addEventListener("click", function(el) {
    var offset = 280 * 57;
    var tm = setInterval(function() {
        if (offset == 0) {
            clearTimeout(tm)
        } else {
            el.target.style.backgroundPosition =  offset + "px 50%";
        }
        offset -= 280;
    }, 50);
});
</script>
</body>
</html>

汚いけど許して

前者がCSS3のみを使う場合で、後者がJSを使って頑張る場合 前者のほうがよさ気だけど、IEとか一部対応してなさそう

こんな感じ

実際Twitterの中ではもうちょいいい感じにやってるんだろうけど、こんな感じで簡単に実現できるね!やったね!

OS XでVMにCentOSを入れてC++11の開発環境を構築してipkn/crowでWeb開発を始めた

概要

  • クソみたいな備忘録
  • C++でWeb開発したかった
  • GCCでBoostとかを使いつつC++11で開発したかったがclangとの共存等がちょっとややこしかった
  • VirtualBoxにCentOS7を入れて、バックグラウンドでOSを動かしてSSHで接続するようにした
  • CentOS上でzshvimを導入し、使いやすくした
  • 諸々のソフトウエア等をインストールした

やったこと

VM上にCentOS7をインストール

がんばった(がんばってない、素直にやった)

VMCentOSコマンドラインからWindowを立ち上げずに起動できるようにする

$ cat .zprofile 
alias centos7='VBoxManage startvm CentOS7 --type headless'

これで$ centos7って打つだけで裏でCentOSが起動する この--type headlessってのがキモ

OS XからSSHVMCentOSに接続する

これを参考にすると良いと思います www.task-notes.com

注意点 * enp0s8の設定時に/24を忘れるとダメ * 上で192.168.56.10になっているのは192.168.56.111とかにしたほうが良い

また、OS XからSSHで接続する際に、毎回このアドレスを打つのはだるいので/etc/hosts192.168.56.111 centos7を追記しました こうすれば、SSHで接続する時に楽です

$ cat /etc/hosts
##
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting.  Do not change this entry.
##
127.0.0.1   localhost
255.255.255.255 broadcasthost
::1             localhost 

192.168.56.111 centos7

$ ssh root@centos7

zshを設定した

centos zshでググれば設定は沢山出てくるはず 僕の考えたさいつよの設定↓

github.com

vimを入れた

vim力低いのでアレ

$ yum install vim

僕の.vimrc

github.com

CMake 3.4のインストール

yumで入るCMakeはとても古いので、最新版を入れた

CMake

$ cd /usr/local/src
$ yum install wget gcc gcc-c++
$ wget https://cmake.org/files/v3.4/cmake-3.4.3.tar.gz
$ tar xvf cmake-3.4.3.tar.gz
$ cd cmake-3.4.3
$ ./bootstrap
$ make 
$ make install

crowを動かす

今回使いたかったのはこれ、ipkn/crow

github.com

まず、boostを入れる

$ yum install boost boost-devel

バージョン低いけどまぁ我慢、そのうち上げたい

プロジェクトを作っていろいろする ポート番号等は任意で

$ mkdir ~/development/hoge
$ cd ~/development/hoge
$ git init
$ git submodule add https://github.com/ipkn/crow
$ vim CMakeLists.txt
$ vim main.cpp
$ cmake .
$ make
$ .hoge
(2016-03-05 14:36:01) [INFO    ] Crow/0.1 server is running, local port 80

CMakeLists.txt

cmake_minimum_required(VERSION 3.3)
project(hoge)
set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -std=c++11")

find_package(Boost COMPONENTS date_time filesystem system thread REQUIRED)
INCLUDE_DIRECTORIES( ${Boost_INCLUDE_DIR} )

include_directories("crow/include")

set(SOURCE_FILES main.cpp)
add_executable(hoge ${SOURCE_FILES})

TARGET_LINK_LIBRARIES( hoge ${Boost_LIBRARIES} )

main.cpp

#include "crow.h"

int main()
{
    crow::SimpleApp app;
    CROW_ROUTE(app, "/")([]() {
        return "Hello world";
        });
    app.port(80).multithreaded().run();
}

80番ポートを開放

iptablesじゃなくなったっぽいね

$ firewall-cmd --add-port=80/tcp --zone=public --permanent$ iptables -A INPUT -p tcp --sport 80 -j ACCEPT
$ firewall-cmd --reload

あと、VirtualBoxの設定から、ネットワーク→アダプター1→ポートフォワーディングで80番を通しておきます

これでCentOS上でサーバーを動かして、そこにOS Xからアクセスできる!!

f:id:hayashikunsan:20160305235837p:plain

最後に

Pythonで書きます