【2021年版】おすすめUdemy教材7選（フロントエンドエンジニア）

#はじめに
こんにちは、都内でフロントエンドを主に担当しているジュニアエンジニアです。
2021年4月からエンジニアに転身したのですが、プログラミングの学習をしていく中でUdemyには本当に助けてもらいました。

そのUdemyさんがブラックフライデーセールを行っていたため、いい機会なので自分の今までやってきた勉強の棚卸しを込みでフロントエンド周辺の学習教材をいくつか紹介できないかと思い執筆しております。

全18コースを購入しており、その中から厳選して7つ紹介させていただきます。

ブラックフライデーセールは11月19日（金）～11月26日（金）
サイバーセールは11月29日（月）〜12月1日（水）

で開催するようなので、この機会に是非Udemyの動画教材を検討ください！
※こちらの記事は企業案件ではありません

#紹介方法
紹介方法のフォーマットは以下に統一して記載します。
金額は記載しませんが、セール期間中であれば1,200円〜2,000円で1コース購入することができます。
比較的安価という点と価格差が少ないので金額紹介は省いてます。

1.教材名
2.使用言語 or ツール等
3.難易度（初級・中級・上級）
4.おすすめポイントやどういう人向けか（個人的な感想に近い）

では参りましょう。

#【１】[【JS】ガチで学びたい人のためのJavaScriptメカニズム](https://www.udemy.com/share/103jls3@rs6VC5tUaztbHVa40WuO_YKQUJS00iCJBO1T79abXeKAAlyAyjZiVqhGeemVVvKgrQ==/)

###使用言語 or ツール等
JavaScript/Vue.js

###難易度（初級・中級・上級）
中級〜上級

###おすすめポイントやどういう人向けか
とりあえずフロントエンドを目指す方や、初めてフロントの言語を触る方にはおすすめできます。
JavaScriptの前にマークアップ言語の知識があったほうがより理解が深まります。

JavaScriptの使用頻度の高い書き方・関数の紹介やES６までサポートしたコースとなっています。
包括的に学びたい人、深く学びたい人どちらも対応した教材です。
それ故に全動画の総再生時間は２０時間を超えるため、ボリュームたっぷりです。

正直１回の視聴では、網羅できないような難しい内容もカバーしているため、自分のレベルに合わせて視聴する内容を変えるのをおすすめします。


#【２】[WordPress開発マスター講座](https://www.udemy.com/share/103DTr3@Yhnnv_2wBScaUoFdmXIFBIBb90aMhLEDHH396Zbcy5AANy0B_PQJoSn3mEhiqr_MWA==/)

###使用言語 or ツール等
html/css/php

###難易度（初級・中級・上級）
初級

###おすすめポイントやどういう人向けか
Web制作で副業を始めたい方や、業務でWordPressを利用するならこの講座をおすすめします。
なんと言ってもわかりやすい。これに尽きる講座です。

WordPressの開発環境からスタートする講座なので、一度もWordPressを触ったことがない方でも理解しやすい内容になっています。
最終的には、おしゃれなサイトまでテンプレートテーマを利用せず作り上げることができます。
後半には、WordPress内で利用できる関数の紹介があり、実際に一緒に手を動かしながら学べます。

これ一本でWordPressの内容はカバーできると思うので、買いです。

#【3】[Git：もう怖くないGit！チーム開発で必要なGitを完全マスター](https://www.udemy.com/share/1021OE3@_9sztORgdsgKutZzbxp18ftkCfDVCeHqbHmQPMuIGGk9eMthiWgaMl1s-c7WTAyblw==/)

###使用言語 or ツール等
Git/GitHub

###難易度（初級・中級・上級）
初級

###おすすめポイントやどういう人向けか
開発を生業にするもしくは、生業にする予定のエンジニア諸君はこの講座の受講をおすすめします。
エンジニア界隈で圧倒的シェアを誇るGitを最低限使えるレベルにしてくれます。

pull? rebase?
ってよくわからんけどコマンド使ってんな。っていう人にはうってつけでしょう。
内部でどういった処理が走っているのかが丁寧に図で紹介してくれるのでわかりやすいです。


#【４】[webpack 最速入門　〜実践でも利用できるフロントエンド開発環境を構築する方法を最短で学ぶ〜](https://www.udemy.com/share/103A7A3@acyNyP8F_eRYX9-dYL--TkqskDg9128oO7K4X2oDFWlfcQkj5B8kx0Vm_nlVZdRGfw==/)

###使用言語 or ツール等
webpack(Lint/Prettier/babel等)

