CentOS-7-x86_64-Minimal-1804.iso をダウンロードしたい。
え、906Mって、何分かかるんだよ、これ。
気長に待ちましょう。iosをDLして、そこからつくるのか。なるほど。
isoファイルとは
ISOというのは、国際標準機構（ISO）が定義しているということ
ISOイメージファイルは、世界中で利用されるものなので、国際標準で形式が定義されている
centosは以下のURLからDLできる
https://wiki.centos.org/Download
NOTE: CentOS is available free of charge.
フリーと書いてます。ドメインがcentos.orgなのでcentosのようにですね。
isoのmirrorページがあるので、クリックしてみます。
http://isoredirect.centos.org/centos/7/isos/x86_64/
The following mirrors in your region should have the ISO images available:
http://ftp.iij.ad.jp/pub/linux/centos/7.5.1804/isos/x86_64/
http://mirror.fairway.ne.jp/centos/7.5.1804/isos/x86_64/
http://ftp-srv2.kddilabs.jp/Linux/packages/CentOS/7.5.1804/isos/x86_64/
http://ftp.yz.yamagata-u.ac.jp/pub/linux/centos/7.5.1804/isos/x86_64/
http://mirrors.cat.net/centos/7.5.1804/isos/x86_64/
http://ftp.jaist.ac.jp/pub/Linux/CentOS/7.5.1804/isos/x86_64/
http://ftp.tsukuba.wide.ad.jp/Linux/centos/7.5.1804/isos/x86_64/
http://ftp.riken.jp/Linux/centos/7.5.1804/isos/x86_64/
http://ftp.nara.wide.ad.jp/pub/Linux/centos/7.5.1804/isos/x86_64/
なにこれ。
sshdのポートを22番以外で開ける
ネットワークの入り口:ゲートウェイから全てのパケットが入ってくるので、サーバ毎にFirewallを設定する必要がある
Linuxであればiptables
22番以外を開ける理由は、22番ポートへの侵入を目的とするアタックを回避する
VPN経由で内部からしかリモートログインできない、特定のIPアドレスからのみリモートログイン出来る、という場合はFirewallが守る
代表的なプロトコル
ssh: tcp 22
http: tcp 80
https: tcp 443
ftpを使うなら tcp20, telnet 23, smtp 25, dns 53, dhcp 67, dp 68, pop3 110, ntp 123
なるほどね。
ローカル環境構築
なんだよこれ、ローカル構築とかいって、すげー重要やんけwww びっくりした。
いやー参ったね。。
vagrant boxとは?
– boxとは仮想マシンを作成する際に必要なOSのディスクイメージ、仮想マシンのテンプレート
あれ、boxって、vagrant fileと違うの？
まーいいか。
あ、boxをaddして、vagrant initして、vagrant upだ。initとupはわかるから、要はvagrant upね。
vagrantのboxをインストールする方法
vagrant box and [box-name] [box-url]
公式のページです。
https://www.vagrantup.com/docs/boxes.html
vagrant list of base boxes
http://www.vagrantbox.es/
centosは？ boxesを見ると、centos 7.2ってのがあって、これが一番最新のように見えるが。。
CentOS 7.2 x64 (Minimal, Puppet 4.2.3, Guest Additions 4.3.30)
centosのサイトを覗いてみる。ナニコレ、バージョンが幾つかよく分からない。
https://www.centos.org/download/
あれ、centos 7.4が最新のよう。centos6だと、6.10のようにです。つまりvagrant boxesはやや遅れ気味。
https://openstandia.jp/oss_info/centos/
これを入れたい。やってみよう。
https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.2/vagrant-centos-7.2.box
$ vagrant add centos72 https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.2/vagrant-centos-7.2.box
あ、なんか行けそうですね。vagrant box add は時間がかかりそうですが。
あれ？
>vagrant box list
bento/centos-6.7 (virtualbox, 2.2.7)
bento/centos-6.8 (virtualbox, 2.3.0)
centos72 (virtualbox, 0)
trusty64 (virtualbox, 0)
ubuntu/trusty64 (virtualbox, 20161207.0.0)
これで vagrant init centos72
vagrant init centos72
おおおおお、vagrant file理解した。
次はboxを作りたいですな。
IAMロールを作成する
IAMロールを作成する
ポリシーには以下二つの権限をつける。
-AWSLambdaBasicExecutionRole
-AmazonS3FullAccess
'use strict';
const aws = require('aws-sdk');
const s3 = new aws.S3();
exports.handler = function(event, context){
console.log('Received event:', JSON.stringify(event, null, 2));
const uploadBucket = event.Records[0].s3.bucket.name;
const key = event.Records[0].s3.object.key;
const params = {
Bucket: uploadBucket,
Key: key
};
s3.getObject(params, function(err, data){
if(err){
console.log(err, err.stack);
context.done(err, err.stack);
} else {
console.log('data: ', data);
const copyBucket = 'sample-copy-bucket';
const params = {
Bucket: copyBucket,
Key: key,
Body: data.Body
};
s3.putObject(params, function(err, data){
if(err){
console.log(err, err.stack);
context.done(err, err.stack);
} else {
console.log('data: ', data);
context.suceed('complete!');
}
});
}
});
};
amazon lambdaとは?
amazon lambdaとは？
– 事前に定義したコードを実行するサービス
– 処理のトリガは何かしらのイベント(s3にファイル配置、ストリームデータ受信など)
– node.js//javaで実装
– サーバ、ロギング、スケーリングなどインフラ設計・管理が不要
– 実行回数によって課金
aws cloudTrail -> Source Bucket -> Amazon S3 -> AWS Lambda -> Lambda Function -> Access Policy -> Topic -> Amazon SNS
s3でbucketを作成します。
iamからロールを作成します。
animocon
animocon
https://tympanus.net/Development/Animocons/
背景のみopacityを設定するには
background-colorとopacityを設定すると、テキストまで透過してしまう。
#judge{
margin-top:15px;
opacity:0.5;
background-color:#ff6347;
width:100%;
padding-top:5px;
padding-bottom:5px;
text-align:center;
color:#fff;
}
rgbに変える。
#judge{
margin-top:15px;
background:rgb(255,99,71,0.5);
width:100%;
padding-top:5px;
padding-bottom:5px;
text-align:center;
color:#fff;
}
ぬ、colorが#fffだから変更が目立たないorz
エンジニアの聖地 渋谷Freeman cafe
エンジニアの聖地、Freeman cafeに行ってきた。隣との席が近いね。
エージェントの営業っぽい人が、フリーランスのメリットを力説してエンジニアを口説いて笑えた。
見た感じ、IT系の客が3～4割ってところか。コーディングするのはルノアールとかより心地よいかも。
ただ、客が多いから、本当に集中するなら、潰れそうなガラガラのカフェの方が集中できる。
複数チェックボックスを操作
<input type="checkbox" name="category_01" id="category_01" value="01" class="hokkaido">
<label for="category_all"><b>北海道</b></label><br><br>
<input type="checkbox" id="area_tohoku" name="category_all">
<label for="category_all"><b>東北</b></label>
<div id="pref_tohoku">
<input type="checkbox" name="category_01" id="category_01" value="01" class="tohoku">
<label for="category_01">青森</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="tohoku">
<label for="category_02">岩手</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="tohoku">
<label for="category_03">宮城</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="tohoku">
<label for="category_04">山形</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="tohoku">
<label for="category_05">福島</label>
</div>
<br>
<input type="checkbox" id="area_kanto" name="category_all">
<label for="category_all"><b>関東</b></label>
<div id="pref_kanto">
<input type="checkbox" name="category_01" id="category_01" value="01" class="kanto">
<label for="category_01">茨城</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="kanto">
<label for="category_02">栃木</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="kanto">
<label for="category_03">群馬</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="kanto">
<label for="category_04">埼玉</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kanto">
<label for="category_05">千葉</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kanto">
<label for="category_06">東京</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kanto">
<label for="category_07">神奈川</label>
</div>
<br>
<input type="checkbox" id="area_chubu" name="category_all">
<label for="category_all"><b>中部</b></label>
<div id="pref_chubu">
<input type="checkbox" name="category_01" id="category_01" value="01" class="chubu">
<label for="category_01">新潟</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="chubu">
<label for="category_02">富山</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="chubu">
<label for="category_03">石川</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="chubu">
<label for="category_04">福井</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chubu">
<label for="category_05">山梨</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chubu">
<label for="category_05">長野</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chubu">
<label for="category_05">岐阜</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chubu">
<label for="category_05">静岡</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chubu">
<label for="category_05">愛知</label>
</div>
<br>
<input type="checkbox" id="area_kinki" name="category_all">
<label for="category_all"><b>近畿</b></label>
<div id="pref_kinki">
<input type="checkbox" name="category_01" id="category_01" value="01" class="kinki">
<label for="category_01">三重</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="kinki">
<label for="category_02">滋賀</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="kinki">
<label for="category_03">京都</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="kinki">
<label for="category_04">大阪</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kinki">
<label for="category_05">兵庫</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kinki">
<label for="category_05">奈良</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kinki">
<label for="category_05">和歌山</label>
</div>
<br>
<input type="checkbox" id="area_chugoku" name="category_all">
<label for="category_all"><b>中国</b></label>
<div id="pref_chugoku">
<input type="checkbox" name="category_01" id="category_01" value="01" class="chugoku">
<label for="category_01">鳥取</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="chugoku">
<label for="category_02">島根</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="chugoku">
<label for="category_03">岡山</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="chugoku">
<label for="category_04">広島</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="chugoku">
<label for="category_05">山口</label>
</div>
<br>
<input type="checkbox" id="area_shikoku" name="category_all">
<label for="category_all"><b>四国</b></label>
<div id="pref_shikoku">
<input type="checkbox" name="category_01" id="category_01" value="01" class="shikoku">
<label for="category_01">徳島</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="shikoku">
<label for="category_02">香川</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="shikoku">
<label for="category_03">愛媛</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="shikoku">
<label for="category_04">高知</label>
</div>
<br>
<input type="checkbox" id="area_kyushu" name="category_all">
<label for="category_all"><b>九州・沖縄地方</b></label>
<div id="pref_kyushu">
<input type="checkbox" name="category_01" id="category_01" value="01" class="kyushu">
<label for="category_01">福岡</label>
<input type="checkbox" name="category_02" id="category_02" value="01" class="kyushu">
<label for="category_02">佐賀</label>
<input type="checkbox" name="category_03" id="category_03" value="01" class="kyushu">
<label for="category_03">長崎</label>
<input type="checkbox" name="category_04" id="category_04" value="01" class="kyushu">
<label for="category_04">熊本</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kyushu">
<label for="category_05">大分</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kyushu">
<label for="category_05">宮崎</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kyushu">
<label for="category_05">鹿児島</label>
<input type="checkbox" name="category_05" id="category_05" value="01" class="kyushu">
<label for="category_05">沖縄</label>
</div>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script>
$(function(){
$('#area_tohoku').on('click', function(){
$('.tohoku').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_tohoku :checked').length == $('#pref_tohoku: input').length){
$('#area_tohoku').prop('checked', 'checked');
} else {
$('#area_tohoku').prop('checked', false);
}
});
$('#area_kanto').on('click', function(){
$('.kanto').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_kanto :checked').length == $('#pref_kanto: input').length){
$('#area_kanto').prop('checked', 'checked');
} else {
$('#area_kanto').prop('checked', false);
}
});
$('#area_chubu').on('click', function(){
$('.chubu').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_chubu :checked').length == $('#pref_chubu: input').length){
$('#area_chubu').prop('checked', 'checked');
} else {
$('#area_chubu').prop('checked', false);
}
});
$('#area_kinki').on('click', function(){
$('.kinki').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_kinki :checked').length == $('#pref_kinki: input').length){
$('#area_kinki').prop('checked', 'checked');
} else {
$('#area_kinki').prop('checked', false);
}
});
$('#area_chugoku').on('click', function(){
$('.chugoku').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_chugoku :checked').length == $('#pref_chugoku: input').length){
$('#area_chugoku').prop('checked', 'checked');
} else {
$('#area_chugoku').prop('checked', false);
}
});
$('#area_shikoku').on('click', function(){
$('.shikoku').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_shikoku :checked').length == $('#pref_shikoku: input').length){
$('#area_shikoku').prop('checked', 'checked');
} else {
$('#area_shikoku').prop('checked', false);
}
});
$('#area_kyushu').on('click', function(){
$('.kyushu').prop('checked', this.checked);
});
$('.category').on('click', function(){
if($('#pref_kyushu :checked').length == $('#pref_kyushu: input').length){
$('#area_kyushu').prop('checked', 'checked');
} else {
$('#area_kyushu').prop('checked', false);
}
});
});
</script>
関東にチェックを入れると、関東の都道府県すべてにチェックが入ります。
jsは長いので、保守性を考慮して、別ファイルにしましょう。
これを実装
いい感じ♪