🔰はじめての方へ

プログラム

PHP

迷惑メールに入ってしまう解決に使った「Resend」の設定方法|DNS・APIキー・PHPでの送信までまとめました

仕事で作っているLPのお問い合わせフォームで、送信テストをするたびにメールが迷惑メールフォルダに入ってしまいました。何度送り直しても結果は同じ…そこで、メール送信サービスのResend(リセンド)を使うことにしました。とはいっても、私は設定...
PHP

メール設定で出てくるSPF・DKIM・DMARC・ARCとは?MXレコードとの違いもやさしく解説

メール設定で出てくるSPF・DKIM・DMARC・MXの意味を、初学者の私が調べた内容をもとに郵便のたとえで整理しました。それぞれの役割の違いや、Gmailの送信者ガイドラインとの関係もまとめています。
CSS

ハンバーガーメニューの作り方とスクロール対応|CSSだけで作るチェックボックス方式

ハンバーガーメニューを開いても中身がスクロールできないときの原因と、CSSでの直し方をまとめました。チェックボックス方式の基本コードと、dvh・overflow・overscroll-behaviorなど1行ずつの意味を解説しています。
PHP

PHPファイルの権限(パーミッション)644・フォルダ700って何?ターミナルのls -alで見るパーミッション入門

サイト制作中に指摘された「PHPは644、フォルダは700」の意味がわからなかったので調べてまとめました。パーミッションの数字の意味、ターミナルのls -alでの見方、サーバー側での変更方法を初心者目線で解説します。
CSS

CSSで日本語の改行位置を指定する方法|word-break: keep-all、<wbr>タグ、inline-block、nowrap、auto-phrase、text-wrap: balance

HTML・CSSで日本語テキストの折り返し位置を指定する方法をまとめました。私が使ったword-break: keep-allとwbrの組み合わせのほか、br・inline-block・nowrap・auto-phrase・text-wrap: balanceも紹介します。
HTML

作ったHTMLをスマホで使いたい人へ。Vercelで無料公開する手順をまとめました

作ったHTMLファイルをスマホで使いたくて、Vercelで公開してみました。Vercelとは何かという説明から、フォルダの作り方、ターミナルでのコマンド、URLが発行されるまでの流れを実際の画面の順番どおりにまとめています。
AI

データベースを使うPHPサイトをローカルで確認したい。DockerでNginx環境を作る方法【コード全部あり】

Web制作の勉強中に、データベースを使うPHPサイトをローカルで確認する方法がわからず困りました。DockerでNginx・PHP-FPM・MySQL・phpMyAdminの環境を作った手順を、各ファイルのコードごと初心者目線でまとめています。
AI

データベースが怖かった私が、PHPのファイル構成を理解するまで【コード例つき】

Web制作の勉強をしていて、ずっと避けていたものがあります。データベースです。触ったら何か取り返しのつかないことが起きるんじゃないか、という気持ちがありました。AIを使いながら学習していたのですが、出てくる言葉が英単語ばかりでした。PDOっ...
AI

DockerでWordPress子テーマをローカル確認する手順|本番サーバーに触らず修正できる環境を作った

WordPressの子テーマを、本番サーバーにアップロードせずローカルで確認する手順をまとめました。Docker Composeで空のWordPressとCocoon親テーマを立て、子テーマをマウントするだけです。実際に使ったdocker-compose.ymlも載せています。
CSS

【保存版】Tailwind CSS チートシート|文字サイズ・余白・Flex・Grid・レスポンシブ対応まとめ

Tailwind CSSを使うたびに、text-xlって何pxだっけ?px-4って左右16pxだっけ?justify-betweenとitems-centerが毎回ごっちゃになる……そういうことで、よく表記方法を検索しているのですが、自分で...
Github

【GitHub】複数ブランチを同時に作業しても大丈夫? |変更が消える心配を解消する

はじめにGitHubでブランチを使って開発していると「複数の作業を別のブランチを切って作業したい!」という場面がでてきますよね。私は最初、何も考えずにメインから複数のブランチを切って作業していました。ですが、片方をマージした際に気づきました...
PHP

【データベース】下層ページもURLパラメータを使いたい|$config[‘query_string’]

データベースを使ったPHPサイトを作成していた時、トップページはURLでテキストが変わるようにできたのに、内部リンクを使ってトップページから下層ページに移動するとURLが元に戻ってしまう問題が起きました。例) ↓ 内部リンクで下層ページにア...
LP

PHPファイルだけで「データベース風」にURLでHTMLを切り替える方法

はじめに「果物ごとにページを作りたいけど、毎回HTMLファイルをコピーするのは大変…」そんなときに便利なのが、PHPの配列をデータベース代わりに使う方法です。通常、Webサイトで大量のデータを管理する場合はMySQLなどのデータベースを利用...
PHP

phpMyAdmin エクスポート&インポート方法(上書き保存対応)

はじめにリモートサーバーのデータベースをローカル環境にコピーしたいとき、phpMyAdminのエクスポート・インポート機能を使うと簡単にできます。ただし、ローカルに同じテーブルが既にある場合、そのままインポートすると「テーブルはすでに存在し...
Docker

【Docker】docker-compose.ymlの書き方がわからない!rootと一般ユーザーの違いを初心者向けに解説

はじめにDockerを使ってPHP + MySQL環境を構築していると、こんな設定を見かけることがあります。// docker-compose.ymldb: image: mysql:8.0 environment: MYSQL_ROOT_...
Docker

【データベース×Docker】PHPサイトをローカルで動かす環境を作る方法|Nginx

はじめにWeb制作をしていると、こんな場面がありませんか?コードを書いたけど、レンタルサーバーにアップロードしないと動作確認できないデータベースを使うページを作ったけど、ローカルで確認する方法がわからないPHPファイルをブラウザで開いても、...
Docker

【初心者でもわかる】 Docker Desktopを導入してPHPサイトで使えるようにする方法

はじめにDockerを使うには、まず Docker Desktop というアプリをインストールする必要があります。この記事では、Docker Desktopのインストールから、実際にPHPサイトを表示するまでの手順をまとめています。Dock...
AI

【Claude Code】機密ファイル(パスワードなど)をClaude Codeに読み込まないで欲しい時の書き方

私はAI を使用してサイトの作成をすることが多く、cursorやClaude Codeを使ってコードを修正してもらったりしています。Claude Codeは、AIがコードを読み書きしてくれるとても便利なツールです。しかし便利すぎるがゆえに、...
CSS

【背景画像に対応】CSSだけでリボン風デザインを作る方法|clip-path

よく見かけるリボンCSSよく見かけるリボンの作り方は、色付き四角の左右に三角の背景と同じ色のものを被せてリボン風にするやり方です。疑似要素(::before / ::after)で白い三角形を重ねる方法です。下の画像は背景が画像になっている...
Claude Code

VSCodeおすすめ拡張機能8選|Web制作・PHP開発で実際に使っているものを紹介

VSCode(Visual Studio Code)は拡張機能を追加することで、より便利に利用できます。しかし初心者の方は、何を入れればいいかわからないおすすめの拡張機能を知りたいWeb制作向けの拡張機能が知りたいという方も多いと思います。...