人生、暇なり!!!孤独なりなり!!!

社会人2年目ぼっち男。口と手が動くプログラマーを目指す。友達と彼女作る。

【絶対面白い・役立つ】プログラミング超初心者にレクチャー!!!!

マジで面白い!プログラミングわかる!だから読んで!ただしGoogle Chromeは必須です。

 

今日ブログ始めたんけど、なんか結構いいね貰ったんだよね。お、こりゃいいやと思って、他の人の覗いてたら、人気ある記事ってのは、役立つ記事なんだな。だから役立つし、尚且つ面白い記事を書くことにした。んで、俺に出来るのは多少のプログラミングだから、手っ取り早くプログラミングっぽさを感じられることを書きます。

 

上にも書いたけど、一応Google Chrome必須ってことにしました。他のブラウザでも、コンソール入力できる奴なら何でもいいと思う。chrome前提で話すので、もし他のブラウザだから出来ない。だけどどうしてやりたいって人はコメ下さい。調べるんで。じゃ、始めます。

 

デベロッパーツールを開く

Google Chrome開いてるよね。右上にある縦点3つのメニューを開いてください。画像も参考に。

 

f:id:banaoa7543:20170725232518p:plain

 

推すとメニューが下に広がるから、「その他のツール」→「デベロッパーツール」と進んでね。

 

f:id:banaoa7543:20170725232900p:plain

デベロッパーツールを押すと、画面の右になんか難しそうな画面が出てくるよね。これがデベロッパーツールといわれるもの。

f:id:banaoa7543:20170725233229p:plain

 

②コンソールをいじってみる

デベロッパーツールの上側に「Console」という項目があるので、それをクリックすると、画面が変わるよね。

 

f:id:banaoa7543:20170725233410p:plain

 

スクロールして一番下まで行くと、↓の画像みたいな入力できるところがあると思います。これがコンソールね。

 

f:id:banaoa7543:20170725233557p:plain

 

そこに、alert("Hello, world!!")と入力してエンターしてください。

 

f:id:banaoa7543:20170725233839p:plain

 

じゃじゃーーん!何か出てきたよね。これがあなたの初プログラミング!おめでとう。このコンソールに書いたのはjavascriptというプログラミング言語です。いろいろやりたかったら、「javascript 入門」とかでググってみてね

同じ感じで、コンソールに、

 

1 + 1

alert(1+1)

var a = 1

alert(a)

if(a==1){
    alert("1です。")
}else{
    alert("1じゃありません。")
}

 

とか入力してみてね。プログラミングというものがわかってくると思う。よくわからなかったら調べてみよう!ちなみにこういうプログラミングの文字列をコードソースコード、、、なんて呼び方をします。

 

③もうちょっとコンソールで遊んでみる!

同じように、コンソールに、

 

document.getElementById("title").innerHTML = "<p>(^o^)</p>"

 

って入力してみて。そして、今開いてるページ(このブログ)の上の方にスクロールすると・・・。面白いだろ!!!!ハッカーになった気分。でも大丈夫、更新すると元に戻るから。上のコードについても「javascript getelementByID」とかで検索してもらえれば分かるかもしれない。簡単に解説すると以下。

 

HTMLというWebページの文字が書いてあるものがある(今読んでる記事の内容もHTMLに書かれている。)。HTMLを構成している要素のうちidが「title」のものを選んで、その中身(innerHTML)を「=」以降の内容に置き換えている。

 

という感じ。HTMLの知識が要るからちょっと難しいかもしれない。分かると面白いよ。最後にもう一個紹介します。Google Chromeの上の方を見ると、

 

f:id:banaoa7543:20170726000402p:plain

 

みたいなのがあると思う。確認したら、↓のコードをコンソールに入力してね

 

document.getElementsByTagName("title")[0].innerText = "読んでくれてありがとう!!!"

 

最後に補足

 長くなったけど、プログラミング学習の入りになったら嬉しい。すごく単純に言うと、上で書いたようなコードをたくさん書いていくと、こういうWebサービスを作ることができる。1億里の道は1歩からってレベルだけど、プログラミングなんて大して難しくないぞ!ってことで。

 

See you next time!