HTML
全29問
JavaScriptは多くのWebサイトで用いられているスクリプト言語です。WebサービスやWebアプリの開発で使われるため、HTMLやCSS、PHPなどと合わせて学習する人も多いです。でも、これからJavaScriptを学習する人の中には、難しそう、挫折しそう、と思われている方も多いと思います。まずはJavaScriptの基本知識を学習し、簡単な問題から取り組めば身に付ける事ができるスキルです。
JavaScriptは多くの開発現場で必要とされている言語ですので、企業に転職する場合も、フリーランスや副業として活躍をしたい場合も、学習しておく方が有利です。
こちらでは、JavaScriptの特徴やできる事などの基本知識に加えて、無料問題集もありますので入門編から取り組んでいきましょう。
JavaScriptはWebサイトに動きをつける事ができるプログラミング言語です。皆さんが日頃から見ているWebページにもJavaScriptは多く使われており非常に需要も高い言語でもあります。
実際にどの様な場面でJavaScriptが使わているのか見ていきましょう。
JavaScriptの最大の特徴はブラウザで動きをつける事ができるプログラミング言語である、ということです。例えば、よく見るものとして、画像スライダーがあります。販売実績などの画像付きの情報をスライドしているWebページを見たことがある方も多いと思いますが、画像スライダーにはJavaScriptが使われています。JavaScriptでできる事の詳細は、このページでも解説していますので目を通してみて下さい。
また、JavaScriptはアップデートが頻繁に行われるので学習を継続する必要があります。
JavaScriptはHTMLやCSSと同様にブラウザとテキストエディタがあれば開発する事ができます。これからプログラミングを始める方は、ブラウザやテキストエディタといっても分からないかもしれませんが、インターネットに繋がったパソコンがあればツールはダウンロードができますので開発ができます。
こちらでは、ブラウザとテキストエディタについて解説していきます。
ブラウザとはインターネットでWebサイトなどを閲覧するために使われるソフトの事を言います。パソコンやスマートフォンにはEdgeやSafariが最初から入っていたり、Google Cromeも多くの方に使われているブラウザですね。ブラウザごとにブックマークや拡張機能などが異なりますので、使いやすいブラウザを選びましょう。
忍者CODEでオススメしているのはGoogle Cromeです。まだダウンロードしていない方は下記のリンクよりダウンロードをしましょう。
テキストエディタとは、「文字情報を入力したり編集したり保存したりするソフトウェア」の事で、JavaScript等を開発する際にオススメなエディタは、Windowsの場合は、Visual Studio Code(VSCODE)や、Notepad++、秀丸エディタなどがあり、Macの場合は、Brackets、Sublime Text、Atomなど複数の種類があります。
忍者CODEでオススメしているのは、Visual Studio Code(VSCODE)です。まだインストール、ダウンロードしていない方は下記のリンクよりダウンロードをしましょう。
JavaScriptはWebページに動きをつける事ができます。例えば、画像をスライドしたり、アニメーションをつけたりすることができます。
こちらでは、多くのWebページでJavaScriptが用いられていることについて解説します。
Webページで画像が自動的に切り替わっていくスライドショーを見たことがある方も多いと思いますが、JavaScriptを使うことによって実現する事ができます。販売店などの実績紹介や、お客様インタビュー等で見ることが多いですね。
Webページに表示されているテキストや画像を、JavaScriptを使用することで表示・非表示の切り替えをする事ができます。
最近でよく使われているのは、コラムやマガジンページの目次機能。「目次を表示する」と「目次を表示しない」の2つが書かれていて、表示するをクリックすると目次一覧が表示され、表示しないをクリックすると目次が非表示になる、といったものもJavaScriptで実装する事ができます。これらはWebページを閲覧するユーザーにとって記事を読みやすくすることができるので多くのページで使用されています。
Webサイトに表示されている画像をクリックすると、拡大された画像が表示されるのを見たことがある方は多いのではないでしょうか。これらはJavaScriptで実装する事ができます。
また、JavaScriptはポップアップ表示や、その内容変更なども実装することができます。
JavaScriptでは、Webページ上に設置されているフォームにて入力された内容を取得する事ができます。資料請求や見積もり依頼などお問合せフォームからの入力内容をチェックしエラーがあればエラーメッセージを表示させることなども可能です。
実際にJavaScriptのコードを書いて動かすことで、どの様に実行されるのか初心者でも理解をしやすいです。まずは動きのあるWebページを作ってみましょう。簡単なポップアップを表示するなど初心者でも比較的分かりやすいものから取り組んでいくことがおすすめです。JavaScriptはWebサービスやWebアプリの開発など、幅広い開発現場で使用される言語ですので、HTML,CSS,PHPと一緒に学習し、ポートフォリオを作れることを最初の目標にしましょう。
こちらでは、JavaScriptの入門編として、まずは問題を解いていきましょう。
1
ウィンドウの横幅を変数に入れよう
2
変数で計算をしてalert表示しよう
3
変数の中の文字列を置き換えよう
4
クラス名を取得しよう
5
2秒後にアラートを出そう
6
配列から値を取得しよう
7
タグの数を取得しよう
8
クラスを追加しよう
9
クラスを削除しよう
10
クラスのつけ剥がしをしよう
11
要素頭に子要素を追加しよう
12
要素末に子要素を追加しよう
13
特定の要素の後ろ隣に要素を追加しよう
14
jsで文字を表示させよう
15
jsで文字を消そう
16
要素をフェードインさせよう
17
fadeoutを使ってゆっくり要素を消そう
18
jqueryでalert()を使ってみよう
こちらではWebページに動きをつけたり、アニメーションを実装するためのJavaScriptについて解説をしました。JavaScriptはプログラミング言語でありながら、PHPやJavaなどと比較すると初学者でも分かりやすい内容で、且つブラウザとテキストエディタがあれば開発することができます。手軽に始める事ができることもあって非常に人気の高い言語です。
また、求人募集や業務委託などによる案件獲得においてもJavaScriptのスキルがあると有利です。活躍の場を広げる事ができるので、まずは入門編から一つひとつ学習していきましょう。