》サイトTopプログラム言語スクール >このページ

JavaScript-jQuery講座

React-Next.jsスクールの講座案内

[使用OS:Windows、Linux]

オモドックReact-Next.js-Javaスクールは、JavaScriptのバックエンド開発者とフロントエンド開発者を目指す人、および汎用言語Javaプログラマーを目指す人のための就職対策スクールです。
【特にReactとNext.jsが大人気】
特にReactフロントエンド開発、Next.jsフルスタック開発の人気が高まっています。新規で作られるWebアプリはPHPよりも案件数が多いです。すでにIT-Web開発の現場で活躍している方のステップアップにもご利用ください。
【アットホームな小規模教室+リモート受講】
オモドック・スクールは小規模教室のため先生と生徒との距離が近く、きめの細かいサポートを通して、ひとりひとりの理解度に見合った指導を徹底して行っております。
首都圏以外の方はリモート受講も可能ですので、ぜひご利用ください。
【目女】
1.Reactのみを学びたい方向け:初心者向けMERN-React25回講座
2.ReactとNext.jsを学びたい方向け:MERN-React-Next.js35回講座
3.jQueryのみを学びたい方向け:経験者向けjQuery10回講座

《対象:言語若葉初心者、HTML+CSS経験者向け》

初心者向けMERN-React25回講座(1回2時間、計50時間)

