ウェブサイト構築の勉強方法について

Question

プログラミングの勉強をしたいと考えています。

以下のようなウェブサイトを作ることを目標として、勉強したいなと思っています。

みんなのシネマレビュー
http://www.jtnews.jp/

最初は、ここまで大掛かりなサイトは無理だと思うのですが、まずは、このサイトを作るのに何が必要でどんな勉強が必要なのかを知りたいと思っています。

そこで、質問なのですが、技術的に必要なものとしては、(1)ＨＴＭＬ（ＣＳＳ含む）、(2)ＤＢ、(3)ＨＴＭＬとＤＢの連携のプログラミング言語という理解で良いでしょうか？
その場合、一般的にどのようなソフトウェアを利用しているのでしょうか？

また、これらの技術を学習する場合に、効率の良い学習方法、おススメのウェブサイトや書籍についても教えて頂けると助かります。

質問ばかりで申し訳ありませんが、経験者の方のアドバイスをお聞きして、方向性を定めたいと思っています。
よろしければ、アドバイスをよろしくお願いします。

too_bad · Accepted Answer

>>1です。
そういえばソフトウェアを紹介しておりませんでした。
私はFlashDevelopと言うオープンソースの
テキストエディタを使用しております。
http://flashdevelop.jp/%E3%83%A1%E3%82%A4%E3%83%B3%E3%83%9A%E3%83%BC%E3%82%B8
HTMLやFlash用の言語をはじめとする、WEBサイト作成に
用いる言語のうち9種類の言語を用いて作るのための
入力補助機能がついています。
標準で日本語化できます。
http://flashdevelop.jp/%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%81%A7%E5%88%A9%E7%94%A8%E3%81%99%E3%82%8B%E3%81%AB%E3%81%AF

aoyama984 · Answer

http://sns.prtls.jp/about_people_1.html
http://sns.fc2.com/ja/public/content/function/
無料の　SNS　を利用しても同じようなことはできます
会員制の　レビューサイト　というものはできます
http://www.openpne.jp/ss/
OpenPNE　を利用しても　コミュニティサイトは作れます

http://www.yumemaboroshi.net/cate42/
また　レビューのCGIやPHPをレンタルすることもできます

自分でイチから作るのも一つですが
希望のもの　似たサービスが無いか探してみる
あるものは利用して　組み合わせて　サイトを作る
という方法もあります

勉強が目的でしょうか
サイトを作るのが目的でしょうか
サイトなら　なるべく短期間で少ない作業で作る方法も考えてみてください

corokorocoro · Answer

PHP,Perl,Ruby,ASP.NET(VB,C#),JSP(Java)
好きな言語で開発すればいい。

>上記で抜けてるのがＰＨＰなどの構築用の言語かな？　最近はＰＨＰなどを使わずにフレーム・ワークとしてSymfonyなどもあるので、その辺もフォローすると良いと思います。
SymfonyはPHPのフレームワーク。だからSymfonyを使うって事はPHPを使っていることになる。

gtx456gtx · Answer

>そこで、質問なのですが、技術的に必要なものとしては、
>(1)ＨＴＭＬ（ＣＳＳ含む）、(2)ＤＢ、(3)ＨＴＭＬとＤＢの連携のプログラミング言語という理解で良いでしょうか？
進歩の早い分野なので常に新技術を逃さずにということが重要と思いますが、上記で抜けてるのがＰＨＰなどの構築用の言語かな？　最近はＰＨＰなどを使わずにフレーム・ワークとしてSymfonyなどもあるので、その辺もフォローすると良いと思います。

too_bad · Answer

HTML言語の勉強は必須です。

CSSも必須です。
Javascriptも組めないまでも既製品を使うことはできる程度に
勉強なされると良いと思います。
CGIについては、ログインを必要とされなければ、
上記のサイトの例で行くと取り立てて必要ない気がします。
http://www.htmq.com/
まずは上記WEBサイト等で勉強し、実際にWEBサイトを自力で
作ってみることからはじめてはいかがでしょうか？
参考資料はWEBサイトだけでいけると思います。
書籍は書籍で問題もあり、今後HTML5と言う新しいスタイルが
勧告される見通しです。
今から覚えるのであれば、HTML4.01よりかもHTML5を覚えられたほうが
良いかと思います。
HTML関連としてもう一つ言えば、FLASHを勉強することにより、
より動的なWEBサイト構築が可能となります。
ただFLASHについては必須ではありません。
FLASHを使わなくてもJavascriptでどうにかなってしまう場面も多いです。
まずは、他人の作ったサイトを参考に、なぜこのような記述をしているのか？
などと独学で勉強されてみてはいかがでしょうか？
以下に基礎を記述します。

<html>
<body>
Hello World!
</body>
</html>

上記の5行をメモ帳に貼り付け、名前を保存するときに
index.htmlとして、文字コードをUTF-8で保存してみてください。
インターネットのようなアイコンに変われば成功です。
index.htmlを開くと、5行ではなく1行として表示されていると思います。
ここでそれぞれの内容について説明します。
<html>これは、ここからHTML文書ですよと言う案内です。
おまじないみたいなものと思ってください。
<body>これはボディ、つまりここから本文ですよと言う意味です。
</body>これは、<body>の部分に/が付いています。
本文はここで終了ですよと言う意味です。
</html>これは、同じくHTML文書はここで終了ですよと言う意味です。
そして、<body>と</body>の間にある文書が、本文として表示されます。
気付いたと思いますが、サンドイッチ状態になっているのは
おわかりいただけましたか？
この5行の分はソースと言うのですが、ソースを記述する際には、
基本的には必ずサンドイッチ状態にさせなければなりません。
そして<>で区切ってある語句をタグと言いますが、
このタグは開始タグはすべて必須になっており、
終了タグはタグによっては不要なものもあります。
開始タグとは<html>や<body>というようなここから○○ですと言うのを表すもので、
終了タグとは</body>や</html>のようなここまで○○ですと言うのを表すものです。
では、少し行数を増やしてみましょう。

<html>
<head>
<title>
テスト
</title>
</head>
<body>
Hello World!
</body>
</html>

さきほどと同じように保存して、再度開いてみましょう。
開いたページのタブの部分を見てみましょう。
テストと言う名前になっていませんか？
<head>とは、本文には表示されない裏の設定を行う部分とでも解釈しておきましょう。
そして<title>は、お気に入りに登録するときに表示される名前だったり、
ページのタブ部分に表示される名前だったりします。

以降はHTMLクイックリファレンスを見ながら勉強されると良いかと思われます。
折角ですので、まだ作りかけのサイトですがサンプルにひとつ提供させていただきます。
http://white-snow.digi2.jp/test-site.zip

ウェブサイト構築の勉強方法について

>>1です。

PHP,Perl,Ruby,ASP.NET(VB,C#),JSP(Java)

>そこで、質問なのですが、技術的に必要なものとしては、

HTML言語の勉強は必須です。

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング