読者です 読者をやめる 読者になる 読者になる

青いやつの進捗日記。

べんきょうのしんちょくをかいていきます。プログラミング初心者。

【Processing ビジュアルデザイナーのためのプログラミング入門】基本図形を描く。

Processing、左上を0として、そこに右はx、下はy。 どこか1点を指定するときは(x, y) で指定する。

size(x, y);
左上から右にx、下にyの大きさのディスプレイウィンドウを作る。

point(x, y);
ウィンドウの左上から右にx、下にyのところに点を打つ。

line(x1, y1, x2, y2);
(x1, y1)から(x2, y2)へ直線を引く。

triangle(x1, y1, x2, y2, x3, y3);
(x1,y1)(x2,y2)(x3,y3)を頂点とした三角形を作る。
line( )でも線をつなげれば三角形を作ることはできるが、triangle( )では塗りを持つ三角形を作れる。

quad(x1, y1, x2, y2, x3, y3, x4, y4);
(x1,y1)〜(x4,y4)を頂点に持つ四角形を作る。
不規則な四角形を作ることができる。

rect(a, b, c, d);
ウィンドウの左上から右にa、下にbのところから、右にc、下にdの長さを持った長方形を作る。

ellipse(a, b, c, d);
(a, b)を中心に、幅c、高さdの楕円を作る。
cとdを同じ値にすると、正円になる。

arc(a, b, c, d, start, stop);
(a, b)を中心に、幅c、高さdの楕円を作る。
そしてstart, stopにはそれぞれ radian( )で始まりの角度と終わりの角度を指定し、
円弧を作る。楕円の右端を0とする。
arc(a, b, c, d, start, stop, mode);
arc( )のもう1つのやり方。
modeはOPEN, CHORD, PIEの3つがある。
OPENが標準。円弧の部分。
CHORDだと出来た楕円全てを囲う線。
PIEだと、中心からstart, stopまでそれぞれ直線で結んだ図形になる。

bezier(x1, y1, x2, y2, x3, y3, x4, y4);
より複雑な曲線が書ける。
(x1,y1)から(x4,y4)に向けて曲線が作られる。
(x2,y2)と(x3,y3)はコントロールポイントになる。
(x1,y1)と(x2,y2)、(x3,y3)と(x4,y4)を直線で結び、それを基準に曲線を作るイメージ。

描画の順序は、上から順番。
background( ); 背景の色
fill( ); 図形の中の色
stroke( ); 図形を囲う線の色
を、指定できる。
1度指定すると、fill( )とstroke( )はその後全てに影響する。
変更したい時はもう1度指定。

【フルスタックWebエンジニアコース】HTML5コースは終わりました

【世界で30万人が受講】フルスタック・Webエンジニア講座(2017最新版) | Udemy

 

これのHTML5コースを終えました。

 

HTML5は知ってたので、なんとなく2倍速で流し見して終わりました、(笑)

 

f:id:XxGodmoonxX:20170224162930p:plain

この流れでCSS3コースもさらさらと進めていきたいと思います。

Udemy見てたらなんかAtom使ってみたくなったから、脱線してSublime Text3からAtomに乗り換えてみた

UdemyでフルスタックWebエンジニア講座

【世界で30万人が受講】フルスタック・Webエンジニア講座(2017最新版) | Udemy

見てて、

まあまだ導入なんですけど、使うエディターの導入の仕方みたいなのやってて。

まあ紹介されてたのはBracketsだったんですが。

 

もともと使ってるエディタはSublime Text3でした。

(もともととか言ってるけどほとんどプログラミングやったことないようなもんだからまあそんな使ってるって言うほどではない)

 

で、Atomって世間的にけっこう使われてるなと思ってまして。

前のインターン先もAtomでしたし。

 

ということでなんか気分変えたくなって、急遽Atomを導入してみようかなあ、と。

 

というわけでAtomの設定備忘録。

 

参考資料は

tech-camp.in

creator.dwango.co.jp

qiita.com

qiita.com

そして、ドットインストールAtom入門。

http://dotinstall.com/lessons/basic_atom_v2

 

 

ThemeはMaterial。

Google Material Designてきなやつ。

なんでかってSublime TextでもMaterialだったから。

SyntaxもUIもAtom-Material。

 

そして、file-iconsというパッケージもインストール

 

あ、フォントにRicty Diminishedを設定。するといいらしい。

0とoが見分けつきやすくなる。(ドットインストールより)

 

f:id:XxGodmoonxX:20170218173003p:plain

まあだいたいこんな感じ。

 

あとはパッケージで、

highlight-selected 同じ言葉をハイライト

tag タグを</と打つだけで閉じてくれます

autocomplete-paths パスの補完をしてくれます

minimap ミニマップが出るようになります

minimap-highlight-selected ミニマップにもハイライトが出るようになる

highlight-line 行をハイライト

highlight-column 列をハイライト

color-picker カラーパレットが表示される

pigment カラーコードなど色を入れるとその部分が本当にその色に変わる

maximize-pane 現在のペインを一時的に最大化

browser-refresh コードを更新したらブラウザも更新してくれる

indent-guide-improved インデントの差分がわかりやすくなる

minimap-autohide minimapが自動で非表示になる

 

だいたいこんな感じですかね。

 

ツリービューの表示が大きくてちょっと納得行かない。

UI themeだけ変えるかもしれない…

 

と、思ってたが、Atom material UIのtree viewのところ見たら

Compact tree view

ってあって、そこチェックしたらいい感じになった…最高か…

 

「Complete Web Developer Course 2.0」の日本語版、「フルスタックWebエンジニア講座」をUdemyで受講し始めました。

大学入って約2年。

大学入ってプログラミングをやってみたくて、でもやろうとして、なかなかできず、結局いまに至ってしまいました。

 

というわけで、そろそろ本当にちゃんとしようと思いまして。

 

そんな風に思っていた矢先、新年明けた直後、

Udemyで、なんかほとんどのコースが1200円で受講できるキャンペーンみたいなものをやってまして、勢いで受講しようと思い、始めてみました。

まあ本来24000円するみたいですし、いいかな、と。

 

フルスタックWebエンジニア講座

【世界で30万人が受講】フルスタック・Webエンジニア講座(2017最新版) | Udemy

 

Complete Web Developer Course 2.0

ってやつの日本語版。

 

というわけでモチベーションという意味合いも含め、勉強に関するブログを書いてみようと思います。