Category : Programming

Programming

【CSS】Flexboxのプロパティまとめ

Flexboxは、CSSはWebページのレイアウトを設定できるモジュールです。 今回の記事では、Flexboxでよく使うプロパティをまとめました。 Flexboxの使い方 Flexboxを使う時は、整列させたいアイテム(item)をまとめて格納するコンテナ(conteiner…

August 09, 2020
Programming

【CSS】Box-Sizingの使い方

CSSプロパティのBox-sizingの説明です。 Box-sizingはdivやpなどのボックスサイズの計算方法を指定してくれる。 ボックス幅の計算方法 デフォルトのcontent-boxだと、 ボックスの幅=コンテンツ幅(width)+内側の余白(padding…

August 09, 2020
Programming

Flexboxで作るヘッダーのサンプル集

Flexboxは、CSSはWebページのレイアウトを設定できるモジュール。 Flexboxを使うと簡単に整列したり、配置できるようになるので、ヘッダーなどのレイアウトに使われています。 今回の記事では、Flexbox…

July 31, 2020
Programming

CSSとJavaScriptで作るハンバーガーメニュー

ハンバーガーメニューとは スマホなどで、ホームページを表示した時に見える3本線のこと。 この3本線が、ハンバーガーのように見えることから、ハンバーガーメニューと呼ばれています。 クリックすると、メニューが表示されます。 参考サイト:The Virginia…

July 25, 2020
Programming

【Gatsby】ブログのカテゴリー画像を表示させる

ブログ記事にカテゴリーのアイコンを表示させました。 【やりたかったこと】 各記事にはカテゴリーが一つ設定されている 記事一覧にカテゴリー画像を表示する gatsby-imageで画像を表示させたい 【参考記事】 パスを渡せばgatsby-image…

July 18, 2020
Programming

WordPressからGatsby.jsにブログを変えました

ブログをWordPressからGatsbyに変えました。 Gatsbyとは? GatsbyはWebサイトのHTMLファイルを生成してくれるツールです。 静的サイトジェネレーターと呼ばれています WordPressなどのCMSでは、データベースで記事を管理しています。 URL…

July 04, 2020
Programming

【初心者向け】MySQLの基本コマンドまとめ

MySQLデータベースの操作でよく使う基本的なコマンドをまとめました。 まだMySQLをインストールしていない場合 MySQLの環境構築 インストールされているとバージョンが表示されます。 MySQLサーバーの起動 パスワードを入力してEnter…

May 16, 2020
Programming

【gitでバージョン管理】ブランチの使い方とSourcetreeでの操作

バージョン管理では変更履歴を分けて管理できます。(「ブランチ」といいます。) 知っておくと便利!実際どう使うの?🤔を解説します。 バージョン管理でのブランチって何? 個人開発をするときの、ブランチの使い方 Sourcetreeを使ったブランチの作成、切替え、マージ方法 git…

April 11, 2020