Web制作会社にコーダーとして入るための必須知識まとめ【未経験者向け】

コーダー志望の人
コーダー志望の人

未経験だけど、Web制作会社にコーダーとして入りたい。HTML/CSSは勉強したけど、他にどんな知識が必要なのかな?

本記事では、こんな疑問にお答えします。

Web制作会社にコーダーとして入るためには、HTML/CSSの知識だけでは少し厳しいです。実際の現場はHTML/CSS以外にも様々な技術が必要。チームでの開発や作業効率化を進めるうえで他の技術が採用されているのです。

そんなわけで今回はWeb制作会社にコーダーとして入るための必須知識をまとめました。

づみ
づみ

私自身、未経験のコーダー(兼ディレクター)として入り、「この知識がないときついな…」と感じたものをまとめていますので、参考になるかと思います。

これからコーダーとして制作会社に入りたい、活躍したい方の参考になればうれしいです。それではいってみよー

Web制作会社にコーダーとして入るための必須知識

具体的には下記の通り。

  • HTML / CSS
  • Sass(SCSS)
  • Javascript(jQuery)
  • Photoshopの基礎知識
  • github

上から順番に重要度が高いと思ってもらえればよいかと思います。

各項目が必須である理由と、おすすめの勉強方法を解説していきます。

HTML / CSS

言うまでもなくですが、コーダーとして入るのであればHTMLとCSSの知識は必須です。ここは理由割愛させていただきます。

+αで勉強しておきたいこと

  • CSS設計
  • HTMLマークアップの基礎理解をさらに深める

上記2点を勉強しておくとなおよしです。特にCSS設計は、チームで作業する場合や保守運用という観点を踏まえて、コーダーに求められる1つのスキルになるので、必須レベルで勉強しておくと良いでしょう。

おすすめの勉強法

■基礎知識から学びたい人

ドットインストール or プロゲートから取り組みましょう。どちらかを終えたら次は実際にサイトを制作していきます。

づみ
づみ

適当なサイト模写から始めてもよいですが、最初は本を見ながら進めるのもおすすめです。自分は下記を購入して知識を深めました。

■CSS設計を学びたい人

手順としては、

  1. CSS設計とはなんなのか?をググって基礎知識を深める
  2. 実際にどのようにして書くのか?を本で学ぶ

おすすめの本はこちらです。

少々お高いですが、書き方の例や、こういうときどうしたらいいの?を具体的に解説してくれています。

CSS設計に関しては、ググっても概念的な解説がほとんどなので本から学ぶのが一番かもです。

Sass(SCSS)

Sassとは、CSSをより効率的に書くことのできる記法です。SASSを使うことで作業効率が大幅に向上したり、保守管理が楽になります。

必須の理由

制作会社では、CSSファイルにそのまま書くことはほとんどありません。Sassに書いてコンパイルするのが一般的です。

というのも上述の通り、Sassで書くことによって作業効率が向上するからです。またCSS設計の観点からもSassでファイルを分割したほうが保守性も高まります。

おすすめの勉強法

おすすめの勉強法は以下の3通りです。

  • Youtubeに落ちている学習動画で学習
  • 本を買って学習
  • 調べつつ自力で学習

Youtubeに落ちている学習動画で学習

このあたりがおすすめです。

本を買って学習

づみ
づみ

このあたりは鉄板中の鉄板。Sassの基本から体系的に学ぶことができます。

調べつつ自力で学習

調べつつ自力で学習するのもありです。「Sass 書き方」「Sass 使い方」などで調べれば有益な記事がたくさん出てきます。あとは実際に書いてみるのが大事です。(このブログでもSassの使い方作成中。。。)

Javascript(jQuery)

Javascriptはプログラミング言語のひとつです。Javascriptを使うことによって、ユーザのアクションに基づきWebページの内容を変えたり、リッチなアニメーションを再現することもできます。

jQuery、はJavascriptをもっと簡単に書けるようにしたものです。

必須の理由

JavascriptもしくはjQueryが書ければ、面接時にアピールポイントとなります。また会社によっては「コーダーはJSくらい触れて当たり前だよね」という価値観もあるみたいなので、やはり必須知識といえます。

おすすめの勉強法

ドットインストール or プロゲートで基礎を学習するのがおすすめです。

ただ基礎をやり続けると必ず飽きるので、「なんとなくわかった」という状態になれば自分で手を動かしてなにか作りましょう。

  • モーダルウィンドウ
  • タブ切り替え
  • スライダー

制作物としては上記3点あたりがおすすめです。現場でもよく使うのでぜひ身に着けておきましょう。

Photoshop

Photoshopは、Adobeの画像編集アプリケーションです。画像編集ツールですが、現場ではデザインカンプの制作に使われています。

必須の理由

デザインカンプから素材を書き出したりするためには、Photoshopの基礎知識が欠かせないです。そのため、基本的な操作はできるようになっておきましょう。

おすすめの勉強法

Photoshopを契約して実際に触りましょう。習うより慣れろです。

触っていると「何がわからないのか」がわかってくるので、そのときにググるっていうのを繰り返せばOK。

Github

Githubは、コードをチームで共有できるようになるコード管理ツールです。誰のコードが最新のデータかを常に管理してくれます。

必須の理由

制作現場はチーム開発がほとんどなので、コード管理が欠かせません。そのため、どの制作現場でもGithub(もしくはその他)のような管理ツールを導入しているはずです。

ガッツリ学ぶ必要はありませんが、基本操作を覚えておくと入ってからも仕事を進めやすいです。

おすすめの勉強法

  1. githubのアカウントを作成する
  2. gitの使い方をググる(https://techacademy.jp/magazine/6235 ←参考)
  3. ポートフォリオをgitで管理する

まとめ

というわけで、以上が制作会社にコーダーとして入るための必須知識です。今回挙げたのは、あくまで僕の実体験に基づくものでして、制作会社によればもっと知識が必要かもしれません。

づみ
づみ

とはいえ、紹介した項目を理解しておけば、転職や就職には必ず役に立つのでぜひ実践してみてください。

今回は以上になります。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA