Web フロントエンド学習ルート: WEB フロントエンド開発のクイック入門

2017 Web フロントエンド学習ルート: WEB フロントエンド開発の簡単な入門。まず最初に、私の経験を共有したいと思います。何かをうまくやりたいなら、ある程度の努力をしなければなりません。そして、もっと学び、もっと考え、もっと練習し、もっとコミュニケーションし、もっと要約し、自分自身の問題を見つける必要があります。そして、それを克服しなければなりません。良い状況では、多くの場合、時間内に調整を行う必要があります。初心者がフロントエンドを学ぶ場合は、なぜそれを学びたいのか、自分のメンタリティが何なのかを考え、自分自身を適切に位置づけ、より多くの専門家にアドバイスを求め、自分よりも優れていない人々に教える必要があります。焦らずに素早く成長させてください。初心者の場合は、いくつかの入門ビデオチュートリアルを見て、投資を学び、現在の状況と能力を分析し、リアルタイムで調整する必要があります。そして革新する方法を知っています。ここで自分を分析し、適切な学習方法を見つける必要があります。

1. WEBフロントエンド - 誤解を学ぶ

Webページ制作は、コンピュータ専攻の学生が大学中に学ぶコースであり、Webページを学ぶために使用される最初の統合開発環境です。プロダクション (IDE) は主に Dreamweaver でなければなりません。この WYSIWYG の「爆発的な」IDE は、Web ページの作成に大きな利便性をもたらします。

すぐに始められ、すぐに結果が得られるため、私たちは気づかぬうちにウェブページ制作に夢中になってしまいました。このとき、多くの人が誤解に陥るでしょう。つまり、このような優れた IDE の助けを借りて、マウスでメニューをクリックするだけで Web ページを迅速かつ便利に作成できるのです。

それでは、なぜ HTML、CSS、JavaScript、jQuery などの難しいコードを学ぶ必要があるのでしょうか?これは、単純さよりも複雑さを追求するためではないでしょうか?

しかし、研究が深まるにつれて、徐々に、IDE に依存しすぎて、その実装の本質が分からなくなっているというジレンマに陥っていることがわかります。それはわかっていますが、その理由はわかりません。

そのため、ページのパフォーマンスに問題があると、ページを最適化してより高度なアプリケーションを完成させる方法はおろか、途方に暮れてしまいます。理由は明白です。スマート IDE は私たちの怠惰を満たし、豪華な Web ページの背後にある最も重要なコンテンツであるコードを無視させます。

無駄な努力よりも正しい方向が良いです

壁の向こう側にある食べ物を見つけるために壁の一部を乗り越えようとしている2匹のアリがいます。アリは壁の根元まで来ると躊躇なく登っていきますが、途中まで登るたびに疲労と疲労で倒れてしまいます。くじけなかったものの、何度も転んで、すぐに調子を整えて、また登り始めました。

もう一匹のアリはそれを観察し、壁の周りに回ることにしました。すぐに、アリは壁の周りを歩き回って餌を食べ始めましたが、もう一方のアリは倒れては再び歩き始めました。

多くの場合、成功には勇気と忍耐に加えて、方向性が必要です。おそらく方向性が良ければ、想像よりも早く成功が訪れるでしょう。間違った道を走ってしまうと、どんなに頑張っても無駄になってしまいます。 Web フロントエンドの学習にも同じことが当てはまります。まず、正しい学習ルートを選択する必要があります。

2. WEB フロントエンド - 学習ルート

第一段階 - HTML 学習

HyperText Mark-up Language (略して HTML) は、Web ページの骨格です。 static Web ページが動的 Web ページであっても、最終的にブラウザに返されるのは HTML コードです。ブラウザは HTML コードを解釈してレンダリングし、ユーザーに表示します。したがって、HTML の基本構造と共通のタグと属性を習得する必要があります。

HTML の学習は、暗記と理解のプロセスです。学習プロセス中に、Dreamweaver の「分割」ビューを使用して学習を支援できます。 「デザイン」ビューで効果を確認し、「コード」ビューで本質を学び、さまざまなビューの利点を最大限に活用するこの比較学習方法は、HTMLのタグと属性をただ覚えるだけの退屈さを補ってくれるはずです。初心者の皆さんへ

HTML を学んだ後、建物を建てたい場合は、これらの「原材料」を使用する必要があります。 " "私たちが設計したプランに従ってレイアウトを組み立て、いくつかの美化が行われます。

php中国語ウェブサイトおすすめコース:
マニュアル: HTML開発マニュアル
HTMLは簡単に学べます!きっとすぐに習得できると思います！ HTML の例 このチュートリアルには、何百もの HTML の例が含まれています。 このサイトのエディタを使用すると、HTML をオンラインで簡単に変更し、例の結果を表示できます。
ビデオ: HTMLをすぐに学べるビデオチュートリアル

