プログラミングに興味があるけど何をしたらいいか分からない人へ

ページ目次

1 まえがき
2 プログラミングに関する質問
3 プログラミングは簡単なものもある
4 そもそも何をすればいいかわからない
5 HTMLを体験してみよう！
6 で、結局どう勉強すればいいの？
7 プロゲートに登録して使ってみよう！
8 実際にレッスンを受けてみよう！
9 プロゲートを使いこなすコツ
10 プロゲートの有料会員について
11 プログラミングに関する質問

まえがき

プログラミングに興味ある人たちに「プログラミングは難しいものばかりではない！」ってことを伝えたいのと「興味があるけどなかなか手が出せない」って人たちにどうにかアドバイスが出来ないかということで、この記事を書いてみました。

実際自分も、中高生のときにプログラミングに興味がありましたが、難しすぎて無理と決めつけて、専門学校に入るまでは何もしてきませんでした。

でも、実際やってみると「これなら、あの頃でも出来たよな...」と感じることもあります。

基本的には、今の自分がその頃の自分へのアドバイスしたい事を書いていくスタンスにします。まえがきを読んで共感する部分が少しでもあれば、ぜひ読んでいってほしいです。

※この記事では宣伝してお金もらったりとかは一切していません！ただの布教活動ですので安心して読んで下さい！

プログラミングに関する質問

Twitter: @kzkzkazz

Mail: info[あっとまーく]kazzblog.com

TwitterのDMまたはメールで受け付けています〜。どんな質問でも気軽にどうぞ〜。

プログラミングは簡単なものもある

簡単なものもあるという表現にしたのも、実際は難しいものもあります。ですが、そうでもないものもあります。

例えばゲーム開発となると、物理とか数学とかが分かってないと詰んでしまうこともあるでしょうし、ロジックが複雑だったりします。

ですが、そんなに凝っていないホームページやアプリを作るくらいなら、そのやり方を覚えるだけで開発できます。よく勘違いされがちですが、プログラミングは頭がよくないと出来ないなんてことは一切ないです！

いきなり難しいことをしようと挫折します。プログラミング言語はそれぞれ似たりよったりな部分もありますので、そういう意味では、最初はハードルを下げて理解していくことで、やがては難しいことも出来るようになるでしょう。

そもそも何をすればいいかわからない

これが一番の難関ですよね。

個人的には、Webページの形を作る「HTML」と、そのHTMLを装飾する「CSS」を触ってみると良いと思います。この２つはセットで触るといいでしょう。

HTMLはとてもシンプルで、特殊な環境がなくとも動きます。普通は開発環境を整えたりしなくても、PCとブラウザ(GoogleChromeやMicrosoftEdgeなど)があれば開発を進められます。

HTML&CSSから派生していって、PHPやPythonやRubyというプログラム言語を使って、掲示板やSNSを作ったり、WordPressという技術を使って自分だけのホームページを作ったりも出来ます。

またこれらの技術の学び方は

プログラミング学習サービス
プログラミング技術書
検索エンジン

をうまくつかっていくといいでしょう。

特に何もわからないよって方は、Webで学べるプログラミング学習サービスがおすすめです。１つ例にとってprogate(プロゲート)というサービスの使い方を下の方で解説するので、そちらもぜひ見ていってください！

HTMLを体験してみよう！

とりあえず一回体験しておきましょう。それが一番いいです。

HTMLは、正しくはプログラミングではないですが、やってることはプログラミングみたいなものです。段階を踏んで学んでいくことを考えたら、絶対に損はないはずです。それに、今後プログラミングをやっていきたいというのであれば、このHTMLは絶対役立ちます。

① デスクトップで右クリックからテキストドキュメントを作成。

② ファイルを右クリックして、名前を変更からxxx.htmlのような名前をつけます。xxxの部分はアルファベットです。最後の.htmlは必須です。これでHTMLファイルの出来上がりです。

③ HTMLファイルをメモ帳で開きます。

④ メモ帳にこのプログラムをコピペして保存します。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>マイページ</title>
</head>
<body>
    <h1>ホームページ！</h1>
    <p>ようこそホームページへ！</p>
</body>
</html>

<!DOCTYPE html>

<head>

<title>マイページ</title>

</head>

<body>

<h1>ホームページ！</h1>

<p>ようこそホームページへ！</p>

</body>

</html>

⑤ GoogleChromeなどのブラウザで開きます。

うん、ちゃんと出来ていますね！

HTMLのコードとページを比較してみましょう！

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>マイページ</title>
</head>
<body>
    <h1>ホームページ！</h1>
    <p>ようこそホームページへ！</p>
</body>
</html>

<!DOCTYPE html>

<head>

<title>マイページ</title>

</head>

<body>

<h1>ホームページ！</h1>

<p>ようこそホームページへ！</p>

</body>

</html>

それぞれ対応しているのがわかりますね！

この<title></title>や<h1></h1>のように、文字を囲っているものをタグといいます。<タグ名>は「タグ」といいます。先頭にスラッシュのついてる</タグ名>は「閉じタグ」といいます。そして、titleタグやh1タグといったりします。

コード中にもある<!DOCTYPE html>とか<meta>とかはなんなの？って思うかもしれません。これらはWebページのテンプレみたいなもので、まだ深く理解する必要はありません！

HTMLのタグはたくさん種類があって、URLのリンクを貼るaタグや改行するbrタグなど、ここで挙げていったらキリがないくらいです。

自分で色々やってみたいという人は、Googleで調べてもいいし、HTMLタグリファレンスに分かりやすくまとめられていたりもします。

↓テンプレを用意したので自分で色々遊んでみよう！

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ここにタイトル書くよ</title>
</head>
<body>
    ここにいろんなタグを書いて表示させるよ<br>
    文章以外は全部半角だよ！
</body>
</html>