プログラミングのイメージ

最新|web制作やプログラミングが学べる無料&有料サイトまとめ

最近ではプログラミング学習の必要性が高まり、それに伴ってプログラミングが学べるサイトや教材も増えてきました。

そこで、web制作やプログラミング学習に役立つおすすめのサイトをまとめました!

ぜひ参考にしてみてください!

natsu
大学時に独学でプログラミング学習をして、あるIT企業で内定をいただきました。学習で利用した教材・サイトを紹介します!

progate(プロゲート)

progate topページ

プログラミング学習の定番です!

イラスト付きスライドで初心者の方にもわかりやすく、自分のペースで学習を進められます。

Web制作やweb開発を学びたい方には基本が学べるので特におすすめです!!

progate course

 

実践問題もあるので、知識0からスタートする人にもかなりおすすめです。

natsu
僕も一番初めはprogateでHTML&CSSやJavcaScriptの勉強をしました!

月額980(税別)ですが、無料で利用できるレッスンもいくつかあります。

Progate

ドットインストール

ドットインストールのイメージ

こちらもプログラミング学習の定番です!

レッスン動画が約3分ごとに分けられているので、空いた時間に少しづつでも進められます。

またレッスンも初心者向けのものから中上級者向けのものもあり、基本だけでなくより深い知識が身につきます。

先生への質問機能もあり、わからないことがあれば現役のエンジニアに質問することもできるのでしっかりと理解できます。

 

プログラミングの基礎的な部分は、progateの方が丁寧でわかりやすく説明している印象でしたがドットインストールの方が実践問題や環境構築などレッスンが豊富にあり、広く学び、力を付けれます。

natsu
僕は初めはprogateで基礎を学んでから、その後ドットインストールに切り替え幅広く学習しました!

料金は月額税込み1080円です。

一部無料で見れるレッスンもあります

ドットインストール

udemy

udemyコース例

udemyは教えたい人が講座を開き、学びたい人が学べるサイトです。

動画を用いて、プログラミングを含めたヨガやビジネス、音楽などさまざまなジャンルを学ぶことができ、わからないことは動画の作成者に質問することもできます!

 

一つの言語に特化した動画や複数の言語を組み合わせて学べるものなどあり、レベルも幅広くそろっていて、基本的なことから実際に開発してみる動画もあり、かなり力が付きます!

また動画も長いものだと40時間、50時間あってボリュームがあります。

 

udemyはアメリカの会社なので、英語のものが多いですが、日本語でもたくさんあります。
英語に自信がある方は海外の動画もチェックしてみるといいかもしれません。

 

natsu
僕はいくつか動画を購入したのですが、一番良かったのはNetflixのクローンを開発する動画です!

英語の教材ですが、JavaScript,PHP,MySQLを使って実際の開発が学べました!

値段はそこそこしますが、かなり頻繁にセールを行っています!

セール時にはだいたい90%offになり,1000円~2500円くらいで買えます!

セールの時を狙って買いましょう!

Udemy公式ページ

techpit

techpitイメージ

techpitは実際に開発をしながらプログラミングを学ぶ学習サイトです。

現役のエンジニアの方が作成したテキストを読みながら開発を進めていきます。

よく知っているサービスのクローンを作る教材が多いので開発していて楽しいんじゃないかと思います!

techpitの教材

LaravelやReact,Vue,Ruby on Railsのようなフレームワークを使ったものが多くあり、中上級者向けのサイトです。

natsu
僕はLaravelを使って、instagramのようなサービスをたくさん開発しました!とても力がついたと思います。

お値段は教材ごとに決まっていて、1000円から3000円くらいです。

月額3000円で学びたい放題プランにすることもできます。

すべてではないですが、いろいろな教材を好きなだけ利用できるようになります!

techpit

アールエフェクト

REFECT TOP画面

REFECTでは、プログラミングに関する記事を無料で読むことができます!

主にJavaScriptやPHPやそれらのフレームワークなどweb系のものが多くあり、理解を深めたい方にはおすすめです。

これさえ読めば参考書を買わなくてもいいかもしれません!!

アールエフェクト

ELOOP(イーループ)

ELOOPメイン画像

ELOOPでは50以上の実践問題を通してプログラミングを学習できます。

この記事を書いている現在ではJavaScript,Vue.js,Pythonの課題があります。

さらに問題だけでなく、参考記事で基礎知識を身につけることもできます。

ELOOP コースの例

無料会員でも事前講義を受けれますが、有料会員になると実践課題と自動添削によるフィードバックも利用できます。

有料会員は月額3980円です。

 

