学習1日目:テックアカデミーの事前受講。

テックアカデミープロという就職支援付きのコースに申し込みました。現在25歳の私ですが人生計画を考えた時に今のままだと食いっぱぐれる可能性が非常に高いので。。服作りはちょっと落ち着いてきたら再開したいと思います。それがいつになるかはわかりませんが。

さて、プログラミング言語は数え切れないほどありますが、その中でもJavaを中心に学習していきます。

Javaを選んだ理由は今のところ業界で最もニーズがある言語であるということ。また、C言語と並んで習得が(比較的)難しいと言われているので希少性があると思ったからです。今までにブログの運営などでワードプレスのコードを触る機会が何度もありましたが、HTML、CSS、JavaScript、PHPは意外にイケた(汚いコードだけど)。そういったフロントエンドと呼ばれている領域は視覚に対して直接的で面白そうですが、バックエンドも調べるほどに興味が湧いてきたので独学では難しそうなJavaを選択しました。後から感想は変わるかもしれません、如何せん無知なので。

受講開始日は来月8月17日(月)です。テックアカデミーは先割という制度があり、早く申し込めば8%の割引を受けることができます。それと同時に、支払いを完了することでカリキュラムの閲覧が可能になります。私はできるだけ早くカリキュラムを終わらせて、ポートフォリオに入れられるような作品?を作りたいのでこの1か月間で基礎はある程度終わらせたいと考えています。

そして、カリキュラムと並行して最近放置気味だったブログに活力を与えるべく、毎日の進捗ならびに日記を更新していくことをここに宣言します。後から振り返るのも楽しそうだし、これからプログラミングを始める人の参考になればこれ以上嬉しいことはないですね(大仰)。

しかし、不安な点が一つ。それは日記の毎日更新を途中で投げやりにしてしまうことです。今、この記事を書いているときのモチベーションと明日の夕方のモチベーションが同じとは限りません。その解決策としてテンプレートを作り、それに対象を当てはめていくだけで日記になるようにしていこうと思います。

  • 学習時間
  • 学習内容
  • 明日の目標
  • 日記

項目を増やしすぎれば投稿画面を開くのが億劫になってしまうだろうからこれくらいにしておきます。受講が始まればメンターの方に質問できるので内容も当然変わってくるかと。そこまでは自力でやっていこう。

所信(初心)表明はここまで。早速、カリキュラムを初めてみました。

学習時間について。

  • Day:1
  • Today:8h
  • Total:8h

この記事を書く時間も含めています。最初だから時間が掛かったけど、できれば30分以内に書き上げたいです。

今日の学習内容。

とにかくカリキュラムを進めています。

カリキュラムを進めるにあたっての事前準備。

まずはツールを揃える必要があります。

  • Google Chrome(webブラウザ)
  • Gyazo(キャプチャを共有できるアプリ)
  • Slack(チャットツール:質問に使用)
  • eclipse(Javaアプリケーションの開発環境)
  • Talky(ビデオ通話:メンタリングに使用)

上記が必要不可欠なツールですが、ChromeとSlackはインストール済みだったのでスルー。

Gyazoというアプリは存在を初めて知ったけど、とても便利。URLでスクリーンショットが共有できるので無駄な容量を使わずに済むし、スピード感がある。

この中でも謎が多かったのがeclipse。各種設定は説明を見ながらサクッと終わらせたけど、その項目自体にどんな意味があるのか説明がない(説明されてもこの時点では分からないだろうけど)ので、もどかしさが残った。一通り学習を終えてから調べ直そうと思う。

Talkyというサービスも初めて知った。アカウント作成が不要なので使い道が色々ありそう。私事だけど、海外のペンパルに英会話の相手をしてもらうときに使ってみたいと思った。

その他のオリエンテーション。

  • 学習の目安時間
  • ショートカットキーの紹介
  • Javaコースのゴール

以上の3点についての説明。このあたりは読み込んでもしょうがないので一読しただけで先に進めました。その後はインターネットに関しての基礎的な知識を学びます。高校の情報系授業で習うような内容(例:リクエストとレスポンスなど)。

