私、学習Webアプリケーション:プロローグ

9559 ワード

私はジュニアソフトウェア開発者、特にWebアプリケーションを開発していますが、ほぼ7ヶ月間、私はまだ関連する概念の過多に欠けて感じている.正直に言うと、PHPアプリケーション開発者は、Webレンダリング、Webネットワーキング、データベース管理、Web API、Webセキュリティなどの良い理解が必要です.私は、まだ深く彼らのうちのどれもマスターしなかったことを認めなければなりません;私は文字通りいわゆるすべての取引のジャック、誰のマスター、悲しいです.

"I'm bad, and that's good. I will never be good, and that's not bad. There's no one I'd rather be than me." — Ralph Wreck-it-Ralph


私は悪い、それは良い.私が何かで吸うことを知っていることは、確かに良いか悪いどちらでもありえます.良いものになるために自分自身を変更したいと思っている人に良い.希望がなく、痛みを感じる人々のために悪い.
私は決して良くない、それは悪くない.誰もが、どんなに、彼は常に多くを学ぶ必要があると思うなら、それはむしろ良い考えです.さもなければ、彼は自信がなくて、この世界が実際にどのように働くかについて、わかりません.
それが今回の開幕の仕方.私はいつもBaloneyと私の書き込みを開始するが、それは私の趣味が含まれてごめんなさい.とにかく、始めましょう.

ハローワールドアプリ