「HTMLをすぐに学べるビデオチュートリアル」は、最も基本的な概念から始まり、ステップごとに深く掘り下げていき、誰もがHTMLを学び、その意味と内容を理解できるように導きます。よく使用されるさまざまなタグの基礎 使い方、HTML の知識を学ぶことで、将来の学習の基礎が築かれます。

第2段階 - CSSの学習

CSSは英語のCascading Style Sheetsの略称で、Webページのパフォーマンスとコンテンツを真に分離できるスタイルデザイン言語です。従来の HTML のパフォーマンスと比較して、スタイルを再利用できるため、開発速度が大幅に向上し、メンテナンス コストが削減されます。

同時に、CSSのボックスモデル、相対レイアウト、絶対レイアウトなどにより、Webページ内の各オブジェクトの位置とレイアウトをピクセルレベルで正確に制御できます。この学習段階を通じて、私たちは「建物」の建設を無事に完了することができます。

「建物」の建設が完了したら、ユーザーに引き渡して使用することができますが、ユーザーにより良い体験をしてもらいたい場合は、「建物」をさらに「装飾」して見栄えを良くすることもできますもっと「贅沢」に「ある。」

php中国語サイトおすすめ講座:

マニュアル: CSSオンラインマニュアル

『CSSオンラインマニュアル』 CSSを活用することで、Web開発の効率を大幅に向上させることができます！この CSS オンライン マニュアルには、何百もの CSS オンライン サンプルが含まれています。このサイトのオンライン エディターを使用して、CSS をオンラインで編集し、変更された効果をオンラインで表示できます。

ビデオ: CSSをすぐに学べるビデオチュートリアル

「CSSをすぐに学べるビデオチュートリアル」 CSSメソッドの使用法、CSSセレクターの違い、CSSの一般的な使用方法を学びます。そしてHTML。

第 3 段階 - JavaScript の学習

JavaScript は、クライアント側で広く使用されているスクリプト言語であり、いくつかの組み込み関数、オブジェクト、および DOM 操作を提供し、これらを使用して一部のクライアントを実装できます。 -サイドの特殊効果、検証、インタラクションなどにより、ページの見た目が鈍くなります。 Diaosi は即座に Gao Fushuai に反撃します。嬉しい驚きでしたが、プロジェクトマネージャーが突然あなたに怒鳴りました

「このエフェクトは××ブラウザでは互換性がありません。もう一度試してください...」

「即時石化何かありますか？」間違っていますか?

「ああ、これはパクリです! 完成させるまでに何百行ものコードを書くのに一晩かかったので、血を吐きました

」セックスは時々頭痛を引き起こすこともありますが、幸いなことに、それをカプセル化するのを助けてくれる「偉大な神」がいます。

php中国語ウェブサイトおすすめ講座:

マニュアル:

JavaScriptリファレンスマニュアル

「JavaScriptリファレンスマニュアル」は、勉強や仕事をしていると、JavaScriptの問題に遭遇することになるリファレンスマニュアルです。理解できないことについては、マニュアルを参照してください。参考にして勉強してください。

ビデオ: JavaScript初級ビデオチュートリアル

「JavaScript初級ビデオチュートリアル」では、JavaScriptの基本的な変数、構文、条件判断、ループ文、配列、関数、オブジェクトBOMとDOMについて詳しく紹介します

第 4 ステージ - JQuery の学習

jQuery は無料のオープンソースの軽量 JavaScript ライブラリであり、さまざまなブラウザーと互換性があり (jQuery2.0 以降のバージョンは IE6/7/8 ブラウザーのサポートを放棄しています)、多くの jQuery ベースのプラグインが利用可能ですこれにより、豊かな動的効果をより便利かつ迅速に実現できるようになり、開発時間を大幅に節約し、開発速度を向上させることができます。これは、書き込みを減らし、より多くのことを実行するというその中心的な目的も完全に反映しています。とても気持ちいいです！そんな事あるでしょうか

「豪華な建物」が建ちましたが、毎日毎日毎年毎年このように建物を建てるのはとても面倒です！建物を建てるときに、単一のコンポーネントがモジュール化されて、積み上げられたブロックのように組み立てられたら素晴らしいと思いませんか? 答えは可能です。

このような考え方はWebフロントエンド開発にも適しているため、さまざまなフロントエンドフレームワークが登場していますが、ここで皆さんにお勧めするのはBootstrapです。

Bootstrap は、Twitter によって開始されたフロントエンド開発用のオープンソース ツールキットであり、CSS/HTML フレームワークであり、レスポンシブ レイアウトをサポートしています。これは開始されると非常に人気があり、GitHub で人気のオープンソース プロジェクトになりました。

