info 当サイトはアフィリエイト広告を利用しています
ブログ

個人でWebコーダーとして活動する際に必要なものを総合的に整理してみました

私はこれまで3年、Webコーダーとして仕事をしてきました。
そのうちフリーランスとして1年以上活動しています。

3年働いてきて、Webコーダーとして活動していく上で何が必要になってくるのかを、
個人的に振り返る機会があったので、このブログでも残していきたいなと思い書いています。

check_circle このような方向けの記事です

  • これからWebコーダーを目指している人
  • Webコーダーに少しでも興味を持っている人
  • Webコーダーとして個人で仕事を受けていきたい人
  • いずれフリーランスWebコーダーを目指している人

色んなカテゴリ別に整理してみたので参考になれば幸いです。
では早速みていきましょう!

スキル編


まずはそもそもの話になりますが、個人で仕事を請け負うとなったときに
必要になってくるスキルを紹介しておこうと思います。

一般的なマークアップスキルはもちろんですが、
個人で活動していくとなると、ある程度プログラミングの知識も必要になってくることが多いです。

下記の中でいうと、「jQuery(JavaScript)」「PHP」あたりです。

check_circle 個人で活動していくにあたって必要になってくるスキル

  • HTML
  • CSS/SCSS
  • jQuery(JavaScript)
  • PHP
  • CMS(WordPress等)

ただCMS(WordPress等の)案件を請け負わない場合は、「PHP」のスキルはなくてもOKです。
ここらへんは自分が目指すレベル感や仕事内容にもよるかなと思います。

未経験から稼げるまでのスキルを習得するための方法については
下記にまとめていますので、興味のある方はぜひ覗いてみてください!

ちょこすこーん

個人で活動していくにあたってはスキル習得は言うまでもなく必要ですね!

開業届の提出

Webコーダーに限りませんが、フリーで活動していくとなると、
開業届の提出をする必要が出てくると思います。

私は当時会社員だったのですが、会社に退職の旨を伝えて、退職日が決まってからすぐに提出しました。
開業届の「開業日」の欄には退職翌日の日付を記入し、日をあけずに個人事業主になりました。

開業届を出すことによって、「青色申告ができる」「屋号を取得できる」といったメリットがあります◎

開業届を出すタイミングや開業日の設定はそれぞれ違うと思いますので、みなさんのタイミングで進めていただくと良いと思います!

余談:開業届はネットで簡単に作れる

開業届を作るのであれば、ネットで作成するのがとても簡単でおすすめです。

普通だと税務署に行って書類を書いて提出するというのが一般的かと思いますが、
ネットであれば画面通りに従って入力していけばあっという間に書類が完成できるので、ミスなく手間もかからず非常に便利です。

検索すると無料で利用できるサービスが出てくるので、興味のある人は調べてみてください。

私の場合は、友人が使用していたということもあって、freeeがやっている「freee開業」というのを利用しました。
青色申告に関わる資料も同時に作成できてとても便利でした◎

手順としてはネット上で必要項目を埋めて書類を作成、あとは税務署に提出すればOKです。
私は印刷して郵送で送りましたが、スマホからでも提出可能みたいです。

ちょこすこーん

「完全無料」で「全く専門知識がない」私のような人でも簡単に作れたのでおすすめです◎

【無料】freee開業について詳しく見る

経理・契約の知識

会社員で働いていると、経理や契約の知識って勉強する機会は少ないと思います。

ですが、今後もしコーディング関連のお仕事を個人でとっていきたい方や、
フリーランスとして独立を考えている方であれば最低限知っておく必要があるのではないかと思います。

経理


いわゆる売上や経費等の記帳方法であったり、確定申告に関することですね。
副業であってもフリーランスであっても、
年間ある一定の事業所得があれば確定申告が必要になってきますよね。

ただこれまでこういったことに触れてきていない人であれば、誰しもが躓くのではないでしょうか。
もちろん私もそうでした・・

無料記帳指導

国税庁にもありますが、実は「無料で税理士から記帳指導」を受けられるサービスがあります。

開業届を出すとお近くの税務署から案内が来るところもあると思います。

私は開業して一年目は全く知識がなかったので不安でしたが、
無料記帳指導というサービスがあったので利用しました。

結果、税理士さんに日々の記帳から確定申告書作成まで一緒にやっていただけたので、初心者の身としては大変ありがたかったです。

ちょこすこーん

「無料記帳指導」を知らない方がいれば是非利用していただきたいです◎

契約


個人で仕事をとっていくケースになると、主に取引先と「業務委託契約」を結ぶことが多いと思います。

check_circle 業務委託の種類

①準委任契約
②請負契約

ただしこのように業務委託契約には種類があり、
仕事を契約する前にはしっかりとどちらの契約形態になるか確認をしておいた方が良いです。

詳しく知りたい方は、外部サイトですがこちらの記事がわかりやすかったので参考にされてみてください。
https://style.potepan.com/articles/3669.html

取引先(仕事相手)との書類の取り交わし

余談ですが、実際に仕事を進めていくとなると、契約書以外にも色々書類のやり取りが必要になってきます。
私もまだ勉強中の立場ですが、