Webアプリケーション、またはWebAppを短く書くには、以下のように簡単です.
  • テキストエディタを開きます
  • 何かを書く
  • ファイルを保存するand
  • ブラウザで開きます.
  • 私がちょうど最初の日にコードを書く方法を学んだとき、それはそれから私でした.しかし、私は今それがウェブアプリケーションではなく、いくつかの並べ替えのウェブサイトであることを実現している.Someone has told me ウェブサイトが有益である間、そのウェブアプリは双方向です.
    数日後、私はそれが代わりにウェブページでなければならないのを見ましたa collection of webpages . それから、それが実際にちょうどドキュメントであるかどうか疑問に思い始めました、しかし、とにかく、両方ともブラウザーで正しく表示されることができます?
    私の教授はかつて、すべてが前に説明する価値があるとは言わなかった.そういうわけで、私たちの小学校の先生は、彼女が彼女の生徒全員が2つの子供たちの間で10キャンディーを共有することを意味することを理解するのを確実にすることができるまで、2によって分けられる10について決して話さなかった理由です.したがって、私はそれまでの期間に固執することができて、他に何も心配しないことができたと信じています.
    だから、続けてみましょう.代わりに保存hello-world.txt または、それを保存しましょうhello-world.html . 両方のファイルが異なって表示されることに気付きます.
    私たちがノートのカバーに私たちの完全な名前を入れなければならなかったので、先生は誤って誰か他の人の宿題を与えないでしょう.または悪いも私たち間違ったマークを与える、8ではない10!私たちはみな特別です.同様にan html file 一意に扱われるに値する.ブラウザは他のドキュメントとは異なる内容を表示する必要があります.
    次に書く代わりに
    Hello, Naru is here! Nice to meet you!
    
    前述のように、以下のコードをコピーペーストし、保存し、再読み込みします.
    <title>Naru's Blog</title>
    Hello, Naru is here! Nice to meet you!
    
    変更はありますか.はい、ブラウザのタブにあるもの.現在、ドキュメントに意味のある名前があります.それはnaruのブログです.そのようにすれば、友人のブログから私たちを見分けることができます.
    見た後、我々はすべてのことを伝えることができますtitle タグは私たちのドキュメントの名前です.ドキュメント名を定義する唯一の方法です.それがルールです.私たちは本当に私たちのWebAppは様々なブラウザで正しく表示できるように、大会を考え出す必要があります.我々は、別のブラウザのためのルールの別のセットを使用して、いくつかの回を書いて喜んではありませんか?
    我々が完全な規則に従うならば、我々は我々の現在のコードが代わりに以下の通りに書かれなければならないということを知っています.
    <!DOCTYPE html>
    <html>
        <head>
            <title>Naru's Blog</title>
        </head>
        <body>
            <p>Hello, Naru is here! Nice to meet you!</p>
        </body>
    </html>
    
    彼らは同じに見えるが、それはブラウザに多くの情報を与える.一般に、より多くの情報はよりよいです.人、人間、コンピュータ、あるいは2台のコンピュータの間の関係は、適切なコミュニケーションなしで決して決して決してならないでしょうか?すごい!

    タイトルタグ


    文書title 単に名前ではなく、ページの内容、またはその目的を記述する名前です.私はNARU、ジュニアプログラマーです.NARUは私の名前です.ジュニアプログラマーは私のタイトルです.彼らがウェブサイトを必要とするときはいつでも、彼らは私とチャットをしたいです.
    これは東野敬吾の著書「ナミヤ総合商店の奇跡」です.これはNARUのブログです.私はタイトルとして“NARUと初めて会う”に変更することにしました.それは私が読者に何を話すつもりなのかを説明することです.
    もし人々がグーグルに「私のFedoraがどのようになっているか」としたならば、彼らは私にそこに記載されている記事を見つけるかもしれません.だから、Atitle 人々の利益を得ることができますが、私たちの記事を検索結果に表示することもできます.
    我々が少し注意を払うならば、それは「Fedoraが私のものであった方法―Devコミュニティ」と書かれます.私たちがそれをクリックするならば、我々は「Fedoraが私のものを持っている方法」と表題をつけられる記事を見ます.二つのこと
  • エーtitle 記事の見出しと強い相関がありますand
  • エーtitle 多くの場合、ブランディングと来る.
  • 私は、Myriadウェブサイトが彼らのブランドをタイトルの隣に置いたと思います、そして、それは素晴らしいです.私も自分自身をお勧めしますので、今では最初の“NARU - NARUのブログ”を満たす
    <!DOCTYPE html>
    <html>
        <head>
            <title>First Meet Up With Naru - Naru's Blog</title>
        </head>
        <body>
            <h1>First Meet Up With Naru</h1>
            <p>Hello, Naru is here! Nice to meet you!</p>
        </body>
    </html>
    

    ヘッドタグ


    通常、そのアドレスと一緒に受信者の名前で構成されるレターヘッドを考え、時には企業のロゴを使用します.しかし、我々は我々の記事が広い観衆によって読まれて欲しいので、読者から少しの特定の情報もないつもりです.しかし、ロゴのために、なぜ?それは私たちのWebアプリの成功ブランディングを開発することができます.我々のWebAppは、今のところ、自分自身について伝えるためのものですので、我々は良い紙のような紙を追加することです.WebAppのロゴを挿入する方法はたくさんありますが、こうしましょう.
    <!DOCTYPE html>
    <html>
        <head>
            <title>First Meet Up With Naru - Naru's Blog</title>
            <link href="data:image/x-icon;base64,AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAA6OjoAPr6+gD8/PwA9fX1AIKCggD39/cA8PDwAJaWlgDy8vIA6+vrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMzIiIiIgACIiIiIiIgAAZohoiIhmAAREREREREAABEVVRUVUQAAERERERERAAARFVFVVREAABEREREREQAAJlZVZWVmQAAmZmZmZmZAAB3V1dVdXcAAKqqqqqqqgAAqlVVWlWqAAAREREREREAAAAAAAAAAAD//wAA8AAAAOABAADgAQAAwAMAAMADAADAAwAAwAMAAMADAADAAwAAwAMAAMADAADAAwAAwAMAAMADAAD//wAA" rel="icon" type="image/x-icon" />
        </head>
        <body>
            <h1>First Meet Up With Naru</h1>
            <p>Hello, Naru is here! Nice to meet you!</p>
        </body>
    </html>
    
    それはタイトルの近くにタブに表示されます.
    私たちは何かを疑問に思うかもしれない?二人ともtitle and link タグはブラウザの本体に表示されます.なぜなら、体はbody . Aに入るすべてhead 主に人間の読書のためにではなく、処理するマシンの情報を保持します.
    エーhead すべてはハウツーです
  • どのようにページを認識することができます(検索エンジン)?
  • どのようにコンテンツが表示されますか?
  • 一方body すべてはwhatsです
  • 何がユニークなページですか?
  • どのようなコンテンツが表示されますか?
  • そのために、中にタグを追加しましょうhead タグ
    <!DOCTYPE html>
    <html>
        <head>
            <title>First Meet Up With Naru - Naru's Blog</title>
            <link href="data:image/x-icon;base64,AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAA6OjoAPr6+gD8/PwA9fX1AIKCggD39/cA8PDwAJaWlgDy8vIA6+vrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMzIiIiIgACIiIiIiIgAAZohoiIhmAAREREREREAABEVVRUVUQAAERERERERAAARFVFVVREAABEREREREQAAJlZVZWVmQAAmZmZmZmZAAB3V1dVdXcAAKqqqqqqqgAAqlVVWlWqAAAREREREREAAAAAAAAAAAD//wAA8AAAAOABAADgAQAAwAMAAMADAADAAwAAwAMAAMADAADAAwAAwAMAAMADAADAAwAAwAMAAMADAAD//wAA" rel="icon" type="image/x-icon" />
            <meta name="description" content="A description of Naru">
            <meta name="keywords" content="naru, biodata, blog">
            <meta name="author" content="Naru">
        </head>
        <body>
            <h1>First Meet Up With Naru</h1>
            <p>Hello, Naru is here! Nice to meet you!</p>
        </body>
    </html>
    
    実際には、そこにメタデータを入れることができました.

    bodyタグ


    前述のようにbody タグは、我々は物語を伝えるにはほとんどすべての努力を置く場所です.我々は、次のエピソードでそれに飛び込みます.

    HTMLタグ


    html タグは、期待できるように、多くのタグからなるHTMLドキュメントのルートです.それは文書のマージンのようです.
    Phew、それはかなり長い読む、後であなたを参照してください.

    参考文献

  • https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title
  • https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head