プロジェクト開発プロセス中、Bootstrap が提供する CSS スタイル、コンポーネント、Java プラグインなどを使用して、ページ レイアウトとスタイル設定をすばやく完了し、目的のスタイルでスタイルを微調整できます。これにより、フレームワークに基づいて開発時間が大幅に短縮されます。巨人の肩に乗るのはかっこいいですね!

php中国語おすすめ講座:

マニュアル:jQuery中国語参考書

『jQuery中国語参考書』は初心者からjQueryを学べる高度な知識へ。マニュアルには多数の jQuery オンライン サンプルが含まれており、サンプルを直接実行して表示できます

ビデオ: jquery 基本ビデオ チュートリアル

jQuery を使用すると、コンテンツ豊富なページを簡単に作成できます。基本的なビデオチュートリアル" コースでは、アニメーション効果、スライド効果、フェードインおよびフェードアウト効果など、jQuery を使用して作成されたいくつかの効果があります。

3. WEB フロントエンド - 学習提案

最後に、Web フロントエンドの学習についていくつかの提案と方法について話させてください。

CSS をレイアウトする際に注意すべき問題は、多くの学生がページ レイアウトの全体的な分析が不足しており、マクロの観点からページ上のボックス間の入れ子関係を把握できないため、CSS をレイアウトすることに熱心であることです。そうすると、ページ内でさまざまな問題が発生し、要素間の関係が非常にわかりにくくなり、フローティング時にボックスの位置がずれやすくなります。 「トップダウンで徐々に絞り込んでいく」という考え方でレイアウトすることをおすすめします。まずいくつかのボックスを使ってページ全体を分割し、徐々にボックス内にボックスを入れ子にしていきます。

「紳士は生まれながらにして何も変わりません、そして彼は偽物が得意です。学習の過程で、より優れたウェブサイトを閲覧し、そのデザインのアイデアやレイアウト方法を分析して参考にするのが得意です。」そして、さまざまな知識を身につけて初めて、すべてを理解し、他人の長所を自分のために利用できるようになります。

同時に、Firebug をツールとして使いこなせる必要があります。一方では、Firebug は学習プロセス中に自分のページをデバッグするのに役立ちますが、他方では、Firebug を使用して他の人の Web サイトのソース コードを簡単に表示および分析することもできます
。

みんなの成長は基礎とは異なります。それはあなた自身の実際の状況に基づいて実行されます。繰り返しになりますが、フロントエンドの核となるのはjsとcssです。難しいことではありませんが、積み重ねが必要です。 これがフロントエンドの見方です:

CSS はワインのボトルのようなもので、良い製品です

html、CSS はタグとセレクター属性がすべてですが、次のことを行う必要がありますwrite a スケーリング、堅牢性、またはページの維持は簡単ではありません。ここで、ページの基本的な条件付きリフレクションを作成するときに重要なのは、それを迅速に完了する方法ではなく、インターフェースを変更する必要がある場合に、最小限のコード変更で必要なタスクを迅速に完了する方法を考えることです。これは、フロントエンドの持久力、体力、知性の三重テストです。

jsは剣のようなもの、研ぐ必要があります

jsは最初は単なる実験用でしたが、テクノロジーと社会の発展に伴い、その役割はますます重くなっています。初めて jQuery を使い始めたとき、js の知識は氷山の一角にすぎないと感じました。 js について学べば学ぶほど、変態的でかわいらしく、楽しくて制御が難しく、互換性の問題がたくさんあることがわかりますが、互換性を解決することが私たちが生き残る基本的な方法です。 ajax から jsmvc までずっと見てみると、高負荷の傾向がますます高まっています

人生は夢です、あなたはそれを実現しなければなりません

テクノロジーは人生の一部にすぎません、私は以前は野心的でしたが、今は頭を下げてコードを書いています。変えられるものは変え、変えられないものは受け入れる。命には限りがあり、兄弟は昼も夜も戦います。人生学習に対する態度は、せっかちでもせっかちでもなく、速くも遅くもなくです。耐えて自分を信じてください。世界を変えようとするのではなく、自分自身の人生を変えようと努めてください。飛躍的な歩幅を求めるのではなく、一度に一歩ずつ求めてください。苦しみのおかげで、私たちは内面的に強くなります。挫折のおかげで、私たちは成長し続けます。バグのおかげで、私たちの思考は深まります。フロントエンドのおかげで、彼は私たちに、空を支えるには 18 種類の武道が必要であることをさらに信じさせました。

私たちは IT を愛する若者のグループです。IT と HTML5 開発も大好きな方は、www.php.cn にログインしてオンラインで学び、一緒に夢を語っていきましょう。

関連する推奨事項:

1. PHP の学習を始めるにはどうすればよいですか?史上最も明確な PHP 学習ロードマップ!

2. php上級ロードマップ: PHP初心者からマスターまで必見の上級ルートコース

3. 「PHP中国語Webサイトコースビデオを見て静かにマスターになる方法」を教えます