受講費用
通学制:178,000円(税込)、リモート受講:32,000円x5ヶ月分(月-金受講
受講期間
標準:週2回で3ヶ月(最短:週8回で3週間、最長:週1回で6ヶ月)
受講対象
Reactのみを学びたい人。14歳以上の中高生からシニアまで。
目指す職種
リッチUI開発Webアプリ開発Webプログラマ
講座の内容
手続型7回+JS基礎3回、Ajax5回、MERN-React10回
作品1
飾り1講座の概要
1.初心者向け予習セクション10回
最初の「1.初心者向け予習セクション10回」では予習言語のPerlを通して手続型言語の予習を7回行ってからオブジェクト指向型言語のJavaScript基礎を3回学びます。このセクションを通して「手続型とオブジェクト指向型の両言語の基礎」を学び、「アプリケーション・応用プログラム制作の基礎」を学びます。

2.Ajax・fetchセクション5回
次の「2.Ajax・fetchセクション5回」では、サーバーとの「非同期通信」を行う「Ajax・fetchの基礎」を学びます。続けて「Ajax・fetchの応用」編としてライブラリを使わない生JavaScriptによる「JSON簡易名簿」と「JSON掲示板」を制作しながら、「fetch()関数とDOMオブジェクトの基礎」を学びます。

3.MERNスタック-Reactセクション10回
最後の「3.MERNスタック-Reactセクション10回」ではMySQLの代わりになる「M(MongoDB)」NoSQL、PHPの代わりになる「E(Expressサーバー)」、「R(Reactフロントエンド)」、「Node.js」の頭文字からなる「MERNスタック」を順番に学びます。最終的には「JWT(JSON Web Torken)」による認証機能付き「React簡易名簿」と「React掲示板」を制作します。さらに作成したプロジェクトをGoogle CloudのFirebase仮想アプリ環境に「デプロイ」し、インターネット上での動作確認を行います。

飾り1「1.初心者向け予習セクション」で制作するもの
Perlによる簡易名簿JavaScriptによる各種ウインドウ操作本日の日付表示時間帯別テキスト表示オンマウスメニュー同期

飾り1「2.Ajaxとセクション」で制作する応用アプリ
JSON簡易名簿アプリJSON掲示板

飾り1「3.MERNスタック-Reactセクション」で制作する応用アプリ
*「ID:watashi、パスワード:wwwwww」でログインするとサンプルが見れます。
JWT認証機能付きReact簡易名簿
《対象:言語若葉初心者、HTML+CSS経験者向け》

MERN-React-Next.js35回講座(1回2時間、計70時間)

受講費用
通学制:238,000円(税込)
受講期間
標準:週2回で4ヶ月(最短:週8回で1ヶ月、最長:週1回で9ヶ月)
受講対象
ReactとNext.jsを学びたい人。14歳以上の中高生からシニアまで。
目指す職種
リッチUI開発Webアプリ開発Webプログラマ
講座の内容
手続型7回+JS基礎3回、Ajax5回、MERN-React10回
作品1
飾り1講座の概要
1.初心者向け予習セクション10回
上記「初心者向けMERN-React25回講座」と同じ。

2.Ajax・fetchセクション5回
上記「初心者向けMERN-React25回講座」と同じ。

3.MERNスタック-Reactセクション10回
上記「初心者向けMERN-React25回講座」と同じ。

4.Next.jsの基礎練習4回
Next.jsの基礎練習ではReact講座で作成した「React簡易名簿」をReactと共通の「Page Router」版に修正し、さらにNext.jsオリジナルの「App Router」版に修正していきます。このときSEO対策に強いと言われる
アクセス時にHTML化する「SSR」や、ビルド時にHTML化する「SSG」、定期的にHTML化する「ISR」
についても学び、最終的にExpressサーバー機能を「API Routes」に移行し、「Server Action」との連携によるフルスタックアプリの「NestJs簡易名簿」と「NextJs画像掲示板」を制作します。

5.書籍ECサイト制作セクション6回
Next.jsのリファレンス練習でよく登場する「ToDoアプリ」を1個作れるようになっても、いきなり大規模サイトは作れません。そこで複数アプリから成立するECサイト全体を作ることで、大規模サイト開発への足がかりとします。最終的に「買い物カゴ付き書籍ショッピングサイト」「Stripeカード決済機能付き書籍オーダーフォーム」「商品登録管理サイト」「発送日登録機能付き注文データ一覧サイト」の全機能を作成し、「MongoDB Atlas」と「Vercel」を使ってインターネット上に「デプロイ」し、動作確認を行います。


飾り1「1.初心者向け予習セクション」で制作するもの
Perlによる簡易名簿JavaScriptによる各種ウインドウ操作本日の日付表示時間帯別テキスト表示オンマウスメニュー同期

飾り1「2.Ajaxとセクション」で制作する応用アプリ
JSON簡易名簿アプリJSON掲示板

飾り1「3.MERNスタック-Reactセクション」で制作する応用アプリ
*「ID:watashi、パスワード:wwwwww」でログインするとサンプルが見れます。
ユーザー認証機能付きReact簡易名簿

飾り1「4.Next.jsの基礎練習1」で作成する応用アプリ
ユーザー認証機能付きNextJs簡易名簿、NextJs掲示板、NextJs画像掲示板
*見た目は上記「JSON簡易名簿」「JSON掲示板」と同じ

飾り1「5.書籍ECサイト制作セクション」で作成する応用アプリ
*「ID:watashi、パスワード:wwwwww」でログインするとサンプルが見れます。
買い物カゴ付き書籍ショッピングサイトカート決済機能付きオーダーフォームロール権限者向け商品管理サイト
《対象:JavaScript経験者向け》

経験者向けjQuery10回講座(1回2時間、計50時間)

受講費用
通学制:82,000円(税込)、リモート受講:32,000円x2ヶ月分(月-金受講
受講期間
標準:週2回で1ヶ月(最短:週8回で1週間強、最長:週1回で2ヶ月強)
受講対象
14歳以上の中高生からシニアまで。書籍やYoutubeを見ても分からない人。
目指す職種
リッチUI開発Webアプリ開発Webプログラマ
講座の内容
jQuery10回(詳細内容制作する物
作品1
飾り1講座の概要
ブラウザJavaScriptの経験者向けの講座です。
「jQuery講座」では最初にJavaScriptとの違いと「jQueryの基礎」を学び、「jQueryを使ったAjax」を学んでから、Webサイトに高付加価値を与える「リッチなインターフェース制作」を学びます

飾り1「jQuery講座」で制作するもの
アコーディオンメニュータブメニュープルダウンメニューモーダルウインドウ画像版モーダルウインドウAjax版スライドショー

JavaScriptとは何か…

JavaScriptはインターネットの初期のころから存在するWebデザインにとって最も重要なプログラミング言語の1つです。
主な役割はhtmlによる静的なHomePageに動的な要素、動きを与えることです。定番のものでは画像にマウスを乗せると「色が変わる」とか「へこむ」といったオンマウスが有名です。
初期のころはブラウザ内を動かすことしかできませんでしたが、Ajax機能の追加によりインターネットサーバとの非同期通信が可能となり、より発展した動きを演出したり高機能を持たせることが可能になりました。

Ajaxとは何か…

AjaxはAsynchronous(非同期通信)、JavaScript、XMLの3つの単語の頭文字を組み合わせた造語です。
つまりプログラミング言語名ではなくプログラムの機能名だといえます。あくまでも使用する言語はJavaScriptになります。
ただしこれまでのJavaScriptはサーバとの通信機能を持っておらず、ブラウザ内でhtmlを補佐する役割しかありませんでした。
しかし新たに登場したAjaxは、ユーザーが気づかないほどのすばやいスピードでサーバとの通信を行う「非同期通信」が特徴です。
これまでの「同期通信」は、「送信」ボタンを押した後に必ず「待つ」という時間帯が必要でしたが、「非同期通信」は一切「待たない」通信です。
そのため次世代Webの「Web2.0」の中心技術といわれています。

代表的なAjaxとは…

  • Googleマップ_API
  • Ajaxには「画像のAjax」と「テキストのAjax」があり、「画像のAjax」の代表が「Googleマップ」です。HP内の好きな場所に「Googleマップ」を表示できます。
  • サジェスト機能
  • 「テキストのAjax」の代表は「Googleサジェスト」でおなじみの入力補完機能です。メニュー部分はselectタグではなく、CSSスタイルシートとDOMオブジェクトを使って作成します。
  • インクリメント検索
  • 「テキストのAjax」のもうひとつの代表は「インクリメンタル検索」です。これは送信ボタンを押さなくても文字入力を感知して逐次検索を行ってくれる便利な機能です。

jQueryとは何か…

jQueryはAjaxの実装を容易にし、さらにリッチインターフェース制作に役立つ機能を提供してくれるJavaScriptライブラリです。
ライブラリとは図書館の本のようにみんなで使うことを前提にしたプログラム集のことです。
実は一般的なAjaxプログラムはかなりやっかいなプログラムのため、Webデザイナー向けというよりは完全にWebプログラマ向けです。
しかしjQueryを使えばWebデザイナーでもAjaxを簡単に扱えるようになります。
またWebデザイナーが普段から使っているHTMLやCSSを組み合わせると、リッチインターフェースが簡単に作れるようになります。
まさにこれからのWebデザイナーにぴったりのJavaScriptライブラリです。
ここで制作する主なものは下記です。
家庭教師型のマンツーマン制授業完全自由予約制短期集中の高速受講制度回数オーバー無料制就職バックップシステム卒業後の就職カウンセリングなどが特徴です。
入学金18,000円、25回講座160,000円×講座数で、25回講座を1つずつ延長しながら長いセットコースを学ぶこともできます。また月5回または月10回の月謝チケット受講も可能です。
月曜~土曜、10:00~、13:00~、15:30~、18:30~、各2h、授業開始時間直前まで予約可能な完全自由予約制です。