また、Webアプリケーション開発に必要な知識として以下の項目を学んでいきます。

  • HTMLとCSS(マークアップ言語)
  • Java・サーブレット・JSP(アプリケーションサーバ)
  • MySQL(データベースサーバ)
  • GitとGitHub(バージョン管理)

HTMLの基礎。

HTMLの基本中の基本をおさらい。

<!DOCTYPE html><!-- DOCTYPE宣言 -->
<html>
    <head>
        <meta charset="UTF-8"><!-- 文字エンコード -->
        <title>タイトル</title>
        <link rel="stylesheet" href="https://kiki.moda/style.css"><!-- 外部ファイルを参照 -->
        <meta name="description" content="メタディスクリプションは検索エンジンの検索結果ページに表示されるので、SEO上非常に重要">
    </head>
    <body>
        <p>p要素のpはパラグラフのp<p>
        <a href="https://kiki.moda/">リンク</a>
        <a href="https://kiki.moda/wp-content/theme/images/logo.png" alt="altは画像に対するテキストでの説明"></a>
        <ul>
            <li>リスト1</li>
            <li>リスト2</li>
            <li>リスト3</li>
            <li>リスト4</li>
        </ul>
    </body>
</html>

テーブルの作成はブロックエディターに頼ってばかりだったから、ややこしく感じた。しかし、実際にコードを書いてみると構造を理解できる。JS-Binを埋め込んでみたけど、あれって有料会員じゃないとembedできないのね。残念。

結果を表示できる無料のエディターがあればと思って調べたらCodePenというのが良さげだったので導入。

See the Pen table_practice by 林 慶典 (@egjuboey) on CodePen.

表だけでも奥が深い。。

次はお問い合わせフォームとかに使われるform要素。type="password"でプライバシー保持のために黒い丸で表示されるのがポイント。

See the Pen form_practice by 林 慶典 (@egjuboey) on CodePen.

気になった点。

HTMLとCSSのコーディング作業は解説や課題提出の都合上eclipse上で行うとあるが、eclipse以外でオススメなエディターはあるか。また、エディター毎の特徴について。
  • Sublime text3
    • 操作画面が綺麗、多数のコマンド
  • Atom(Github)
    • 様々な言語に対応、拡張機能が豊富
  • Brackets(Adobe)
    • 標準でプレビュー機能、シンプル
  • Visual Studio Code(Microsoft)
    • 自動補完機能、カスタマイズが豊富
  • webstorm(JetBrains)
    • 有料、自動補完の機能が優秀
  • Dreamweaver(Adobe)
    • 有料

さっとネットで調べてみた。実際に使ってみたわけではないけど、一度は全て試してみないと。

<!DOCTYPE html>を記述することでHTML5であることを宣言するわけであるが、HTML4.01の際はどのように記述されていたのか。また各バージョンの違いについて。

HTML4.01の場合:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

2014年から導入されたHTML5。様々な変更点があったけど、全て細かいことばかりという印象。全部は書き切れないから割愛します。そもそもHTML4のことについて調べても使う機会がないから意味ない気もする。。

見出しほどの強い意味を持たず、セクションを分けたい場合にはsection要素を利用するとあるが、SEO的には見出しほどの効果?が期待できないということなのか(<section>内に<h2>タグを入れる場合)。

いくつかのサイトを検証したが<section>内に見出しタグが入っていることは多くみられたので問題ないかと思う。SEOには明確な答えがないので正解はないという結論。SEOのためというよりも文章構造をはっきりさせることの方に意識を注ぐべきか。

<section><div>の違いがよく分からない。

<section>は1つのテーマ(意味のある)を指定するためのもの。<div>には論理的な意味がない(単純に範囲を指定)。

今日の反省と明日に向けて。

Chromeでカリキュラム、Safariでブログを書いている。気になった点があれば逐一ブログにメモしているが、文章を書くことが受け身で生じる圧迫感を開放することに一役買っていると思う。今はまだ簡単なところだが、難しい問題に直面してからが本番。とにかくJavaの導入部分まで行きたいな。

閉じる