【Web制作】:必須ツール

ツールがぞう
悩み

プログラマーになるために「何を準備すればよいのだろう?プログラミングというぐらいだからパソコンは必要だと思うけど、どんなスペックのパソコンを用意してソフトは何が必要なんだろう?」このような悩みが出てきました。

今回は、このようなお悩みを解決するためのお手伝いをします。

✔︎ 本記事の内容

プログラミングに必要なPCについて

開発環境ツール

✔︎この記事を読むメリット

・プログラマーになるために必要なPCのスペックやOSが分かる。

・プログラミングをするのに必要なソフト、ツールが分かる。

 

この記事を書いている僕は2021年8月から副業としてプログラミングの勉強を始めました。

副業を始めた理由は世界的に流行したウイルスによって収入が減り、家にいながらできる副業を探し始めたからです。学ぶのは大変だと情報で知ってはいましたが、家にいる時間が増え勉強の時間を多くとれるようになったため、学習は大変だけど単価が高いためプログラミングを副業として選びました。そのおかげで今ではコロナ前よりも多くの収入を得ることが出来ています。

そんな僕がプログラミングの勉強を始める時に困った内容をシェアしていきます。

参考になると嬉しいです。

結論

PCのスペックは何でもよいが、ツールが対応できるOSがWindowsのが多いため、WindowsPCを推奨します。

テキストエディターではVScodeを仕様するなど、無料ツールで十分学習可能

上記のとおりです。

過去の僕と同じ悩みを抱える方へ、心を込めて深堀りします

目次

プログラミングに必要なPCについて

パソコン
どれ?

「プログラミングに必要なPCのスペックやOSってなんなんだろう?」

こちらのテーマではこのような疑問を解消するために深掘りして解説していきます。

✔︎本テーマの内容

Windowsについて

Macについて

PCのスペックについて

✔︎このテーマを読むことのメリットはこのような内容です。

・目的とする言語に対応したOSが分かる。

・プログラミングの学習に必要なスペックが分かるため、PC選びが簡単になる。

こちらのテーマでは、PCについてプログラミングに必要なPCのスペックやOSについて解説します。プログラミングを学習するのでPCの準備は必須になります。しかしOSやスペック等、PCを買おうとすると選択肢は無限にあり、しかも基本的に高価ゆえ中々買い替えを行得ないものです。

ここではプログラミング学習に絞って必要なOSやスペックを紹介するので、購入の参考にしてみて下さい。また既にPCを所有している方は自分のPCのスペックが満たしているかを確認してみてください。

Windowsについて

こちらのパートでは、OSがWindowsのPCについて説明します。WindowsPCは多くの企業で導入されており、様々なツールに対応しています。
そのため多様な開発環境を構築することが可能であり、HTMLやCSS,JavaScriptなどWeb制作向けのプログラミングを始めるならば、Windowsの方が環境を構築しやすいです。

またMacに比べて使用している人口数が圧倒的に多く、その分プログラミングをサポートするツールやエラーの情報も多量にあります。そしてWindowsで動作するゲームを作るなどのWindows上で動作するアプリケーションを作成する場合は、動作確認も含めてWindowsを選ぶのがよいでしょう。

ただし最新OSにアップデートしたばかりだと各種ツールが、OSに対応できていない事が多いので、新OSが出たばかりの時はツールが対応できているかを確認してから購入することを推奨します。

Macについて

こちらのパートでは、OSがMacのPCについて説明します。Windowsに比べてMacを導入している企業は少ないです。しかし、ios向けアプリケーション開発はSwiftやObjective-Cと言った専用言語を使用するため、OSがMacである必要があります。

IphoneやIpad等Mac製品の日本での流通規模は大きく、SwiftやObjective-Cを使った開発はしばらくなくならないと言われています。そのため、Mac製品向けのプログラミングを行うことが決まっているのならばMacPCを購入するのが良いでしょう。

PCのスペックについて

CPUスペックは可能であれば最新のものを選んでおけば間違いないですが、そうすると金額が上がってしまいます。CPUは数年前までのレベルであれば問題ないですが、Web上で複数の処理を動かすこともあるので並列処理ができるCPUにしておいた方がよいです。

WEB上での動作やゲームではメモリを多く使うことがあるので8GB以上が推奨されています。

ストレージは基本的に現代のPCであれば問題ないです。プログラミング学習で出来あがるアウトプットはソースコードメインのため、現在の標準で250GB以上あるPCであれば問題ありません。

????どちらのPCがいいのか??????

Macのアプリケーション作成を行いたい場合はMacを選ぶと良いですが、Web制作や組み込み等の一般的なソフト開発を行いたいときはWindowsを選ぶのが良いでしょう。

Web制作から派生して他のプログラマーとしてのスキルを伸ばす時にも、学習ツール対応ツールの関係で、Windowsの方が有利です。

Web制作で使用する言語については下記記事を参考にしてください。

こちらのテーマでは「プログラミングに必要なPC」について深掘り解説してきました。

開発環境ツール

かんきょうかいはつつーる
わからない

