ソーダ色の研究

フロントやらバックやらなんやら

分散型バージョン管理システムとは

そもそもバージョン管理システムとは

機能追加やバグの修正毎のソースコードの状態を記録し、それぞれのバージョンのソースコードを管理するためのソフトウェアの事。要するに、ファイルの変更履歴を管理するためのシステム。

主なバージョン管理システム

集中型(SVN) VS 分散型(Git)

バージョン管理システムには、集中型と分散型がある。 集中型の有名どころはSVN、分散型の有名どころはGit。 分散型のほうが後発で、結論から言えば、ぶっちゃけこっちのほうが優れてると言わざるを得ない。知らんけど。

集中型とは

リポジトリ(ファイルそのものや変更履歴を保存する場所)が1つ。中央リポジトリからコードを持ってきて編集して、終わったら中央リポジトリに反映。ローカルとリポジトリが置かれたサーバーで、commit(登録)update(取得)をやりとりする。

分散型とは

リポジトリを複数持てる。サーバー上にリモートリポジトリを置いて、開発者はそれぞれローカルにリポジトリを持つ、みたいな構成が可能。リポジトリを複数持つ事によって、集中型にはない様々なメリットがある。

分散型のメリット

分散型では、リモートリポジトリのコピーをクローンして、ローカル上にそのプロジェクトの完全な履歴を持つことができる。(ローカルリポジトリ) そうする事によって、 - ファイルを変更するたびにリモートサーバーにアクセスする必要がないため、高速に操作できる。(addとかcommitとか。pushとかpullの時だけリモートにアクセス) - ネットつながってなくてもcommit可能。 - 変更を加えてcommitをするたびに、それが開発者全員にさらされるなんてこともない。 …など

結論

Git最高。まだまだGitの知らない機能も多いので、頑張って習得したい。

cronで定期的にプログラムを実行する

cronとは

cronとは、多くのUNIX系OSで標準的に利用される 常駐プログラムデーモン )の一種で、利用者の設定したスケジュールに従って指定されたプログラムを定期的に起動してくれるもの。

  • crontabファイルに書かれたスケジュールに従って、決まった日時に指定したプログラム(phpとかシェルスクリプトとか)を実行できる。
  • unix系なのでwindowsは無理っぽい

cronの登録

$ crontab -e

上記コマンドでシステム指定のエディタが開く(viとか)

00 10 * * * /home/usermei/hogehoge.sh

上記のような命令を記述する。上記は毎日10:00にhogehoge.shを実行するというもの。

書き方

  • 左から順に、分・時・日・月・曜日・コマンドの順に記入する
  • 曜日は0と7は日曜、1以降は順に、月、火、水、木、金、土
  • コマンドは必ず、フルパスかカレントディレクトリからの相対パスにする
* * * * *        毎分実行
00 10 * * *      10:00に実行
0 10 * * 1       毎週月曜10:00に実行
0 10 * * 0,1,2   毎週日,月,火の10:00に実行
*/10 * * * *    10分おきに実行
00 10 1,15 * *  1日と 15日の10:00に実行

登録済みのcronの確認

$ crontab -l

登録済みのcron全削除

$ crontab -r
  • 間違って実行しちゃうと全部消えちゃう

注意点

  • スクリプトのパスに気をつけること。
  • 近い時間帯で必ずテストすること。
  • cronするスクリプトは、登録する前に必ず手で叩いて実行すること。
  • crontab -r

PATHを通す(Mac)

$ cd ~

ホームディレクトリに移動して、

$ ls -a

.bash_profileがなかったら、

$ touch .bash_profile

で作る。

$ open .bash_profile

エディタで開いて、

export PATH=$HOME/****/bin:$PATH

こんな感じで追記する。保存したら、

$ source .bash_profile

で、反映させる。

$ printenv PATH

で、確認。

おしまい。

Vueでスマホのスワイプ操作【vue-touch】

vue.jsを使っていて、スワイプ操作した時の処理ってどう書くんだろうと思い調べてみたら、 バッチリなライブラリがありました。

github.com

Readmeを読んでみると、どうやら Hammer.jsのwrapperらしい。

とりあえずインストール

npm install vue-touch@next

で、main.js、要はnew Vue書いてる上辺りとかに

const VueTouch = require('vue-touch')
Vue.use(VueTouch, {name: 'v-touch'})

これで準備OK

<template>
    <v-touch
      v-on:swiperight="swipeRight"
      v-on:swipeleft="swipeLeft"
      :swipe-options="{direction:'horizontal'}"
    >
        //スワイプさせたいコンテンツ
    </v-touch>
</template>

<script>
    export default {
        data() {
            return {
            }
        },
        methods:{
            swipeRight(){
                console.log('右にスワイプしたよ')
            },
            swipeLeft(){
                console.log('左にスワイプしたよ')
            }
        },
    }
</script>

これだけでスワイプ時の処理が実装できました。 ちなみに

:swipe-options="{direction:'horizontal'}"

と指定したのは、v-touchで囲ったことによって縦方向のスクロール操作ができなくなってしまったからです。

縦方向というか、基本全方向のスクロール操作が効かなくなるっぽいですね。

directionを指定してスワイプ操作を有効にする方向を決めてあげると、それ以外の方向のスクロールが有効になりました。
(今回だとhorizontalを指定してるので水平方向のみ有効)

vue-touchを簡単に紹介しました。 めっちゃ便利やなこれ。

jsで配列をシャッフルする

マークダウンの練習がてら、BoostNoteに書いていたメモを少しずつこっちに移していこうかなと。

とりあえず最初はこれ。

const shuffleArray = (array)=>{
  let n = array.length, t, i;

  while (n) {
    i = Math.floor(Math.random() * n--);
    t = array[n];
    array[n] = array[i];
    array[i] = t;
  }

  return array;
};

引数に配列を渡してやると、シャッフルして返します。

const exampleArray = [1,2,3]
console.log(shuffleArray(exampleArray));

コンソールにシャッフルされた配列が表示されるかと思います。

因みに、下記のようにすれば、より簡潔に書けますが、 シャッフルに偏りが出てしまうので、ある程度厳密なシャッフルが必要な場合は 注意が必要です。

const exampleArray = [1,2,3]
exampleArray.sort(() => Math.random() - 0.5);

console.log(exampleArray);

おしまい