Simple IT Life

IT技術を幅広く入門の入門としてまとめます。simple is the best !!

Netlify Formsを使ってブログサイトにコメント機能を追加する方法を調べたので紹介 Netlify FormsはNetlifyに標準機能として用意されているフォーム機能 サーバレスなので別途コメント用にサーバを用意する必要がなくHTMLを埋め込むだけで準備できる

TypeScriptの入門の入門チートシート 型の種類や使い方についてまとめていくだけでなく、 TypeScriptについてや必要性などについてもまとめることでこのページでTypeScriptをざっくり理解できる程度の内容を目指す

NetlifyのFormsやSplit Testing、Functionsについて使い方をまとめる FormsはNetlifyに標準機能として用意されているフォーム機能でコメント保存用にサーバを用意する必要がない Split TestingはGitHubのブランチをベースにしたA/Bテストを行うための機能のことで、FunctionsはNetlifyでAWS Lambdaを使うことができる

NetlifyとはHTMLなどの静的コンテンツのみで構成されたWebサイトを閲覧できる形で配信するWebサービス GitHubやBitbucket、GitLabなどと連携して使うことができて、リポジトリにプッシュすることで自動でCI/CDを行うことができる、無料枠が豊富で独自ドメインを設定可能

WordPressからJekyll(GitHub Pages)に移行した手順をまとめる。 お金的な事情や使いやすさなどの理由で無料のJekyll+GitHub Pagesに移行した。JekyllとはMarkdown等から静的ページを生成する静的サイトジェネレータ

Scala開発のためにScalaらしさをまとめる 言語設計者の設計思想を元にScalaらしさについてまとめる オブジェクト指向と関数型の融合について

StorybookとはUI開発環境を提供するツール React、React Native、Angular、Vueなどをサポートしている ユーザーは独立した開発環境でコンポーネントを個別に作成して挙動の確認をテストできたり、コンポーネントを一覧にしてカタログ化できるので他の人に紹介する時に使えたりする

フロントエンド開発における状態管理、データフローについて忘備録的にまとめることとする 状態とはアプリケーションが保持するデータのことで データフローとは状態を含むアプリケーションが持つデータの流れのことで 具体的にはどこにデータを保存して、データの読み書きを行う際にどこからどのように行うのかという点を指す

前にDoxygenの入門についてまとめたが実際にサンプルを見た方が理解が早いかと思うのでサンプルを作ってみる サンプルのアプリケーションをGitHubに用意して、ドキュメントもGitHub Pagesで見られるようにしてみた

Trashy.cssを使うとHTMLの構造が可視化されるのでheader,nav,main,article,selction,footerなどの要素が正しく実装されているかを確認することができる 使い方 ブックマークレットが用意されているのでそちらを使って試してみる

Google Cloud Functionsのクイックスタートを入門的に試してみる Cloud FunctionsとはGoogle Cloud Platform内のサービスの一つであるFaaSで登録した関数を実行するためのサービス イベントが発生した場合にそれに応答してオンデマンドで登録した関数を実行することができる

8~9月で育児休暇を頂いたのでジム通いを始めようと奮起をして体作りの1ヶ月半が始まりました。 今回の記事は正しい筋トレの方法を紹介するのではなく、あくまでも自分が1ヶ月半の間ジム通いしてみての失敗や学びを紹介したいと思っています。

Google Cloud Datastore(以下Cloud Datastore)初学者向けに提供されているクイックスタートを試してみる Coogle Cloud Platform Console上でデータを作成して、同じくConsole上で作成したデータをGQLを使って確認するまでの流れを追っている

CSSアニメーションについてまとめる CSSでアニメーションを実装する上でCSS AnimationとCSS Transitionの2種類があるのでそれぞれまとめていく CSSアニメーションのメリットについて 何故CSSでアニメーションを行うのか CSSアニメーションの種類 CSS Animation、CSS Transition

Flexbox(CSS Flexible Box Layout)についてまとめる Flexboxとはボックスの横並びや縦並びが手軽に実装できるレイアウトモジュール 今までだとfloatなどがあったが、cleafixでの解除が必要だったり縦方向の中央揃えが面倒な部分があったが Flexboxだと簡潔に記述ができて、柔軟なレイアウトが実装可能とのこと

ブログを更新した際や新しくサイトを作成したり、サイトに大きな改修を行なった場合は こちらに記載をしたいと思います。

Vue.jsやNuxt.jsで開発をすることになったが 改めて「なんでVue.jsにしたの?」「仮想DOMって?」「SSRって何がいいの?」 など聞かれた時にサラサラと答えられなかったので自分なりにまとめる Vue.jsのトレンドをチェック/Vue.jsのメリット/仮想DOMについて/Nuxt.jsのメリット

Google Fontsに日本語フォントが追加されたらしい これを機にGoogle Fontsについて使い方を調べておく Google FontsとはGoogleが提供しているWebフォントのサイトで WebフォントとはWebから必要なフォントをダウンロードして使うフォント

クリーンアーキテクチャについて調べたことの自分用の備忘録 正直クリーンアーキテクチャ(The Clean Architecture翻訳)を何度読んでもわからなかったので、自分はこうしていこう的なことをずらずらと書いておく コンセプトは関心の分離、ソフトウェアをレイヤーに分けて以下の設計を生み出すこと

SassはCSSを効率的に書くための記法 Sassには2つの記法がある SASS(拡張子は.sass)とSCSS(拡張子は.scss) SASSの方が最初に作られたが、デザイナーに不評だったこともありCSSっぽいSCSSが現在の主流となっているので本記事はSCSSの記法をまとめることとする