「プログラミングに必要なツールってなんなんだろう?」

こちらのテーマではこのような疑問を解消するために深掘り解説をしていきます。

✔︎本テーマの内容

テキストエディター

デベロッパーツール

✔︎このテーマを読むことのメリットはこのような内容です。

・学習に必要なテキストエディターが何か分かる。

・学習に必要なデベロッパーツールが何か分かる。

こちらのテーマでは、プログラミングを行うための開発環境ツールについて説明しています。

実際にPCを買っただけではプログラミングに必要なツールはインストールされていません。そのため実際にコードを書くための開発環境ツールを選ぶ必要があります。
ですがこちらのツールも多種多様に存在するので、僕のおすすめのツールを紹介します。

テキストエディター

こちらのパートでは、テキストエディターとしてVScodeを紹介します〈具体例①〉

テキストエディタとは実際にコードを記入するツールで、メモ帳のようなものです。

メモ帳でも代用は可能なのですが、開発を進める上では不便な点が多いため今回は僕が使っているVScodeについて説明します。

VScodeはMicrosoftが提供している無料なのに高機能なテキストエディタです。

実際のプログラミングの現場などでも第一線で活躍しています。

VScodeの特徴は、豊富な拡張機能を備えておりほとんどのプログラミング言語やフレームワークに対応している点があげられます。そしてデバッグ機能も豊富で、VScodeの画面上で実行できるため、プログラミングのエラー部分をすぐに把握することができます。

また無料であるためにユーザーの数も多く、エラー内容についてもネットに多く出回っています。

どんなプログラマーもエラーを出さないコードを書き続けることは不可能で、絶対にどこかでエラーが発生します。その時にエラーが同画免上に表示されるため分かりやすく、検索すれば解決手段を見つけやすいVScodeはインストールしておいて損はないでしょう。

実際にエラーに関する検索の具体的方法は下記の記事で紹介しています

デベロッパーツール

こちらのパートでは、デベロッパーツールについて紹介します

デベロッパーツールとは、各ブラウザに搭載されている開発者用の検証ツールのことです。

主にWeb制作者向けのツールで、ウェブページの構造(HTML)やスタイル(CSS)を確認することができ、JavaScriptのエラーを特定することもできます。
また各ブラウザで利用できるため、VScode同様に無料で使用することができます。

Web制作に向けてHTML等を勉強しても、実際のウェブページがどのような作りになっているのかを見ただけで理解するのは始めの頃は難しいです。ですがデベロッパーツールを使えば、どの要素がどのように配置されているかを視覚的に認識できるため、ウェブページ全体の理解に役立ちます。

また実際に自身で書いたJavaScriptコードのデバッグが行えるため、バグの特定と修正が容易になります。VScodeでは、エラーメッセージは出力されますが、視覚的にどのようなバグになっているか把握するのが難しいので、デベロッパーツールを使うことで自身の間違いを正確に把握することができます。

例えばWeb画面で画像Aを表示させたい場合に、そのコードをVScodeで書いたとします。ですが、読み込む画像を間違って画像Bとしてしまったとき、VScode上では「画像を読み込む」という処理に間違いはないため、エラーとなりません。しかしWeb上では違う画像が出力されているためすぐに間違いに気づくことが出来ます。そして、デベロッパーツールを使用すれば、指定した画像の名前が間違っていることをすぐに見つけることが出来ます。
自分の書いたコードがどのようなふるまいをするのかを理解するのは、プログラマーにとってとても大切な事なので、ぜひ自身のスキルアップに役立ててください。

プログラミング学習のためには、適切な開発環境ツールが必要不可欠です。

その基本としてテキストエディタを使用してコードを書き、デベロッパーツールで結果を確認することで、より効率的に学習を進めることができます。

テキストエディタやデベロッパーツールなど、プログラミングをアシストしてくれるツールは数多く存在し、VScodeもデベロッパーツールも無料のため、まずは触ってみて概要を把握することが大切です。

特にデベロッパーツールはWeb制作の結果が出力されているので、とても参考になると思います。

デベロッパーツールを実際に触ってWeb制作の専門職に興味が出た方は、下記記事を見て頂くとより深く理解できると思います

自身がなりたい専門職で必要となるツールを把握することです。

それによって必要となる各開発環境ツールが異なります。しかし、調べたけどどの専門職にどんなツールを使う必要があるかが分からない。そんな方もいると思います。

そういう方は一人で悩むのではなく、スクールに通ってみるのも良いと思います。僕は独学で行いましたが、初めから上記のツールを知っていればもっと早くにスキルアップできたと思うので、プログラマーの先輩の実体験や実際に使っているツールを聞くのはとても有用です。またツールの不明点を聞けるもメリットですね

こちらのテーマでは「開発環境ツール」について深掘り解説してきました。

まとめ

まとめ

この記事では「【Web制作】:必須ツール」というタイトルを下記のテーマにまとめて解説しました。

・プログラミングに必要なPCについて

・開発環境ツール

という内容でお届けしました。

それでは最後まで読んでいただいてありがとうございました!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメント一覧 (4件)

コメントする

目次