プログラミング

2020年2月16日

  1. HOME >

プログラミング

 

Webプログラミングで夢を形に

プログラミングは、自分のイメージやアイデアを実現できるツールとして最適だと思います。

頭の中で想像したことが、実際の画面に表示されると次のアイデアがわいてきます。

高校生の時オシロスコープにマシン語で校章を描いたことを懐かしく思いつつ

パナファコムのワンボードマイコンキット。7セグメントしか表示できないマシンですが
ピンポンゲームに感動して、16進数を打ち込んで楽しんできた世代です。

自由な時間ができたので、プログラムをいちから再確認しようと始めてみれば??

現在はいろんな言語があることに圧倒され、半年くらいプログラミング学習で有名な
ドットインストールの教材を見まくって選んだのがWebプログラムです。

このWebプログラムの魅力は、覚えた内容がすぐに実践できること。

このブログを表示している言語そのものなので、いろいろな表現がすぐに試して
確認できます。

試しに我が町、瀬戸市の紹介ページをHTMLで書いてみると。

瀬戸市の南公園

イメージですが、数行でページが完成します。

プログラムはエックスサーバーに置いて、ファイル転送ソフトは
Cyberduckを使用しています。
WordPressのテーマはWINGのAFFINGER5を選択しました。

AFFINGER5 すごくたくさんの機能があるテーマなので
ショートコードを覚えるため以下のページでテスト中です。

AFFINGER5

手始めにはやっぱりHTMLの記述からですが。
パソコンの画面に直線を初めて引けたときの感動を忘れない世代にはすべてが別世界のようです。

画面に文字を表示するって、今は当たり前のようにできちゃいます。
たとえば。

こんにちは! ってメモ帳とかに打ち込み、名前を練習.html で保存すれば。
そのファイルをクリックするだけで、googleブラウザで
見事に こんにちは! が表示できてしまいます。
自分はこれでやる気がわいてきました!

 

基本的なタグを使った表示です。

 

実行したコード

  <h1>Heading One 見出し1</h1>

<h2>Heading Two 見出し2</h2>

<h3>Heading Three 見出し3</h3>

<h4>Heading Four 見出し4</h4>

<h5>Heading Five 見出し5</h5>

<h6>Heading six 見出し6</h6>

 

 
 <p> pragraphは段落という意味、この中に記事を書き込めば良い<br>

    適当な文字数で改行の&lt;br&gt;を入れて改行すると見やすい。<br>

     今日の出来事や、思った事。なんでも良いので書き留めることが重要<br>

    記憶は書き留めることによって、<strong>目からも吸収する</strong>ことができる<br>

     例えば新型肺炎に対して、学校を<em>3</em>月2日から春休みまで休校にする<br>

    びっくりする内容ではあるが、<em>本当に実行される</em>、まるで映画のようだ。

  </p>

  <p>アンオーダーリスト</p>

  <ul>

    <li>List Item 1</li>

    <li>List Item 2</li>

    <li>List Item 3</li>

    <li>List Item 4</li>

  </ul>

  <p>オーダーリスト</p>

  <ol>

    <li>List Item 1</li>

    <li>List Item 2</li>

    <li>List Item 3</li>

    <li>List Item 4</li>

  </ol>
 <table>

    <thead>

      <tr>

        <th>Name</th>

        <th>Email</th>

        <th>Age</th>

      </tr>

    </thead>

    <tbody>

      <tr>

        <td>yasubay</td>

        <td>mail@kokoroyasuku.com</td>

        <td>18</td>

      </tr>

      <tr>

        <td>makoro</td>

        <td>mail.makoro@kokoroyasuku.com</td>

        <td>8</td>

      </tr>

      <tr>

        <td>nanai</td>

        <td>mail.nanai@kokoroyasuku.com</td>

        <td>6</td>

      </tr>

    </tbody>

  </table>

少し興味が出てきたのでHTMLの基礎から学んでみようと思います。

上の構成が一般的なサイトの配置みたいなので、HTMLタグを
使って書いていこうと思います。

教材はドットインストールとYouTubeの海外サイトです。

ブログ

 

 

2020年2月16日

© 2021 くつろぎブログ