BETA

プログラミング学習におすすめな良記事15選(html/python/vue.js)

投稿日:2018-11-21
最終更新:2018-11-21
※この記事は外部サイト(https://qiita.com/hideki_climax/items/afd3...)からのクロス投稿です

こんにちは、小林です。今回は、最近よく見る記事を紹介していこうと思います。最近は主にhtml/css、python、Vue.jsを扱うので、その記事をまとめてみました。

  1. html/css
  2. python
  3. Vue.js

html/css

emmet

・HTML/CSSを爆速コーディング Emmet入門 https://blogs.adobe.com/creativestation/serialization/web-learning-emmet

こちらはAdobeの連載記事で、htmlの省略記法であるemmetについて導入から応用まで細かく書かれています。記事内ではBracketsとDreamweaverへの導入が解説されています。

flexboxチートシート

・日本語対応!CSS Flexboxのチートシートを作ったので配布します | Webクリエイターボックス https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet

こちらはcssのdisplay: flex;まわりに関するチートシートです。日本語なのが非常に嬉しいところ。要素の位置調整に困ったら見に行くと大抵解決します。

Grid Layout

・CSS Grid Layout を極める!(基礎編) https://qiita.com/kura07/items/e633b35e33e43240d363 ・CSS Grid Layout を極める!(場面別編) https://qiita.com/kura07/items/486c19045aab8090d6d9

最近僕のtwitterでもちょくちょく紹介しているdisplay: grid;ですが、この記事のおかげでかなり理解できました。解説が非常に深く、ほとんどチートシートと言っても良いレベルの情報量。特に場面別編は「こんな風にしたい」と考えたものが大抵載っているのでかなりありがたいです。Grid Layoutに触れるなら必ず一度は読むべき記事です。

・A Complete Guide to Grid https://css-tricks.com/snippets/css/complete-guide-grid/

こっちは英語のチートシート。gridでどうしても困ったらこれ。

Less

・Features In-Depth | Less.js http://lesscss.org/features/

cssプリプロセッサの中でも代表的なLessの公式ページ。Sassの方が人気のようですが、Mixinの書き方が便利なのでLessも捨てたもんじゃないですよ。で、Lessの場合は公式リファレンスが充実しているので、下手にググるよりよっぽどわかりやすかったりします。Lessに触れるなら一度は読んでみましょう。

Python

Django

・[Python] Djangoチュートリアル - 汎用業務Webアプリを最速で作る https://qiita.com/okoppe8/items/54eb105c9c94c0960f14#%E4%BD%9C%E6%A5%AD%E6%A6%82%E8%A6%81

個人的にDjangoは公式のリファレンスなどが読みにくかったりで勉強しにくいと感じています。なので、とりあえず何か作ってみて挙動を確かめるのがおすすめですが、こちらの記事はチュートリアル系の中でも完成品のレベルが高めで達成感も良い感じです。

・naritoブログ https://narito.ninja/

naritoさんという方が運営されている個人ブログです。内容が充実していて、ほとんどリファレンスのように使わせていただいています。ただ、レベルも高いので初学者には向かないかも。上のチュートリアルをクリアしてから読むのがちょうどいい感じですかね。ちなみに最近旧ブログ(https://torina.top/) から移行されたため、過去記事の大半は旧ブログにあります。そちらも合わせて読んでみては。

Tweepy

・【Twitter】Pythonで勝手にファボ(いいね)とフォローをしてくれる自動化ツールを作ったのでサンプルコードを公開 https://www.torikun.com/entry/twitter-python-follow-favorite

pythonからtwtterを操作するためのライブラリ、Tweepyを使ったサンプルアプリの紹介です。こうもあっさりtwitterを自動化できるのかと感銘を受けた記事。pythonにあまり触れたことがなくても読めるように簡単に書かれています。

・Pythonメモ: Tweepyのややこしいレスポンスデータの読み方 Twitter API活用の最初の難関 https://www.statsbeginner.net/entry/2017/02/12/231400

こちらはちょっと上級者向け。Tweepyで取得してきたデータの読み方が細かく説明されています。自動化ツールのカスタマイズには不可欠なので、先へ進みたい方は必読です。

・Tweepyのgithubページ https://github.com/tweepy/tweepy/blob/master/tweepy/api.py

公式のgitです。公式APIリファレンスもあるんですが、情報があまり更新されていないようで、古いままの部分が一部あリます。ソースをみた方が適切な情報が見られるので、困ったらこちらを読むのがおすすめ。

Vue.js

・Hypertext Candy https://www.hypertextcandy.com/vuejs-introduction-el-data

個人ブログですが、Vueの入門にはかなりおすすめです。最低限の理解はこのブログの入門記事を読めばOKかなと個人的には思います。Vue.js以外にも色々あるので、興味ある方はチェックですね。

・基礎から学ぶ Vue.js 書籍用サポートページ https://cr-vue.mio3io.com/

チュートリアルのページでいくつかのサンプルが紹介されています。書籍もおすすめですが、このサポートページの充実さが個人的にポイントが非常に高いです。基礎を学んだらここのサンプルに取り組んで見ましょう。

・【Firebase】Vue.jsで作ったWebアプリを公開する方法を解説【初心者向け】 https://public-constructor.com/firebase-hosting-vuejs-for-beginners/

上述のサポートページにfirebaseを用いたチャットのサンプルがありますが、firebaseについての説明が若干難しかったのでこちらも合わせて読むと良いです。

・Vue.js + axios + Vue Routerで作る!シンプルなSPAの作り方 https://public-constructor.com/how-to-create-spa-with-vue/

せっかくVue.jsを学ぶなら、SPA(シングルページアプリケーション)は作れるようになっておきたいところ。シンプルなSPAを作りながら学べるので、まずはこの記事から始めてみましょう。

まとめ

いかがでしたでしょうか。個人的にエンジニアのスキルの一つには"検索力"があると思っています。自分の求める情報を適切に検索できないと技術の進歩に追いつけないです。 この記事が皆さんのスキルアップの手助けになれば幸いです。

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

@6G7WDXQG9RTzqqm2の技術ブログ

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる
技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
or 外部アカウントではじめる
10秒で技術ブログが作れます!