はてなブックマーク

Next.jsとは Next.js(ネクストジェーエス)とはSSR(Server Side Rendering)をするアプリケーションのためのJavaScriptフレームワークです。 SSRの実装が簡単に行えるためSSRやりたいけど難しそう…という方にはオススメです。 Next.jsには以下のような特徴があります。 SSRがデフォルトで提供されている ページ読み込みを早くするために自動でコードの分割を行う シンプルなルーティングを実装できる HMRをサポートする開発環境 ExpressなどのNode.jsのHTTPサーバーを実装できる BabelやWebpackとカスタマイズ可能 SSR(Server Side Rendering)とは Reactなどではブラウザなど(Client Side)でJavaScriptが動的にHTMLを生成していましたが、JavaScriptをサーバーサイドで

いつもならRails等でAPI用のサーバーを立てるのですが、PythonでAPIを作りたかったのでFlaskを利用したら信じられないくらい簡単にできました。 とりあえずこんな感じで動くよというのが見たかったので、GETでJSONを返すくらいしか実装はしていません。 本当に5分でできるので、PythonでAPI作ってみたいなという方はこれでぜひ雰囲気だけでも掴んでみてください。 Flaskとは Flaskとは、Pythonのための軽量なウェブアプリケーションフレームワークです。 Pythonで用いられるフレームワークとしてはDjangoなども人気ですが、今回は簡単なAPIを作成するだけだったので、「マイクロフレームワーク」と呼ばれるFlaskが適切かと思います。 小規模〜中規模のWebアプリケーションであれば、Flaskで作成するのが軽量かつ早く作ることができるのでオススメです。 公式サイト

みなさんDockerってご存知ですか？ Docker（ドッカー[2]）はコンテナ型の仮想化環境を提供するオープンソースソフトウェアである[3]。VMware製品などの完全仮想化を行うハイパーバイザ型製品と比べて、ディスク使用量は少なく、仮想環境 (インスタンス) 作成や起動は速く、性能劣化がほとんどないという利点を持つ (Wikipedia) 簡単に言うと、自分のPCの上にもう一個OSを立ち上げて好きな環境を作っちゃおう(しかも軽い)と言う便利なやつです。 https://twitter.com/tatane616/status/991349203329630210 今はReactとかRailsを使って開発しているのですが、Docker使うと色々便利だし、環境壊したらどうしよう…みたいな心配もなくて楽しいなと思ったのでこの記事を書きました。 コンテナとは Dockerはコンテナがどうのこう

React(リアクト)とは、Facebookが開発しているJavaScriptのライブラリでありフロントエンドの開発に大きな影響を与えています。 一般的には学習コストが高いと言われているReactですが、順序よく勉強すれば意外とすんなり理解できるのではないかと思ったため、自分がやってきて良かったなと思うReactの勉強方法をまとめてみようと思います。 ちなみに自分もReact関連の記事をいくつか書いているのでよろしければご覧いただけたらと思います。 Reactの基礎知識【初心者向け】 基本的には上から順に学習していくと効率が良いと思います。 ちなみに書籍は「React開発 現場の教科書」がとてもわかりやすかったです。 React開発 現場の教科書 JavaScript Reactを勉強すると言っても結局はJavaScriptで記述するので、基本的なところは押さえておいたほうが学習を進めやす

Webサイトの構築を考える上で、ブラウザがどのようにしてレンダリングを行なっているかを理解することは重要です。 ブラウザレンダリングの流れを把握することで、自分の書いたCSSやJavaScriptがどのように読み込まれ、解釈されるかが理解できるようになります。 今回は普段デザインやコーディングをするときはなかなか意識しづらいレンダリングエンジンの流れを見ていきます。 レンダリングの流れ ブラウザのレンダリングは上図のような流れで行われます。 Loading, Scripting, Rendering, Paintingの４つの工程からなり、最終的に画面に描画されるまでをフレームと呼びます。 フレーム内の処理を詳しく見るとDownload, Parse, Scripting, Calculate Style, Layout, Paint, Rasterize, Composite Layer