実際に手を動かして学びたい方におすすめです!

ELOOP

スポンサーリンク

その他、学習に役立つサイト!

Qiita

Qiitaの画像

Qiitaは、画像にもある通りプログラミングに関する知識を記録・共有するためのサービスです。

これからエンジニアを目指すならたくさん目にすると思います。

自分と同じ間違いやエラーにつまづいた人の解決策など読めたり、ある技術についてまとめてあったりするのでいろいろな記事を読んでみるといいと思います

また自分が学習していく中で新しく分かったことやよく間違えることなどを記録しておくのもいいかと思います。

Qiita

teratail(テラテイル)

teratailではプログラミングに関する疑問を何でも質問することができます

疑問をシェアして、他の人に手助けしてもらうことができます。

学習して分からないことがあればぜひ利用してみましょう!

teratail

公式ドキュメント

JavaScriptの公式ドキュメント

JavaScriptやPHPなどプログラミング言語には公式ドキュメントが用意されています。

またフレームワークも公式ドキュメントがあり、一度読んでみるとかなり勉強になると思います!

YouTube

YouTubeにもプログラミングの学習に使える動画がたくさんあります。

開発方法や勉強方法まであるので、時間があるときに見てみるのもいいかもしれません。

 

僕もいくつかのプログラミング関連のチャンネルを登録して、学習しています!

中でもおすすめはともすたチャンネルです!web系の言語やフレームワークなどの入門的なことをわかりやすく解説しています!

natsu

 

また日本語より英語の方が動画が充実しています。

英語が得意な方は海外の動画で勉強してみるのもいいかもしれません!

おすすめはFreeCodeCampというチャンネル。

さまざまな言語やフレームワークの動画が基本的なことから中上級レベルまであり、かなり勉強になります

Raise Tech

RaiseTech(レイズテック)は最速で「稼げる」エンジニアになるための、実践的なWebエンジニアリングスクールです。

WordPressのコースやAWS、Javaのコースが用意されています。

講義で学び力を付けるのではなく、講義を聞き課題を通して力を付けていくスタイルです。

Slackで現役エンジニアに好きなだけどんなことでも質問できるので、安心して続けられると思います。

WordPressコース、Web制作に興味のある方はこちらの記事も読んでみてください!

RaiseTechのロゴ
参考RaiseTechを実際に受講してみた感想・体験談!|レイズテック・WordPress副業コース

続きを見る

まとめ

今の時代さまざまな学習材料が充実していますね!

たくさん利用して力を付けていきましょう!

1人で学習が不安な方はプログラミングスクールを利用してみるのもいいかもしれません!

先ほど紹介したRaise TechTECH::CAMP がおすすめです!

TECH::CAMPでは受講期間中はいつでもメンター(講師)に質問ができ、1人1人の目的達成のためにトレーナーが徹底的にサポートします。

またトレーナーと定期的に面談を行い、適切な学習内容や学習計画をアドバイス、トレーナーがマンツーマンで最適な学習プランを提案してくれます。

最新のテクノロジースキルが学べる環境を用意しているため、身につけたいスキルに合わせて学習を進めることができます!

なので、学習効率を上げたい方にもおすすめです!

プログラミングのイメージ

2020/10/18

最新|web制作やプログラミングが学べる無料&有料サイトまとめ

最近ではプログラミング学習の必要性が高まり、それに伴ってプログラミングが学べるサイトや教材も増えてきました。 そこで、web制作やプログラミング学習に役立つおすすめのサイトをまとめました! ぜひ参考にしてみてください! natsu大学時に独学でプログラミング学習をして、あるIT企業で内定をいただきました。学習で利用した教材・サイトを紹介します! 目次progate(プロゲート)ドットインストールudemytechpitアールエフェクトELOOP(イーループ)その他、学習に役立つサイト!Qiitaterat ...

ReadMore

RaiseTechのロゴ

2020/8/26

RaiseTechを実際に受講してみた感想・体験談!|レイズテック・WordPress副業コース

最速で「稼げる」プロを目指すエンジニアリングスクール RaiseTech(レイズテック)の受講したので、特徴や感想をまとめました。 natsu筆者です!今回僕は、「WordPress副業コース」を受講しました! 目次RaiseTech(レイズテック)ってどんなスクール??どんなコースがある?AWSフルコースAWS自動化コースJavaフルコースJavaフレームワークコースWordPress副業コース実際にWordPress副業コースを受講してみた!RaiseTechで受講をしようと思った理由は?いいとこ・悪 ...

ReadMore

Laravel ロゴ

2020/8/26

Laravelの特長や機能、勉強法など基本的なことをまとめてみた。

