【Webエンジニアになる為の学習方法】どんなサイトを作ればいいか?

web Webエンジニア
Webエンジニアを目指しています。実際に何かサイトを作成してみたいのですが、どんなサイトを作ればいいのでしょうか?
このような疑問にお答えします。

この記事の内容は

いきなり結論を知りたいという場合は実践編へ飛んでください。

事前準備

まずWebエンジニアを目指すにはPHPかRubyのプログラミング言語どちらかを選ぶことになるでしょう。

現状で求人件数の多さはPHPが有利、なのでPHPを学んでからRubyにも手を出せばいいんじゃないかと思っています。

ただPHPは他の言語では推奨されない書き方ができてしまい、それが最初のクセになってしまうというデメリットもあります。

フレームワークを利用すればそこまでおかしなことはしないと思いますので、今の流行で言えばPHP×Laravelでwebサイトを作成すればOKでしょう。

入門編

それではPHPを選択したとして、どんなwebサイトを作っていくか?結論から言えば自分の開発マシンの環境内で、簡単なサイトを作成すればOKです。

例えばただの掲示板とかですね。入力欄があり、入力してボタンを押すと書き込まれて表示される。これだけです。

これだけですが、シンプルな入力と出力、そしてテーブルを利用するのでテーブル設計とPHPからテーブルを利用する為の方法など業務に必要な基礎が学べるでしょう。

ここはそれこそPHPの入門学習書などを読んで実践されている方であれば既に経験済みかもしれませんね。まだ入門学習を済ませていない方はそのようなサイトの作成方法が載っている入門書からスタートするのも有りです。

実践編

さて、ここからが本番です。あなたがwebエンジニアとして何かサイトを作ろうとしているということは、最終的にはエンジニアとしての転職を目指しているなど実務的な技術を学びたいと思っているはずです。

ここまでやれば採用時に有利になる可能性がある。そんなwebサイトの作り方を考えてみたいと思います。

どんなサイトを作ればいいか?

あなたが普段使っているSNSなどのサイトがあれば、その機能を模倣したものを作成するといいでしょう。

ただしそのまま真似ても微妙なので、基本機能は継承しつつ何か付加価値をつけるといいかと思います。

例えばあなたが普段Amazonを利用してショッピングをしているなら、商品名を入力するとAmazonと楽天とYahooショッピングで検索した商品情報が表示され比較できるサイト、といった感じです。

SNSをやっていて、かつ何か趣味があるのであればそれ専門のSNSを設計するのも面白そうです。プラモデルなどの模型が好きで、模型好きがつながるSNSなんて感じのサイトがたくさんありますよね。

こういうサイトを作ればいい

ぶっちゃっけ、インプットとアウトプットがあり、それをテーブルで管理しているという構造になっているサイトなら何でもOKです。

逆にユーザーによる入力が何もなく、ただwebページを表示しているだけのサイトとなるとアピールとしては弱いかなと思います。

業務で作成することになるwebサイトでは以下が必須であることがほとんどです。

  • インプット
  • アウトプット
  • データベース

インプットは何でもいいので利用者による入力、アウトプットはその入力されたデータを表示する部分、そしてインプットされたデータを保存しておくにはデータベースが必須。

さらにはアウトプットで検索など何か条件による抽出をする場合にはデーターベースに対してSQLで検索するなども必須になってきます。

database

【SQLの学習】Webサイトを作る為のデータベース操作方法の学習

2019年8月9日

サイトの作り方

そういったサイトを作る際に何が必要か?ということですが、具体的には以下の技術が必要になるかと思います。

  • 画面設計
  • テーブル設計

画面設計

webサイトであれば手書きで、どんな画面があるかを羅列して書いていくと、具体的にどんな機能が必要なのかが見えてきます。

具体的にどのような項目があるかまですべて完璧に書いていく必要はありません。シンプルなものでいいのでとにかく画面全てを簡易に書いていきます。

そうすると必要な機能も見えてくると思います。

テーブル設計

必要な機能が見えたなら、それを実現するにはどんなテーブルが必要になるかざっくり見えてくると思います。

例えばSNSであればユーザー登録と投稿機能があると思いますので、ユーザーテーブルと投稿テーブルは必須になってくるでしょう。

フォローの機能があるのであれば、どのユーザーがどのユーザーをフォローしているかというフォローの管理テーブルも必要になります。

SNSは最初の作成経験としてはフル機能でやると結構難しく挫折してしまうかもしれませんので、シンプルに抑える必要があると思います。

サイトを作るだけじゃなく公開する

採用時のアピールにするのであれば、サイトは自分の開発マシンで作るだけではなく、公開サーバーに置いて公開・運用する方がベターです。

実際、webエンジニアの仕事はサイトを作るだけではなく、サーバーを立ててセットアップしwebサイトを見られるようにすること。

さらにはその後サイトダウンさせないように監視・運用していくといったことが含まれていることが多いです(私もやっております)

なのでただサイトを作るだけじゃなく、公開・運用までしているということであれば良いアピールポイントになります。

サイトの公開方法

理想的にはオリジナルのwebサービスを独自ドメインで運用していることですが、最初はそこまでいけなくてもいいと思います。

なぜなら公開サーバーは月額でレンタルサーバーの費用がかかり、独自ドメインは年単位で費用がかかるのでちょっとした出費になってくるからです。

だからこそこれをやっている人はそれだけで他の応募者から頭一つ抜き出る可能性があるので、熱量高めの方は目指してみてもいいと思います。

そうでないかたはXFREEなどの無料サーバーでまずは練習がてらに公開してみると良いでしょう。XFREEでwordpressの練習をした際の記事がありますので参考にしてみてください。

server-white

無料レンタルサーバーXFREEでwordpressの勉強・カスタム練習をする方法

2019年7月22日

ユーザー登録について

サイトを公開するにあたり、一点だけ個人情報の取扱いに注意する必要があります。

特に始めて作るサイトは何かしらセキュリティ的によろしくない場所を作ってしまうこともあるでしょう。

そのため個人情報を入力してもらうような部分は省いた方が無難かもしれません。

具体的にはメールアドレスなんかがそうですね、でもメールアドレスが入力できないとユーザー登録機能自体作れないじゃないかと思いますよね。

ユーザー登録は他サービス利用で

よく見ると思いますが、「ツイッターアカウントで利用する」「googleアカウントで利用する」といったwebサイトが多いですよね。

あれだと自分のサイトにメールアドレスを入力して登録してもらわなくても、他サイトのアカウントを利用して登録が可能になります。

そちらの利用方法は長くなってしまうので、また別途記事にいたします。

まとめ

色々と書いてきてしまいましたが、どんなサイトを作ればいいか?については書いてきた通りです。

注意点があるとしたらいきなりたくさんの機能を盛り込んだ完璧なサイトを作ろうとすれば高確率で挫折するということです。

まずはコンパクトにシンプルでいいので始めてみることをおすすめいたします。