###難易度（初級・中級・上級）
中級

###おすすめポイントやどういう人向けか
すでに開発業務に携わっており、開発環境構築について興味がある方であればおすすめします。

昨今のフロントエンドだと、HTML/css/JSができればOKではなく、その周辺のツールを使いこなす必要があります。
特にwebpackは開発環境として利用頻度が高く、今後も変わらないトレンドだと僕は思っています。

このコースはwebpackを軸に、Lintやbabelなども学ぶことが可能です。
ハンズオンで実際に開発環境構築を講師の方と進めていく講座になっております。
ひとつひとつ丁寧に説明を挟んでくれるので、よくわからず利用していた方に対しても良い教材だと思います。


#【5】[【Vue.js2&Vue.js3対応】基礎から【Vuetify】を使った応用まで！ 超初心者から最短距離でレベルアップ](https://www.udemy.com/share/103BFi3@gzZy3oekEnm4oz8E-wVurnfpMHafWAXe2VYAi1j9VKVyef4wD1wNsNrG_sa6VYW3rg==/)

###使用言語 or ツール等
Vue.js（２〜３カバー）

###難易度（初級・中級・上級）
中級

###おすすめポイントやどういう人向けか
フロントエンド開発において、2大巨頭となっているReactとVueですが、こちらの講座ではそのVueを網羅的に学ぶことが可能です。
現在（2021年11月22日時点）でもVue３の内容を更新してくれている点にとても好感が持てます。

この講座では、Vue.jsの基礎から最新のVue3の実装まで幅広く紹介してくれています。
僕は何度この講座に助けられたかわからないです。

丁寧な資料×ハンズオンですすめることができる内容になっているので、Vueのことを全く知らない方でも挑戦することが可能かなと思います。
また、Vue.jsと親和性が高いVue　Router/Vuex/Vuetifyも紹介してくれているので、Vue.jsの全体図を掴むことが可能になっています。

注意が必要なのが、HTML/css/JSの知識がある前提での講座なのでプログラミング初学者にはおすすめできない講座になります。

#【６】[Nuxt.js入門決定版！Vue.jsのフレームワークNuxt.jsの基本からFirebaseと連携したSPAの開発まで](https://www.udemy.com/share/101A4W3@Z2D7wHU2JGWQXTGBPBAfI7_0dSuronzD20UihITAlQrYN88rbIM-F15pSYykf3VJGA==/)

###使用言語 or ツール等
Vue.js/Nuxt.js

###難易度（初級・中級・上級）
中級

###おすすめポイントやどういう人向けか
Vue.jsのフレームワークであるNuxt.jsを簡単にわかりやすく学べる講座です。
業務でNuxt.jsを利用する予定があるのであればこちらの講座は必須ではないでしょうか！！

講座内では、Vue Routerを利用したルーティング設定、Vuexストアを使用した状態管理、非同期通信、アセットの取り扱いをカバーしており、ハンズオン形式でTODOアプリ開発をすることが可能です。

ちなみに筆者のプロフィールサイトはこちらの口座を参考に作成しています。
[プロフィールサイトはこちら](https://hiroyukihp.com/)

注意点としては、パブリックベータ版が公開しているNuxt３はカバーできていないです。


#【７】[AWSで作るWEBアプリケーション 実践講座](https://www.udemy.com/share/103GNi3@36YlBVh5G2gBIJ6iMad_3yZ984MYxY7SdchreKBRF5kIVR7jhM8CpxQhpDNoxZcvIw==/)

###使用言語 or ツール等
AWS/Node.js/MySQL

###難易度（初級・中級・上級）
上級

###おすすめポイントやどういう人向けか
現在進めている講座なので完全には受講しきれていないですが、良講座だったので紹介させてください。
サーバーレスアプリ作ってみたい！！って思い受講しました。

AWS初心者対して実務業務さながらの進め方を紹介してくれている講座です。
内容も図解が多くわかりやすいです。
コースごとにAWSのどこを今いじっているのかを説明しながら進めてくれるので、初心者には嬉しいです。

フロントエンドエンジニアとしての教養として受講してみるのもありかなと思います。
実際にEC2やS3を利用しながら、簡単なECサイトを構築することが可能です。
ハンズオンで一緒に勧めていくので、ミスなく進められます。

注意点としては、AWS契約の費用が発生します。（１，０００〜２，０００円ほど）
講座のはじめに案内もあります。

#最後に
以上Udemy講座７選でした。
今後の学習に役立てていただけたら幸いです。

ありがとうございました！