人気のフレームワーク「Laravel」について自分の勉強のためにも、どういうものなのか、どんな機能なのか、フォルダなど基本的な部分をまとめました。 詳しい操作方法は記述していませんが、こういうものなんだなっていうのがわかれば幸いです。 目次LaravelとはLaravelの特長ディレクトリ構造と役割についてMVCとはマイグレーションとはEloquent(エロクアント) ORMとModel(モデル)Routeルーテイングとはcontroller(コントローラー)とはBladeとはSeederとは勉強するには ...

ReadMore

database image

2020/8/22

初心者向け!SQLでデータベース操作のための基本的な書き方まとめ

  SQLはデータベース言語の一つで、データベースの定義や操作を行うことができます。 この記事ではSQLの基本的な使い方をまとめました。 目次SQL、データベースとはテーブルの作成SELECT文WHEREINSERTUPDATEDELETEORDER BY と GROUP BY制約勉強するには SQL、データベースとは 大量のデータを保存し、コンピューターからアクセスできるようにしたデータの集まりをデータベースと言い、DBと略します。   このデータベースを管理するシステムをデータベー ...

ReadMore

プログラミングイメージ

2020/8/10

JavaScriptで配列をシャッフルするフィッシャー・イェーツ

JavaScriptで配列をシャッフルさせるフィッシャー・イェーツのシャッフルについてです。 フィッシャー・イェーツのシャッフル フィッシャー・イェーツのシャッフルは、有限集合からランダムな順列を生成する方法です。 ロナルド・フィッシャーおよびフランク・イェーツの名前から名づけられました。 wikipedia フィッシャー–イェーツのシャッフル   簡単に言うと、配列から数字をランダムに一つ取り出し、取り出した順に並び替えて行く方法です。 ランダムに取り出していき並びなおすので、並び方をシャッフ ...

ReadMore

パソコン作業のイメージ

2020/8/4

IT系の就職にレバテックルーキーってどう?大学生が利用した感想!

新卒学生向けのサービス、レバッテクルーキーをご存知でしょうか? 新卒ITエンジニア専門の就職エージェントのサービスです!   IT系の就職を完全に無料で相談し、サポートしてもらうことができます!   natsu初めまして、筆者です! IT系での就職を目指している中、レバテックルーキーを利用させていただきました! IT系の就職を考えている方、悩んでいる方、ぜひこの記事を読んでみてください! 目次レバテックルーキーってどう?ほんとにIT系に就職できるの?サービスの内容は?サービス利用の流れ ...

ReadMore

teacher's pet

2020/8/1

teacher's pet|英語表現を覚える

teacher's petってどんな意味?? 「teacher's pet」 先生のお気に入り   直訳すると「教師のペット」という意味なので、先生にいいように使われる生徒のようなイメージかもしれませんが、そういった意味ではなく先生に気に入られた生徒を指します。 学校でよく使われる言葉で、成績が優秀だったり、問題を起こさなかったり、先生の言うことを素直に聞く生徒です。   ペットのように可愛がられるというニュアンスもありますが、先生に媚を売ってペットのように接しているという軽蔑的なニュ ...

ReadMore

2020/7/29

broaden one's horizons|英語表現を覚える

broaden one's horizonsってどんな意味?? 「broaden one's horizons」 視野を広げる   「broaden」は広げるの意味。 「horizon」は地平線とか水平線という意味ですが、複数形だと視野とか範囲の意味があるみたいです。 one'sのところには誰のかという単語が来るので、myを入れれば自分の視野を広げる意味になります。   例文:Learning culture broadens your horizons. (文化を知ると視野が広がる) ...

ReadMore

2020/7/27

back to square one|英語表現を覚える!

back to square oneってどんな意味?? 「back to square one」 振出しに戻る、最初から という意味があります。英語での意味も「to start again」と書いてあるのを見ました。   スゴロクなどでスタート地点の四角いマスからきています。 水の泡になるという風にも使えると思います。(水の泡になる → はじめからやり直し)   例文: I have to be back to square one and take same class again ...

ReadMore

no image

2020/7/27

catch off guard|英語表現を覚える!

catch (someone) off guard はどんな意味?? catch (someone) off guard には「不意を突く」という意味があります。   off guardが油断しているという意味で guard(ガード)がoff(オフ)のところを捕まえる と覚えたら覚えやすいかもしれません。   例文: I was caught off guard  when my boss suddenly asked me.  (私の上司が突然尋ねてきて、不意を突かれた) &nbsp ...

ReadMore

© 2020 FW ~FREEWALK~ Powered by AFFINGER5