PythonしかできないけどFlask使ってWebアプリを作りたい人へ


##対象
- Webアプリ作ったことない人
- pythonしかできない人

など


Flaskの入門記事は数多くあれど、それ以前に何をやればいいのかが分からないと言った人向けです。

##前置き
python覚えたしWebアプリを作ってみたい、なんて思うこともあるかと思います。
私自身もそうで、チュートリアルサイトや記事を色々読んではみたものの、
動くものは作れるけど、よく分からないままコードを書いている状態になっていました。


そこでWebアプリをきちんと作れるようになるまでの学習方法を書いておきたいと思います。

##結論
- [ProgateのHTML&CSS](https://prog-8.com/languages/html)
- [ProgateのRuby](https://prog-8.com/languages/ruby) 
- [ProgateのRuby on Rails5](https://prog-8.com/languages/rails5)

をやってみましょう！
ということだけです。
Flask全然関係ないじゃんって感じですよね。
しかし、これらをやることがWebアプリの基本を学べて、
FlaskでWebアプリを作れるようになる良い方法であると思っています。

もう少し詳しく解説していきます。

##Progateとは

[Progate](https://prog-8.com)にある通り
イラスト中心のスライドを見ながら、実際にコードを書いて学習できるサービスです。
メリットは
- 自分のペースで進められる
- 音を出さない環境でも学習可能
- 実際にコードをかいて動かせる
- 環境を整えなくてもWeb上で全てできる

といったことが挙げられます。
無料でできる部分もあるので、触ったことない方がいたら、見てみることをオススメします！

また、課金するなら月額980円ですが、上で挙げたものをするだけなら
(おそらく)1ヶ月もかからないと思うので、終わったら有料会員を辞めれば980円だけですむので
1000円くらいなら……と考えられるのであればオススメです。

##HTML&CSS
Webアプリを作るには必須です！
全く知らない方や、ほとんど使ったことない方はまずはこれから始めることをおすすめします。

##Ruby
これはpythonでWebアプリを作る分には関係ないですが、次のRuby on Rails5をスムーズにこなすためにやっておいた方がいいかと思います。
でも必須ではないので、時間がなかったら飛ばしてみるのもありかもしれません。

ただpythonに似ている部分もあるので、割と取っ付きやすいかと思います。

##Ruby on Rails5
大本命のレッスンです。
ルーティングやGET、POST、データベースなどWebアプリで必要になる知識がつまっています。
実際にRailsというフレームワークを使いSNSアプリを作っていくため、
できていく過程も面白いので継続して学習しやすいと思います。
このレッスンを終わらせることで、Flaskの入門記事やチュートリアルが非常に取っ付きやすくなると思います！
ぜひ最後までやってみてください！

##その後について
Flaskを使う第一歩として
[ウェブアプリケーションフレームワーク Flask を使ってみる](https://qiita.com/ynakayama/items/2cc0b1d3cf1a2da612e4)
こちらの記事がおすすめです。素晴らしい記事です！

またFlaskにおいてhtmlで変数を使うにはJinja2というテンプレートエンジンを使用するため
[Jinja2の使い方がわかるとFlaskを用いた開発がよりスマートになる](https://qiita.com/bookun/items/7ae5de21307d101b4759)
こちらの記事を参考にしてみてください。分かりやすくまとまっています。
また、やりたいこと+Jinja2をキーワードを含めてググるなどをするといいかと思われます。

またWebページを動的に変えたい場合は
[ProgateのJavaScriptレッスン](https://prog-8.com/languages/es6)
を学習してみることをおすすめします。
しかし、このレッスンはほとんど文法的なことがメインなため
やりたいことをその都度、検索してみるといいかもしれません。

もしくはVue.jsというフレームワークが簡単で色々できるため
[動かして学ぶ！Vue.js開発入門](https://www.amazon.co.jp/dp/4798158925/ref=asc_df_47981589252610612/?tag=jpgo-22&creative=9303&creativeASIN=4798158925&linkCode=df0&hvadid=295704876452&hvpos=1o3&hvnetw=g&hvrand=10285134303380352302&hvpone=&hvptwo=&hvqmt=&hvdev=c&hvdvcmdl=&hvlocint=&hvlocphy=1009752&hvtargid=pla-585480928978&th=1&psc=1)
という書籍を読むのもいいかと。

実際にどう使うのかを交えながら解説しているため、
アイデアが浮かぶかもしれません。

またデータベースを扱いたいと言った場合は
[Pythonでsqlite](https://qiita.com/mas9612/items/a881e9f14d20ee1c0703)
こちらの記事などが分かりやすかったです。

後はHTML&CSSのデザインで
[HTML5 & CSS3 デザインレシピ集](https://www.amazon.co.jp/dp/4774187801/ref=asc_df_47741878012610612/?tag=jpgo-22&creative=9303&creativeASIN=4774187801&linkCode=df0&hvadid=295686767484&hvpos=1o4&hvnetw=g&hvrand=4927680676003275227&hvpone=&hvptwo=&hvqmt=&hvdev=c&hvdvcmdl=&hvlocint=&hvlocphy=1009752&hvtargid=pla-526446136785&th=1&psc=1)
などの書籍を見たり、色々と検索してみることもオススメします。

またフラットデザインというデザインスタイル
[いまさら聞けないフラットデザインの真実。Webデザインは、デザインとエンジニアがコラボして進化する。](https://webbu.jp/flatdesign-2762)
など読んでみたり、

デザインの色のサンプルが投稿されている
[ColorHunt](https://colorhunt.co)
などを覗いてみるのもいいかもしれませんね。

##何を作ったらいいのか分からない方へ
Webアプリを作って見たいけど、何を作っていいのか分からないという方は
Ruby on Rails5のレッスンで作ったSNS風アプリをFlaskとpythonで実装してみてください。

そこに独自機能を加えて見たり、カスタマイズしていくことで更に楽しく開発できるはずです！
(私はHTML5のCanvas機能を使ってお絵描き投稿SNS風を作って見ました)

そして、見よう見真似で作っていくうちにアイデアが浮んだり、
こんなものが作りたいと思うかもしれません。

実際に動かしながらつくることは非常に大事なので、
ぜひチャレンジしてみてください！

##終わりに
ここまで読んでくださってありがとうございます！
肩透かしでしょうもない記事かもしれませんが、
誰かのお役に立てれば幸いです。

(間違っていたり、もっといい方法や書き方があれば教えてください！)