文系プログラミング未経験の学生の勉強の進め方!

こんにちは~、かす(@kasumoto666)です。

プログラミングの言語は決まったけどその後、最初はどうやって勉強を進めればいいかわからないですよね。僕も最初言語をHTML/CSSに決めたはいいけど、この先どうやって勉強していけばいいかとても不安でした。

まだ言語が決まってないという方はこちらを先に読んでみてください!

僕は文系だったので周りにそんな勉強をしている人はいなかったし、誰にも相談できない…。そういう人は結構多いと思うので、そんな人に今回は僕の実体験からアドバイスをしていきたいと思います!

プログラミングどうやって勉強進めればいい?

プログラミングを勉強するのってわからないことだらけで、なにすりゃいいかわからないんですよね。受験勉強とは違うし、周りに教えてくれる先生もそんなにいる訳じゃない。そして何より周りにプログラミングを勉強している人が少ない!

特に文系!そして地方の学生!

でもそれは逆に言えばチャンスです!そこで周りの大学生と差つけてやりましょう!

今回は僕が実際に進めた学習方法をほぼそのまま伝えていきたいと思います。僕は文系のごく普通の大学生なので、それでもある程度は知識を身に付けることができました。なので勉強の進め方がわからないって人は是非参考にして頂ければ幸いです。

まずProgateで基礎知識付ける

まずはProgateで学習を進めましょう。僕は最初の基礎知識はProgateだけで付けました。ちゃんとやればある程度の基礎知識は身につきます。でもここで注意して頂きたいのが、あくまでProgateで身につくのは本当の基礎中の基礎です。

Progateはこちらから

ですのでProgateやったからってプログラミングができるようになるわけでは全くありません。これからたくさんの数え切れないほどの挫折が待っていると思います。そこで折れる人がほとんどなんですが、これを見ている人はなるべく折れないよう頑張りましょう!(笑)

では具体的にどうやってProgateをやっていけばいいかというと、まずはHTML/CSS、javascript(ES5)、jQueryの三つの言語を2~3週しましょう。正直結構大変です。あとProgateは全部の講座を受けるには月額約千円必要です。高いと思う人もいるかもしれませんが、プログラミングスクールや書籍を買うのに比べたら何十倍も安いと思います。

ていうか一回飲み会我慢すれば余裕で払えますよね(笑)てことでそこは自分への投資だと思って払いましょう!

そこで2~3周すれば、ある程度は基礎知識は身につくと思います。ここでも注意が必要です。Progateのやりすぎには気をつけてください。最高でも10周すればもう充分です!すぐに次のステップに行きましょう。

ここがProgateの落とし穴でもあります。Progateって割とゲーム感覚で学習が進められるので自分がすごい成長している気分になるんですけど、錯覚です。これから学習を進めていくと挫折というか、絶望します。ビビらせてごめんなさい(笑)でも自分はそうだったので、ワンクッション挟みました(笑)んじゃ次のステップに行きましょう!

デベロッパーツールを使えるようにしよう!

HTML/CSSを使っていく上でデベロッパーツールを使うのは必須です!デベロッパーツールというのは皆さんが見ているサイトがどのようなHTML/CSSのコードが書かれているかを見るものです。

詳しい解説や、使い方はProgataや、Youtubeなどを見れば大丈夫だと思います。下記リンクはデベロッパーツールの使い方を解説してくれている動画です。とてもわかりやすいのでおすすめです。


これらを見て基本的なデベロッパーツールの使い方を覚えましょう!これらを使いこなせるようになれば、こんなしょうもないこともできます。

このように橋本環奈にフォローされちゃうこともできます。

渡辺直美も。

こんなくだらないことは早々に辞めて時間の無駄なので次のステップに行きましょう!(笑)

サイトを模写する

Progateが終わってデベロッパーツールの使い方も覚えたら、次は既に出来上がって公開されているサイトを模写しましょう!

サイトを見てそのまま真似てコードを書いてみましょう。その時注意して欲しいのが基本的にデベロッパーツールで中身のコードを見ないことです!

最初から見ないで書くなんて無理だよ、って思うと思います。まずそこで絶望して挫折します(笑)いざ中身確認してそのまま書こうと思うと、意味不明なコードがたくさんあってそこでまた絶望すると思います。

僕は最初デベロッパーツールで見ながら、書いてたんですけどめっちゃ無駄なコード多いし、クラス名も意味不明だし、そのまま書いたつもりなのになぜか上手くいかないんですよね。

それで無駄なコードいっぱい書いて、1000行くらい書いて最初からやり直すとかもしてました。マジで辛かったです。僕は本当に不器用で、そういうとこ要領悪いんですよね(笑)それでも頑張ればある程度は成長できます!こんな挫折しょっちゅうです。でもそれでも負けないでください。せっかくここまで来たんですからもったいないです!

なので最初は簡単なサイトから模写を始めましょう!

一番最初にお勧めするのはこのサイトです。wordpress化とかは難しいと思ったら正直まだやらなくても大丈夫です。僕はちょっと難しくてやめました(笑)

とりあえずレッスン2~4くらいを真似てつくってみましょう。最悪答えも書いているので最終手段としてみるのもありでしょう(笑)

それが終わったら次はこれを模写してみましょう。一気に量も増えてわかんないことだらけだと思います(笑)それでも頑張るしかありません。わかんないところはひたすらググる。

「background 背景 表示されない」

「margin 効かない」

とか最初は僕もこんなことからググってました。本当に初歩的なんですけど最初はこんなこともできないんですよね(笑)

「こんだけ勉強してきたのにこんなこともできないのかよ自分…」

「マジでカスだな、何やってもダメだ…」

みたいに病んできます(笑)

でも大丈夫です。1つ1つ慌てず原因探って解決していけば大丈夫です。いつかは解決します。忘れちゃいけないのは、とにかく慌てないことです。慌てるとこんなこともできない!ってなって焦って何から考えればいいかわからなくなって自暴自棄になっちゃいます。というか自分がまさにそうでした(笑)

わからないくてできないのは最初は当たり前です。めげずに頑張りましょう!これが完成したら次は実務を経験していきましょう。次のステップは次回の記事で解説していきます!

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

まとめ

  • Progateで基礎知識付ける!
  • 模写して知識を深める!
  • わからないことだらけで、失敗しても焦らない!

今回は文系プログラミング未経験者の最初の学習の進め方について紹介してきました。いかがだったでしょうか。是非文系出身でこれからプログラミングをはじめようと思っている方は参考にしていただければ幸いです。お互い頑張りましょう!