実際のエンジニア新人研修技術課題 06_HTML + javaScript

【習得して欲しい技術】
■HTMLの基本
■javascriptの基本
■設計書を元にHTMLとjavascriptを新規開発

第二部では、Webシステム開発を行うために必要な技術を学んでいきます。

まずは、クライアントサイドであるHTML、javascriptをゼロから作っていく部分となります。HTMLで作成した画面に対して、javascriptを実装していく流れとなっています。HTMLとjavascriptの概要については、ブログにまとめてあります。

■HTML
WEBシステムエンジニアの技術ロードマップ07

■javascript
WEBシステムエンジニアの技術ロードマップ08

HTML研修では、よく使用されるタグを実際の画面にあわせて解説しているイントロダクション資料を使い進めていきます。プログラム言語とは少し違う書き方や考え方になっているため勝手は違いますが、作り慣れるのが一番理解を深められますので、画面のイメージをもとに自分で近いHTMLを作成します。単純なHTMLだとパズル感覚?ですかね。javascriptによる制御やcssによる複雑なデザインがなければ、打って暗記すると慣れるのは早いかもしれません。

HTMLで画面作成が完了したら、javascriptで動的な動きを追加します。HTMLの役割、javascriptの役割といったことを、段階的に学習できるようになっています。javascriptではブラウザを使用したデバッグ方法も学習します。どのような場面でも、デバッグはとても重要ですので、javascriptでも同様にデバッグの操作方法を説明して学習を進めます。

ブラウザには、InternetExproler、Chrome、FireFoxなどありますが、新人研修ではChromeを使用しています。開発者の好みによると思いますが、画面解析やjavascriptのデバッグがやりやすいという研修作成者の好みです。

画面はゼロから作成をしていくので、派手な画面ではありません。cssを使うとデザイン等も豪華にすることはできます。ただ、新人研修ではデザイン性より動きの部分を重視していますので、画面の豪華さについては意識をしません。現場でも難しいcssができるより、開発者はHTMLやjavascriptをできた方が、よい場合のが多いです。会社の得意分野やプロジェクトの種類にもよると思いますが、画面デザインはデザイン会社に依頼するといったこともよくあります。

HTMLとjavascriptの課題をそれぞれ抜粋しておきますので、課題を自分で考えて開発できるか、試してみてください。HTML、javascriptの役割をしっかりと覚えておきましょう。

■06_HTML + javaScript研修(HTML)課題サンプル

■06_HTML + javaScript研修(javascript)課題サンプル

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*
*

トップに戻る