【2/17】今年は「濃厚」技術トーク!@ITメールセミナー スラッシュドット    はてなブックマーク  Yahoo!ブックマークに登録  印刷
 

フレッシュマン企画連載
初めてでも安心! 1日で作れるWebアプリ講座

第1回 プログラミングはこんなに楽しい!

シグマコンサルティング 設楽 亜紀子
2008/01/21

 本連載は、今春、プログラマとして会社に入る新人のための短期連載です。1〜3月の間に、全3回で公開されます。

 本連載ではプログラミングがいかに気軽で、楽しいものかをお伝えしていきます。春から新たにプログラマになる皆さん、4月から始まる仕事の前に、本連載でプログラミングの醍醐味(だいごみ)をぜひ体験してみてください! 企業の新人教育の担当者の方は、入社前の学生さんたちに、本連載を読んでプログラミングを一度体験してみることを宿題として出してみてはいかがでしょうか?

 また本連載では、プログラミングは未経験か、ほぼ初心者であることを想定しています。誰にでもすぐにできるWebアプリ開発の実践を通して、プログラミング用の道具である「Visual Studio 2008」(以下、VS 2008)の基本的な使い方を覚えることができます(なお「Webアプリ」とは「Webアプリケーション」の略です)。本連載で使うVS 2008 Express Editionsは無料でインターネットから誰でもダウンロードできます。

 さて、さっそくですが第1回で作成するWebアプリはこちらです。

今回作成するWebアプリ

 [押して]というボタンがあります。このボタンを押すと何が起こるのでしょうか?!

 このWebアプリはこちらから実際に利用することができます。ぜひ遊んでみてください。

 試してもらえれば分かるように、[名前を入れて]と書かれた入力欄に名前を入れて、ボタンを押すと、吹き出しにコメントが表示されます。コメント内容は押すたびに変わります。

 今回作るのはこんなWebアプリですが、これをベースに応用していき、最終回(第3回)では近くの飲食店を検索するWebアプリを簡単に作成してしまいます! そのサンプルWebアプリはこちらのようになる予定です。

 それでは、皆さんの初めてのプログラミングが楽しいものになりますように!

 状況説明

システム開発会社に就職したシグマクン。実はプログラミングなどしたこともありません。ところが、大先輩のネモトサンからいきなりWebアプリ開発の課題を与えられたようです。教育担当になった先輩シタラサンの助けを借りて、無事に課題を成し遂げられるのでしょうか……。


 登場人物

新人:シグマクン
今春から入社する新人。かなりのマイペースでのんびり屋。プログラミングの経験なし。

教育担当の先輩:シタラサン
新人シグマクンの教育担当。シグマクンと同じく、プログラミング未経験で入社し、大先輩ネモトサンに鍛えられる。プログラミング経験1年。

大先輩:ネモトサン
新人シグマクンの熱い上司。生き様はロックで不器用なため、傍若無人だと誤解されることも。でも本当は寂しがりやで後輩がかわいくて仕方ない。プログラミング経験10年。

プロローグ

 

そこの新人さんよ、うちに来たからにはWebアプリの1つや2つ作れねぇってことはないだろうねぇ。取りあえず、どんな腕前かおれが見てやるぞ。

 いま作れ。すぐ作れ。ロックなやつを頼むよ

 お題は“昼飯”だ! 楽しければ何でもいいぞい。

     
  昼飯? ロック? Webアプリって何ですか? すぐに作れなんて……(ぶるぶる)。
     
 

シグマクン、大丈夫よ。ネモトサンは新人が入ってくるといつもああなんです。わたしがバックアップしますので、安心してください。

 要件をおさらいすると、「とにかくWebアプリを作れ」ということですね。簡単にすぐできるWebアプリを一緒に作ってネモトサンをびっくりさせましょう!

 ネモトサンには内緒でWebアプリを作るための準備をこっそりしておきましたから、シグマクンにも楽しくできますよ!

1. Webアプリって何でしょう?

 

ではまず、「Webアプリ」が何か分かりますか?

     
 

Webアプリ? はい、分かりません……。ごめんなさい。

     
 

わたしたちはインターネットをInternet Explorer(IE)などのブラウザで見ています。ブラウザ内に見えるページは「Webページ」と呼ばれ、そのWebページが集まったものが「Webサイト」です。まずこれは分かりますよね?

 このWebページは、多くの場合、“HTML”という言語を使って作成されています。つまりWebページの実体は、HTML言語で書かれた文書(ドキュメント)です。その文書をブラウザが解析して、わたしたちが普段見ているようなWebページの形式で表示しているのです。

 しかし現在のインターネットでは、HTML言語だけでは表現できない動的なページ(=場合によって表示内容が変化するページ)がたくさん作られています。例えば、ブログや、掲示板、ネット・ショッピング、○○占いなど、ボタンを押すと表示が切り替わったり、買い物カゴに商品が入ったり、ログインして自分専用のページが表示されたりするようなWebページです。このような「ユーザーの操作によってWebページの表示内容を変更したり、何らかの動作を実行する仕組みを持つWebページ/Webサイト」を「Webアプリ」と呼びます。

 難しいことは分からなくても、「Webアプリ」という名前だけは何となく覚えておきましょう。

 今回は、マイクロソフトの「.NET(ドットネット)」という技術を使ってWebアプリを作成してもらいます。まずはWebアプリを作成するための道具(=開発環境)を、パソコン内に準備しましょう。

     
  はい!


 INDEX
  [フレッシュマン企画連載]初めてでも安心! 1日で作れるWebアプリ講座
  第1回 プログラミングはこんなに楽しい!
  1.Webアプリって何でしょう?
    2.開発環境の準備/プロジェクトの新規作成
    3.コントロールの配置/イベントの設計
    4.ビルド&デバッグ/代入と変数とデータ型
    5.今回のおさらい

インデックス・ページヘ  「初めてでも安心! 1日で作れるWebアプリ講座」

ホワイトペーパーTechTargetジャパン

Insider.NET フォーラム 新着記事

@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

RSSフィード

スキルアップ/キャリアアップ(JOB@IT)

- PR -
- PR -

お勧め求人情報

キャリアアップ 〜JOB@IT
@IT Special -PR-
  企業の仮想化に足りない“発想”とは?
仮想化運用管理のキモは意外なところに!

New!
  操作もマニュアルも分かりやすい!
ユーザー視点で開発されたPC管理ツール

New!
  仮想化すればコストは削減できるか?
仮想化に必要な「3つの視点」を解説する

  セキュリティを知り尽くす上野氏が登壇!
@ITメールソリューションLive! in Tokyo

  運用管理の課題を“2つの観点”から分析
ユーザー満足度の高い「仮想環境」とは?

  世界に通用するストレージの作り方とは?
製品に込めた思いを富士通の開発者に聞く

  OSSで手間も時間も、障害も減った――
「マピオンの事例」オープンソース活用法

  「ノートPCの持ち出し禁止」で大丈夫?
情報漏えいを防ぐ管理手法とインフラは?

  1日の処理を1秒に――MySQLの達人が語る
「コスト削減」できるチューニング

  ドキュメント作成を自動化して、SEの作業
効率を大幅アップ! Visio 2007の魅力

  急速に広がるHyper-Vでのサーバ仮想化
そのベストプラクティスをデルが解説

  @IT主催セミナーで語られた、「担当者に
求められるセキュリティ対策」をレポート

  @IT「Windows 7」 特設サイトオープン!
最新情報・移行ノウハウを公開しています