駆け出しエンジニア達が現場に入って気付いた【入社前に学んでおきたかった事】
大変好評頂いておりますが、このnoteは永久に全て無料で公開します。
本題
以前、下記のツイートをしました。
上記ツイートに対する反応が非常に良く、質問も多かったのでオススメの学習サイトも含めて簡潔に分かりやすくnoteに纏めました。
近頃、Twitterやコミュニティを通じてオフラインでも沢山の駆け出しエンジニアさんとお会いさせて頂く機会が増えてきました。
そんな中、盛り上がる話題の一つとして「入社前にこれ学んどけば良かった!」などの後悔の声です。
そこで大変好評を頂いたnote、駆け出しエンジニアが面接で聞かれる質問集に続いて、約50人の駆け出しエンジニアに聞いて分かった、おろそかにしがちだが、現場に入る前に学んでおきたかった事TOP5を纏めました。
今回は駆け出しWebエンジニア約50人に聞きました。
※フロントエンドかバックエンドか、どのよようなエンジニアを目指すかでもランキングは大きく変わってくるかと思います。
1位 Git/GitHub
2位 SQL
3位 sass
4位 Linux
5位 ショートカットキー、emmet
■■■ Git/GitHub ■■■
Git/GitHubは、今では開発者にとってなくてはならないサービスで、デザイナーの方などにとってもすごく便利なものです。
【Gitとは?】
ファイルの変更履歴を記録・追跡するためのバージョン管理システムです。
Webエンジニアとして実際に仕事をする際は、チームとして開発を進める事が多いです。そんな時にGitは役立ちます。
開発現場では必ず「バージョン管理システム」というのを使って共同開発を行っています。
【バージョン管理システムとは?】
ある程度の規模のアプリケーションを作っていく中で「色々コードを試したけどコードがグチャグチャになってきた!自分では戻せないから以前の状態に戻して!」といった要求に応えてくれます。
【バージョン管理とは?】
ファイルを何度も更新していく中で必ず管理したいのが、ファイルの変更履歴です。
ファイルの変更履歴を残せないと、一度保存したものを元に戻す事が難しくなります。
また、チームで開発をするようになると誰がどのファイルを変更したのか管理していかなければ、いつの間にか意図しなかった変更が入り込んでしまうこともあります。
ファイルの変更履歴を管理することをバージョン管理と言います。
【GitHubとは?】
GitHubは、Gitを使ってバージョン管理しているプロジェクトをオンライン上で共有・管理してくれるWebサービスです。
Gitは通常、自分のPC内のローカル環境でのバージョン管理を提供してくれます。
しかし、バージョン管理しているプロジェクトのバックアップを取りたい場合や、チーム開発を行う際、どこにチーム全員の変更履歴を集めるかが問題になります。このような時に、バックアップ先の場所、チーム開発の起点となるのがGitHubです。
「GitHub」というウェブサービスを使えば、Gitを利用して自分の作ったプログラムのソースコードをインターネット上に保存・公開することができます。
※プログラマーの就職活動時など、実力の確認でGitHubアカウントの提出を求められることがありますし、面接でのアピール材料にもなるので、作ったプログラムはなるべくGitHubで公開しておきましょう。
【Gitを使うことで解決すること】
Gitは必要な情報を変更履歴として管理してくれるので、編集したファイルを過去の状態に戻したり、今日一日のどこの編集をしたかを表示する事ができます。
【Gitを使うメリット】
・ファイルを変更する際に、バックアップファイルを作成する必要がない。
・変更する前のファイルの内容にいつでも戻れる為、安心してファイルを変更出来る。
・複数人でファイルを変更したり、共同開発を行うことができる。
などなど...
これらのメリットにより、安心してチーム開発が進められます。
そしてチーム開発に不可欠なものとしてGitHubがあります。
Git及びGitHubはプログラマーには絶対必要となるツールですので、必ず使えるようになっておきましょう。
ここまで簡潔に説明しましたが何より実際に触ってみるのがオススメなので、まずは以下のオススメ学習サイトを参考に学習してみてください。
【オススメの初学者向けGit学習サイト】
★Udemy ノンプログラマーのための Git
https://www.udemy.com/course/git-beginning/?aEightID=s00000016735001&a8=o5a7254SMX8NXuTBhWg5gyBFpyuYTaA0tWgs43RLZslSMXayEXTXi3A5TXuw_wAgKskt8PaBK5a7ds00000016735001
学習形式:動画
たにぐちまことさんが出しているノンプログラマーでもしっかり理解できる初心者でも非常に分かりやすいコースです。
GitのコマンドラインからGitHubの活用方法までを動画で凄く丁寧に教えてくれています。gitだけを学ぶのではなくGitHubも同時に学びつつ実用的なバージョン管理の方法を学べます!
gitとGitHubを同時に学べるのは非常にありがたい一押しの学習サイトです!
★サルでもわかるGit入門
https://backlog.com/ja/git-tutorial/
学習形式:テキスト/イラスト
Git入門としてとても有名なサイトです。
入門編から入ってスムーズに発展編など、もうちょっと上級な事にもストレスなく移れるのでこちらもオススメのサイトです。
★ドットインストール git入門
https://dotinstall.com/lessons/basic_git
学習形式:動画
皆さんご存知ドットインストール。もちろんGitも対応しています。
全22回に分けて動画で分かりやすく説明してくれています。
■■■ SQL ■■■
SQLはデータベースを扱うための言語です。
【データベースとは?】
沢山のデータを一元管理し、データの保存、取得することに特化したソフトウェアです。データベースはデータを永続的に保存するのに適しています。
多くのアプリケーションにとってデータベースは欠かせない存在で、ユーザ登録、メッセージの投稿、例えばTwitterで誰が誰をフォローしているかなどのデータも全てデータベースは管理します。
データベースにはいくつか種類があります。
・MySQL
・SQLite
・SQL Server
・PostgreSQL
などなど....
中でも有料と無料があり、最も利用されているMySQLは無料で特に人気がありますので、どれを勉強すればいいのか分からない方は基本的な機能に変わりはないのでMySQLを学習するのをオススメします。
なぜ駆け出しエンジニア達が入社してデータベース(SQL)を学んどけば良かったと思うかというと、データベースはほとんどのサービスで使われていて、SQLが使われていないWeb系の会社はほとんどないからです。
入社すると必ずと言っていいほど扱うSQL、スクールのカリキュラムにも必ず組み込まれてるSQL、なのに初学者の段階では、それほど注力せずに流してしまう方が多い知識なのです。
とは言えこちらも手を動かして学ぶことが重要です。
【オススメの初学者向けSQL学習サイト】
★PHP+MySQL(MariaDB) Webサーバーサイドプログラミング入門
https://www.udemy.com/course/php7basic/
ぼくはこちらで学びました!
またしても、たにぐちまことさん!
SQLはプログラミング言語と一緒に使うことが多いため、プログラミング言語のPHPと併せて勉強できるこちらのUdemy講座は実践的で圧倒的にオススメです!
PHPの基礎知識とMySQLの基礎が修得でき、最終的にはPHPとデータベースを連携した、Webサービスを開発・カスタマイズできるようになります!
★ドットインストール MySQL入門
https://dotinstall.com/lessons/basic_mysql_v3
MySQLやPostgreSQLの無料入門講座があります。DBの基礎から学ぶなら、まずここを見ておくとイメージがつきやすいです。
★Progate 学習コース SQL I
https://prog-8.com/lessons/sql/study/1
みんな大好きProgate!ProgateでもSQLは学べます!こちらもSQLの入門としてオススメの学習サイトです。
■■■ Linux ■■■
Linuxと言われても初学者の方は分からない方が多いですよね!ぼくも全く分かりません。でした。
【Linuxとは?】
OSの事です。
OSなので種類は違いますがMacやWindowsと同様と考えれます。
MacやWindowsとの違いはLinuxの多くは無料であるという点です。
Linuxは無料なので世界中の誰もが自由に使う事ができます。
サーバというのを聞いた事があると思いますが、そのサーバの多くはLinuxで動いており、Web業界だと大半はLinuxです。
AWSというのもLinuxで動いています。
DockerというのもLinuxの仕組みの一つです。
それくらい何に対しても便利に使えるOSがLinuxです。
Linuxはほぼ全ての会社で使われており、至るところで使われているLinuxですが、未経験の段階で勉強しようとする人はほとんどいません。
※ちなみにLinuxについては独学で学ぶのは難しいから入社してからで良いという声もありました。
ですが現場に入った駆け出しエンジニア達から、
学んでおけば良かったと多くの声が上がりましたのでProgateやドットインストールでかじっておくだけも現場に入った時、大きく変わってきます。
【初学者向けLinux入門学習サイト】
★Progate Command Line 基礎編
https://prog-8.com/languages/commandline
★ドットインストール UNIXコマンド入門 [一般ユーザー編]
https://dotinstall.com/lessons/basic_unix_v2
■■■ Sass ■■■
【Sassとは?】
CSSのメタ言語と呼ばれるCSSを効率よく便利に記述する為の言語です。
Web制作の現場ではCSSをそのまま記述するのではなく、SassのようなCSSのメタ言語と言われるものを使用することが当たり前です。
ある程度CSSの知識を持っていないとSassを使いこなすことはできないので、初心者の方はCSSから覚えていかなければいけないですが、ある程度CSSの知識が付いてきたらSassを習得するのは必須です。
【Sassを使うメリット】
・ コードのメンテナンス性が高まる
・コードの記述量が激減し、コーディングのスピードが爆増します!
などなど...
今ではSassを使っていないWeb制作会社の方が少ないってくらいに使われる言語なので、フロントエンドエンジニアやコーディングを仕事とするなら必ず覚えておかないと、せっかくCSSを学んでいてもコードを読めない、書けないなど仕事にならない可能性があります。
まずは下記のオススメ記事に目を通してProgateで学習してみましょう!
【Sass学習サイト】
★Progate Sass 学習コース Ⅰ
https://prog-8.com/languages/sass
SassコースはCSSを理解しているのが前提なのでHTML/CSSの学習がまだの方は先にそちらを学びましょう!
【Sassに関するオススメ記事2選】
■■■ ショートカットキー・Emmet ■■■
【ショートカットキー】
ショートカットキーをどれだけ使いこなせるかで作業効率は大幅に変わってきます。
現場では当然全員が使っていますし、使って当たり前です。
ショートカットキーに関しては習得するのにタイミングなどないので、もし使っていない初学者の方がいましたら今すぐ使い始めて癖づけていきましょう!
最初は使えと言われてもキーが思い浮かばないと思うので、ショートカット集を見ながら、極力ショートカットを使うように訓練していきましょう。
この積み重ねが大きな差となって現れます。
★Windows ショートカットキー
★Mac ショートカットキー
自分はエディタとしてはVisual Studio Codeを使っているのでVScodeのショートカットキーも下記に載せておきます。
★Visual Studio Code ショートカットキー Windows版
https://qiita.com/TakahiRoyte/items/cdab6fca64da386a690b
★Visual Studio Code ショートカットキー Mac版
https://qiita.com/naru0504/items/99495c4482cd158ddca8
【Emmet】
EmmetとはHTML/CSSの超強力な入力補完プラグインのことです。
コーダーやフロントエンドエンジニアには必須です。
タグの断片を打ってtabキーを押すとタグが展開され、閉じタグも補完してくれるのでミスが減り、作業効率も爆増し、非常に便利です。
EmmetもSassも、もっと楽にコーディングする為にあるものなので、まずは使える部分だけ使っていく、しっかり記憶してから使うのでなく、使いながら覚えていくのがオススメです!そのうち勝手に体に操作が馴染んできます。
【Emmetの使い方】
以上です!
どのようなエンジニアを目指すかでもランキング、注力するべき点は大きく変わってくるかと思います。
他にもCSS設計、セキュリティ、Dockerなども学んでおけば良かったという声がよく上がりました。
また、スクールに通っていた人からよく耳にしたのはスクールのカリキュラムにGit、SQLなんかは必ずあるけど学習を疎かにしがち。
スクールに通ってる人はせっかくスクールで学べるのだからGit、SQLの学習は疎かにせずしっかり学んでおきましょう!との事です。
また、学習サイトについては上記であげたサイト以外にも調べればいくらでも素晴らしい学習サイトや書籍、記事が出てきますので自分にあった学習法で取り組んでみてください。
以上、知っておくだけでも現場に入った時に大きく変わってきまので、是非参考にしていただければ幸いです。