check_circle

  • 見積書
  • 納品書
  • 請求書

etc

こういった書類を取り交わしたりするので、自分で書類作成しないといけなかったりします。

私は開業する際に、開業届を無料で作成できるということで、
freeeを使用し、その延長でfreeeを今も使っていますが、
上記の書類関連もfreeeから作成できるので、便利でよく活用しています。

クラウド会計ソフトを使っていると、手作業で記帳する手間が省けますし、
書類の作成はもちろん、その書類から明細を読み取ってくれて
売上も紐づけてくれるのでとても便利です。

freeeに限らず、もし興味があれば他にも色んな会計ソフトがあるので、
ご自身にあった会計ソフトの導入を検討されてみてください。

機器・モノ系


続いて機械・モノ系です。先に結論から。

check_circle

  • パソコン
  • モニター
  • PCスタンド

これらが必要になってくると思います。一つずつ見ていきましょう。

パソコン

当たり前すぎますが、パソコンは必須ですね。
もしパソコンをお持ちでない方、もしくは持っていてもパソコンが古いといった方は、
是非購入や買い替えを検討してみてください。

個人的にはMacがおすすめ

ちなみに個人的には自分がMacbookを使っているのもありますが、Macがおすすめです。

ただ会社で働いていた時はWindowsを支給されていたので、
私自身、WindowsとMac両方使ってコーディングしてきた経験があります。

check_circle Macをおすすめする理由

  • M1、M1Proチップ搭載のMacは動作がさくさく
  • Adobeソフトが落ちない、カクカクすることがほとんどない
  • Macのトラックパッドがかなり優秀

このような理由があってMacを推していますが、
正直なところ、コードを書くだけであればWindowsもMacも大差ないと思います。
(ブラウザとエディタが使えればOKなので)

しかしコーディングするときはデザインデータを見ながら作業しますが、
そのデザインデータがAdobe製品であるPhotoshop等であるとき、
WindowsよりMacの方がかなり動作が安定していると感じます。(Adobe製品全般かも)

Windowsはメモリ32GBのものを使っていたので割と高スペックだと思うのですが、なぜなんでしょう・・相性でしょうか?

あとMacで気に入っているのはトラックパットがめちゃくちゃ優秀なところです。
本当に感度が良くて、Macを使い始めてからマウスを使うことがほとんどなくなりました。

必要スペック

以下スペックがあれば、コーディング環境としては十分なのではないかと思います。

check_circle

  • MacのM1チップ or M1 Proチップ搭載
  • メモリ8GB (16GBあれば十分)
  • ディスプレイ13インチ以上


モニター

モニターはあった方が効率が格段に上がるのでおすすめです。

普段ブログを書くときなどはパソコンのディスプレイだけで問題なくやれていますが、
コーディングするときは、それだけではきつかったりします。

というのも、コーディングするときは最低3つの画面を見て作業します。

check_circle

①デザインデータ
②ブラウザ(検証用・表示確認用)
③エディタ

もちろん1つでできなくはないのですが、
3つの画面をパソコンだけのディスプレイで行き来するのが結構大変になってくるので、そこにモニター1台あるとかなり助かります。

コーディングに限らず普段の作業でも、モニターがあれば結構捗る場面が多いです。
ただモニターは最初から絶対に必要な訳ではないので、
不便さを感じてきたら必要に応じて購入を検討していただく、で良いと思います。

私はDellのモニターを使っていますが、比較的安価なので気に入っています。
サイズは約24インチですが、これくらいの大きさが個人的には好みです。

私のものは古くて廃盤?になっていたので掲載できませんでしたが、参考となるモニターのリンクを貼っておきます。

PCスタンド

PCスタンドもあると非常に良いと思います。

コーダーはデスクワークがほとんどなので、肩こりなどが起こりやすいです。
姿勢が悪くなったりするからだと思いますが、
PCスタンドがあると姿勢も良くなりますし、肩こりも解消されやすいのでおすすめです。

私は目が痛くなることが多かったのですが、
PCスタンドを利用するようになってからはかなり軽減された気がします。
長時間作業する際などはあると効果を感じやすいんのではないかと思います。

私はこれを使っていますが、
高さを調整できたり、スマホを置ける場所があるところが便利で気に入っています。

サービス


続いてサービス編です。

check_circle

  • レンタルサーバー
  • GitHub
  • Visual Studio Code

レンタルサーバー

レンタルサーバーが必要な理由としては下記があります。

check_circle レンタルサーバーが必要な理由

  • テストサーバー(開発サーバー)として利用するため
  • ポートフォリオサイトを作るため
  • 事業紹介サイトをつくるため(必要な方のみ)

テストサーバー(開発サーバー)として利用するため

テストサーバー(開発サーバー)は、コーディングしたサイトをテスト用にブラウザで確認する際に使用します。

顧客がサーバーを持っていない場合や納品前のセルフチェック用として使いますので、必ず自分のサーバーは持っておいた方が良いです!

ポートフォリオサイトを作るため

個人で活動していく際は、エージェントや顧客からポートフォリオサイトを求められるケースがほとんどです。

あなたのスキルをしっかりアピールできるように、ポートフォリオサイトは必ず準備しておきましょう!

ちょこすこーん

私は「屋号名」をドメインにしたポートフォリオサイトを持っています◎

事業紹介サイトをつくるため(必要な方のみ)

Web上からの問い合わせで仕事を受けていきたい場合や、名刺にサイトURLを掲載したい場合などは、事業用のサイトを作っておくことも必要でしょう。

ポートフォリオサイトが代替として使えるケースもあると思いますので、必要な方のみ作っておくと良いと思います!

私が使用しているレンタルサーバーの紹介

レンタルサーバーは有料契約がほとんどですが、サーバーを契約するのが初めてで、不安な方は最初は無料レンタルサーバーでもOKです。

無料レンタルサーバー

私は以前、スターサーバーフリーを使っていましたが、特に問題なく動作していたので一つ選択肢としてありかと思います。

その他にも、XFREEであったり、XREAといったものもあるようですので、興味のある方は覗いてみてください。

check_circle 無料レンタルサーバーの注意点

無料レンタルサーバーの場合、

  • サイトに広告が表示される
  • サーバー容量が少ない
  • ページ速度が有料版より遅い
  • 無料SSLが利用できない(※これはかなり欠点)

等々のデメリットが発生する場合もあるので事前に確認しておいた方が良いでしょう。
有料のレンタルサーバーであればこれらの問題は気にしなくても良くなるので安心感はあります。

有料レンタルサーバー


有料レンタルサーバーであれば、「ConoHa WING」がおすすめです。

ConoHa WINGは、独自ドメインが2つ永年無料で取得できるのが個人的に最強だと思っています◎
もちろん表示速度も問題なく、公式でも国内最速を謳っていますので、サーバーとしても申し分ないです。

ちょこすこーん

価格も安く、ドメイン込みで月々1000円以下で利用できるのでコスパ◎です!

「ConoHa WING」について詳しくみる

GitHub

GitHubはコーダーであれば是非登録しておきたいです。

まずGitHubというのは簡単にいうと、
Gitの仕組みを利用して世界中の開発者たちが自分のソースコードや作品を
公開したりしてインターネット上で閲覧できるようにしたWebサービスです。

チームを組んで開発する場合などに特に使うことが多いですが、
個人開発でも利用できます。

check_circle 利用するメリット

①無料で使うことができる
②ソースコードをプロジェクトごとに管理できる
②過去の修正履歴を確認できる
③転職活動時のポートフォリオになる

もっとたくさんメリットはあるのですが抜粋させていただきました。
業務委託や就職などでチームで開発するときは必ずといって良いほど、
Gitは利用されているので、まずは練習としてGitHubを登録して使ってみると良いと思います。

もしGitHubに自身のソースコードを公開しておけば、
ポートフォリオの代わりとして企業に提出することもできますので持っておいて損はないと思います。

Visual Studio Code

Visual Studio Codeはご存じですか?

通称VScodeと呼ばれていますが、Webコーダー以外にもエンジニアであれば入れておいて損はない非常に便利なツールになっています。

VScodeとはエディタですが、非常に軽くて拡張機能も豊富でかなり使いやすいです。
エディタを何にしようかと迷われたら、とりあえずVScodeを入れておけば間違いないです。
私も本当に毎日お世話になっています。

無料なのに素晴らしいです。

スキルアップ


よくこの業界では、技術発展のスピードが速いので「勉強し続けないといけない」などと言います。

コーディングに関しても本を一冊勉強したからそれで終わり、といったことはなく、
日々知識のアップデートであったり、新しい技術の習得が欠かせません。

そこで、

ちょこすこーん

どうやって新しい知識を得ていったら良いの?


と疑問を持つ方もいらっしゃると思うので、
私がおすすめする方法について紹介したいと思います。

ICS MEDIA

ICSメディアは、

check_circle

ウェブデザイナーとフロントエンジニアのための情報メディア
となっています。

私は一番このサイトにお世話になっていて、記事もすごくわかりやすいですし、
トピックも興味を引かれるものばかりです。

新しいコーディング知識はこのサイトから学ばせていただくことが多いです。
是非みなさんも見ていただければと思います。

Twitter

Twitterは情報収集に最適なツールだと思います。

実際にコーディングに関する情報を発信されている方は沢山います。
コーディング以外にも業界についてだったり、
有益な情報を日々色々な方がつぶやかれているので、
Twitterを見ているだけでかなりの量のインプットができると思います。

ITやWeb業界で働くのであればTwitterは本当に勉強になる場だと思いますので、是非活用していただければと思います。

Twitterの良いところは隙間時間にでも気軽に見られるということがあると思うので、インプットの習慣化もしやすいところが良いですね。

まとめ


いかがだったでしょうか?

Webコーダーとして活動していく際に必要となるものについて色々な視点から紹介してみました。

未経験の方や、これからWebコーダーを目指す方、個人で活動していこうとされている方々の何かの参考になれば幸いです。

もしまた何か情報がありましたら、随時更新していきたいと思います。

タイトルとURLをコピーしました