こんにちは！福岡のホームページ制作会社「シンス株式会社」の芦刈です。
春になり、新入社員が続々と入社してくる季節となりました。
私たちのようなホームページ制作会社では、社員一人に一台パソコンが支給されますが、支給された時点では初期化されている、もしくは箱から未開封の状態なので、何もセットアップがされてません。
今回は「新人のコーディング担当者」がパソコンにインストールしておくツールについてまとめましたのでご覧くださいませ。
パソコンは「Mac」を前提に話を進めさせていただきます。
ブラウザ
Macはデフォルトで「Safari」はインストールされてます。
コーディング担当者の場合、コーディングしたデータを様々なブラウザで表示確認をする必要がありますので、代表的なブラウザを一式インストールします。
Chrome
https://www.google.com/chrome/
上記URLからダウンロードができます。
「Chrome をダウンロード」ボタンからインストールすることができます。
Firefox
https://www.mozilla.org/ja/firefox/new/
上記URLからダウンロードができます。
「Firefox をダウンロード」ボタンからインストールすることができます。
Microsoft Edge
https://www.microsoft.com/ja-jp/edge
上記URLからダウンロードができます。
「以下用のバージョンをダウンロード macOS」ボタンからインストールすることができます。
連絡ツール
ホームページ制作を進行するときは、様々な連絡ツールを利用します。
お客様や取引先によって利用しているツールはそれぞれ異なりますので、代表的な連絡ツールは一通りインストールしておきましょう。
Slack（スラック）
https://slack.com/intl/ja-jp/downloads/mac
上記URLからダウンロードができます。
Slack（スラック）とは、ビジネスチャットツールです。
基本的には社内の連絡に使いますが、他社のSlackアカウントと連携することで、社外の人とのコミュニケーションを円滑にすることも可能です。
ブラウザ版 or アプリ版がありますので、お好きな方をインストールしてください。
Chatwork（チャットワーク）
https://go.chatwork.com/ja/download/
上記URLからダウンロードができます。
Chatwork（チャットワーク）とは、ビジネスチャットツールです。
メッセージを送るのはもちろんですが、ツール内でビデオ通話もすることができます。
ブラウザ版 or アプリ版がありますので、お好きな方をインストールしてください。
Zoom（ズーム）
上記URLからダウンロードができます。
Zoom（ズーム）とは、オンライン上でミーティングを開催できるWeb会議システムです。
テレワークが社会に浸透した理由からZoom（ズーム）を使う企業も多くなりました。
Gmail
Gmailもよく利用するので、所属する企業用にアカウントを作成しておきましょう。
Adobe（アドビ）デザインツール
https://creativecloud.adobe.com/ja
上記URLからAdobe Creative Cloudにログインすることができます。
Adobe（アドビ）ツールは、画像を編集したりデザインを作成するために使います。
Creative Cloud デスクトップをダウンロードして、次のツールをインストールしておきましょう。
- Adobe Photoshop
- Adobe illustrator
- Adobe XD
ソフトウェア・アプリケーションツール等
企業によって利用しているソフトウェア・アプリケーションツールは異なりますが、弊社で利用しているツールをご紹介します。
Dropbox（ドロップボックス）
https://www.dropbox.com/downloading
上記URLからダウンロードができます。
Dropbox（ドロップボックス）とは、オンラインストレージサービスです。
オンラインでファイルやフォルダの共有・同期が可能なので、オフィスに出社しなくてもデータのやり取りができる便利なツールです。
弊社ではデザインデータや資料、画像データなどを格納するのに使っています。
SourceTree（ソースツリー）
https://www.sourcetreeapp.com/
上記URLからダウンロードができます。
「Download for Mac OS X」ボタンからインストールすることができます。
SourceTree（ソースツリー）とは、Gitの管理システムツールです。
コーディングしたソースコードの履歴を、視覚的に分かりやすく確認することができるので便利です。
Mamp（マンプ）
上記URLからダウンロードができます。
「Free Download 」ボタンから無料でインストールすることができます。
Mamp（マンプ）とは、ローカル環境でデータベースやPHPの環境をインストールできるツールです。
PHPファイルはサーバーにアップしないと表示確認できませんが、Mamp（マンプ）があるとローカル環境で開発を進めることができます。
Xcode（エックスコード）
https://apps.apple.com/jp/app/xcode/id497799835?mt=12
上記URLからダウンロードができます。
Xcode（エックスコード）とは、アプリ開発を行うツールです。
弊社のコーディングでは「Sass」を利用しています。
このXcodeに含まれている「Command Line Tools」が必要になるためインストールします。
FileZilla（ファイルジラ）
https://filezilla-project.org/download.php?type=client
上記URLからダウンロードができます。
FileZilla（ファイルジラ）とは、サーバーにファイルを送受信できる転送ソフトです。
FTP接続、SFTP接続をしてファイルを転送することができます。
Backlog（バックログ）
Backlog（バックログ）とは、プロジェクト管理ツールです。
プロジェクト管理、課題管理、バージョン管理（Git）を一つのツールで管理することができます。
弊社では、すべての案件の管理はこのツールを利用しています。
※このツールはインストールではなく、管理者から招待してもらう必要があります。
esa（エサ）
esa（エサ）とは、情報を整理するためのツールです。
社内ではスニペットの蓄積、マニュアル作成、日報などに利用しています。
※このツールはインストールではなく、管理者から招待してもらう必要があります。
テキストエディタ
コーディングをする際は、テキストエディタでコードを書きます。
作業者によって使いやすいテキストエディタは異なりますので、お気に入りのものを使ってください。
以下、代表的なテキストエディタを掲載します。
Visual Studio Code
https://azure.microsoft.com/ja-jp/products/visual-studio-code/
上記URLからダウンロードができます。
拡張機能が豊富で利用者も一番多いとされているテキストエディタです。
爆速でコーディングができる「Emmet」がデフォルトで有効になっているので、特に何もインストールしなくても環境は整っています。
Sublime Text
https://www.sublimetext.com/download
上記URLからダウンロードができます。
こちらも拡張機能が豊富で、シンプルなインターフェースで使い勝手が良いテキストエディタです。
初期機能は少ないので、自ら拡張して使いやすくすることを前提としています。
Atom
上記URLからダウンロードができます。
こちらも拡張機能が豊富で、UIデザインが良いことで有名なテキストエディタです。
設定画面も見やすくて、パッケージの管理がしやすいツールです。
まとめ
以上、新人のコーディング担当者にセットアップしてほしいツール一覧になります。
インストールするツールは多いですが、どれも制作には欠かせないツールとなっています。
「・・・これは何のツールなのか？・・・何に使うのか？」をしっかりと把握して、制作に備えておきましょう。
〈 この記事を書いた人 〉
Webディレクター芦刈光彦
社内では、Web制作のディレクション、フロントエンドを担当しています。
音楽と登山が好きです。ずっと福岡に住んでます。どうぞお気軽に。
