Webリソースの開発をして改めて思ったこと

こんにちは、水瀧です。
前回は少しリーダブルコードのソースを紹介したりしましたが、
今回は私が感じた「Web リソースの開発時の意識」について書いてみようと思います。
ー＞前回の記事

私が出会ったもの・・・それは・・・
今回、とある事情で、私ではない別の方が作成された HP をメンテナンスすることになりまして、
そこでとんでもないものと出くわしました。
それは

• 閉じられていないHTMLタグ
• インデントが統一されていないHTML
• 全てのコンテンツを一枚のindex.htmlに記述
• 命名ポリシーがわからないCSSのクラス
• エラーになっているCSSプロパティ
• 使われていないCSSプロパティ
• 5000行を超えるCSSファイル

です。
この時点で結構なエラーが出ていました。
リファクタリングの知識が使えるいいチャンスかな？なんて思いましたね。

やってはいけないこと
プログラマ目線からすると Web のコンテンツリソースも
IDE（統合開発環境）を使って開発するべきなものではないかなと、私は思っています。
なので滅多にないとは思いますが、HTML で文法の記述ミスがあったとしても、

HTMLの解析処理はある程度までならその場で補ってくれてしまうので、
できるところまではブラウザに表示してくれちゃいます。
（無理なところは表示が崩れたりするので、そこでようやく気づくわけですね）

でも、IDE を使わずに HTML を書いていると、やってしまう可能性があること、
それはエラーを残したまま気づきことなく他人の手に渡してしまうことです。
私自身、学生のときはまれにありました。
（先生にコードレビューをしてもらった時に気づきました。）
この時に使っていたのはテキストエディタでした。

開発するための環境
プログラムは突き詰めればテキストエディタがあれば開発は可能です。
私もそうしていたことがありました。
（今はそんなことしないですが・・・。汗）
ですが、テキストエディタはコンパイルやシンタックスチェックはしてくれないので、
やはりミスやエラーが起こりやすいです。
テキストエディタでなくとも、ミスをしてしまう可能性はゼロではないですよ。
ですが、Web 系の開発ツールというと、
今は phpStorm などの有料の IDE だけでなく、VSCode や eclipse などの無料のツールもありますね。
（ VSCode があることを最近知ったことは秘密です。過去の私に教えてあげたい・・・）

VSCode は拡張機能で CSS のインテリセンスも使えるようにもなるので使い勝手も良いのではないかと思います。
私自身使ってみて、感触としてはかなり良かったです。
普段の開発は VisualStudio を使っているので、UI が似てるだけでも安心感がありますね。
（PHP ファイルのアイコンが可愛かったです。）

なぜ IDE の話を出したかというと、先ほど書いた些細なエラーなどは、
IDE に組み込まれているバリデーションツールさんたちが事前に検知してくれるので、
IDE を使っていればシンタックスなどの凡ミスエラーは発生しなくなるはずです。
・・・しなくなると思いたいです・・・。

プロになるための技術を磨くことは大事です。
ですが、まずはこういった開発環境を整えることも大事なことではないでしょうか？

まとめ
今回は私が考える、プログラマから見た Web のフロントエンド開発でも
やってはいけないこと（やって欲しくないこと）と、
技術以外でも大事なことはあるよ、ということを述べてみました。
これから技術を磨くためにも今一度、自分がやらなければいけないことや
やりたいことに必要なものが何かを調べ、準備すべきだと思いました。
必要なものは調べてみれば結構出てきます。
もちろん全ては出ないと思います。
ですが、準備万端の状態で挑めば後でてんやわんやしなくなると思いたいこの頃です。
コードを書くならまずVS！
それでは今回はここまで。

---

採用情報

クラウドクリエイティブスタジオではエンジニアの方を絶賛募集中です。

皆さんとともに、是非！良きゲームを作っていきたいと思っております！

採用情報