Web系プログラミング– category –

昨年、もっと動きのあるサイトを作れるようになりたくて、アニメーションについて勉強していました。 普段は、ボタンのマウスオーバー、ナビゲーションメニューなど、利便性のためにシンプルな動きを取りいれるくらいです。しかし、そのたびに、基本となる...

この記事では「Local」というソフトを使い、WordPressサイトをローカルPC上で動かす環境を作成していきます。 この記事はこんな方におすすめ WordPressで本格的にテーマ制作、カスタマイズをしたい方今のWordPressサイトをリニューアルするために、本番サ...

Gatsbyで作っているサイトをv3にアップデートしました。 【v2からv3で何が変わったのか】 Introducing Gatsby 3.0 – Faster in Every Way that Matters まず、Incremental Build（差分ビルド）ができるようになり、ビルド時間が短縮された。 記事を追加／...

いつも忘れちゃうので、Node.jsをアップデートする手順をまとめておきます。 1.Homebrew2.nodebrew3.Node.js 上から順にアップデートしていきます。 【1.Homebrewのアップデート】 Homebewはパッケージ管理ツールで、ここからいろんなツールをダウンロード...

今回は、SourcetreeからのSSH接続するように直したので、その手順を記載します 私の環境(2021年8月時点) MacBook Pro (Retina, 13-inch, Mid 2014)MacOS Big Sur (ver 11.7)SourceTree(ver 4.1.2) 【①公開鍵と秘密鍵を作る】 ターミナルを開いて、「ssh-ke...

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

ホームページでよく出てくるパーツ「ハンバーガーメニュー」。 今回は、ハンバーガーメニューの作り方を紹介します。 【ハンバーガーメニューとは】 ハンバーガーメニューとは、スマホなどでのクリックすると開くメニューのこと。この３本線が、ハンバーガ...

Gatsby.jsブログの公開にはNetlifyというホスティングサービスを使います。 NetlifyとGitHubを連携することで、Gatsbyで作ったサイトがWeb上に公開でき、また更新も自動で反映してくれます。 使うもの GitHubNetlify 事前準備として、GitHubとNetlifyのア...

2020年の夏から、ブログをWordPressからGatsbyに変えて一年ほど運用していました。 2021年9月現在は、ブログ自体はWordPressに戻しましたが、ポートフォリオはGatsbyJSで制作しています。 この記事では、はじめてGatsbyJSをブログを完成させるまでの手順を...

HTMLとCSSで、フォームのラジオボタンやチェックボタンの代わりに画像選択にする方法の紹介です。 Before After 【HTMLとCSS】 <div> <input id="image_a" type="radio" value="image_a.jpg" name="image&quo...

Livedoorブログの記事データをWordPressへと移行する際に、いくつか記事データの内容を書き換える必要があります。 記事データの変更点 ①画像のURL旧： https://livedoor.blogimg.jp/ライブドアID/imgs/●/●/新： https://独自ドメイン/wp-content/uploads/...

MySQLデータベースの操作でよく使う基本的なコマンドをまとめました。 -- MySQLのバージョン確認mysql --version まだMySQLをインストールしていない場合MySQLの環境構築 【MySQLサーバーの起動】 -- MySQLサーバースタートmysql.server start [prism clas...