PHPでTODOリストを作ってみた - テーブルの表示まで

TODOリストを作ってみます。 作り方を調べたら真似をして終わりになってしまうので、調べることは最低限にして試行錯誤していこうと思います。 ☆以下は必要に応じて追記していきます。 環境 MAMP(ローカル環境) PHP(7.4.9) MySQL(5.7.30) 仕様 普段TOD…

PHPで新しく知ったこと - try/catch、threw句、ルーティングなど

Hugoサイトのカスタマイズと同時進行でphpの勉強をしたいと思っています。 いよいよ手元にあるLaravelの本でサイトを作ろう(原点回帰)!としたところ、 それよりは基礎です!というお話を頂きました。 ごもっともです。 基本的な知識や一般的な関数・処理…

ドメインとサーバーを契約しました

やっと、やっと申し込みました。 お金がかかるからという単純な理由でこれまで渋っていましたが、何とか安く済ませられそうなので一念発起してドメインとサーバーを契約しました(大げさ)。 Xserverでキャンペーンがありました。 Xserverのキャンペーン キ…

Hugoサイトでcssを上書きする(Theme使用)

ようやくNetlifyでHugoサイトを公開しましたが、元のThemeのままです。 少しずつカスタマイズしていこうと思います。 ☆使っているテーマは「hugo-clarity」です。 scssファイルを確認してみる デザインを変えたいのでcssを調べます。 cssファイルは見当たら…

Hugoでサイトを作り直します

すっかりご無沙汰になってしまったHugoのサイト作り、テーマを新しいものにして作り直そうと思います。 今回はこちらのテーマにしました。 去年の記事を見ながらhttp://localhost:1313/で表示できるところまで進めました。 前回作ったサイトへのアクセスもht…

gulp導入の覚え書き(後編)- gulpとnpmの使い方

gulpを利用した当初は、なすがままに設定していただきました。 コマンドもほぼはじめましてだったので、黒い画面に呪文...と、何が起きているのか理解に苦しみました。 現在理解している範囲でnpm、gulpまわりで集めた情報をまとめます。 大まかな流れ 1. ho…

gulp導入の覚え書き(前編)- Node.jsのインストールまで

gulpを使おうとなった時に以前行った手順は記憶の彼方なので、これまでのメモをまとめました。 (特にNode.jsまでは一度入れてしまえば中々入れ直すこともないと思うので忘れてしまいます) ☆長くなるので前・後編に分けました。後編はこちら。 大まかな流れ…

レスポンシブな画像の表示を考える

投稿するコンテンツの場合、アップする画像サイズを統一させられないのが常です。 いろいろな縦横比の画像を画面いっぱいに表示させる方法を模索しています。 wordpressなどでは、リサイズさせた画像を表示させたりするので、あまり頻繁ではありませんが、た…

読み込む画像のCLSと遅延読み込みについて

SEO

Googleの、Search Consoleの「ウェブに関する主な指標」で不良のURLがありました。 引っかかっていたのは「CLS に関する問題: 0.25 超(モバイル)」です。 他の指標としてはLCP(Largest Contentful Paint: コンテンツの初回ペイント)やFID(First Input D…

Interseprtion Observerを解読する

ちゃんと理解していないのに使ってしまいました...Interseprtion Observer。 このまま年を越すわけにはいかないと思ったので、2020年の力試しとしてまとめます。 2020年最後の記事です。 Interseprtion Observerとは とてもわかりやすく、詳しく書かれている…

JavaScriptの歴史をまとめてみる

まだまだJavaScriptの基本やNode.jsについて抑えておこう!ということで、こちらの動画を見てJavaScriptの歴史を自分なりにまとめてみました。 【モダンJavaScript #2】歴史から学ぶJavaScript前編。ECMAScript、CommonJS、モジュール、名前空間を知ろう【フ…

【css】line-heightの使い方

テキストのすき間問題。見て見ぬふりしてきたシリーズの1つです。 vertical-align も気になっているのですが、今回は line-height を見つめ直す機会があったのでおさらいします。 まずこちらの記事を読んで「なるほど」と理解してから考えます。 【CSS】line…

正規表現チェックツールの使い方

ごく稀に正規表現を書くことがあり、その度に正規表現の書き方を調べています。 時間のないときはお手上げです...。 そんな時にこちらのツールを教えていただきました! 正規表現チェッカー | WEB ARCH LABO 次回以降、こちらのツールの使い方を思い出せるよ…

コマンドが見つかりません(command not found)の対処法

npmのプログラム(パッケージ)をインストールしても、コマンドを叩いてうまくいかないことがあります。 うまくいかなかったケース 私がハマってしまったのは、ProgateのNode.jsの「Expressのアプリケーションを作成しよう」というコラムを実践していたとき…

PHPのメール送信を考える(前編)

先日WordPressでプラグイン「ContactForm7 」と「WP Mail SMTP」を使ったメールフォームを作りました。 「WP Mail SMTP」には送信元アドレスやメーラー、SMTP ホストなどを設定できますが、このプラグインを使わなくても「ContactForm7 」でメールフォームを…

新しく覚えた(使った)cssまとめ - 2020年春・夏

調べてその場で納得して終わりのケースが多いcss。いつでも振り返られるようにメモしました。 floatの解除に display: flow-root 【2017年最新】clearfix一番短い書き方は親要素にdisplay:flow-root;を書き加えるだけ - 自動化厨のプログラミングメモブログ│…

コンパイルとcssを考える

ソースマップの記事を書いていたら「コンパイル」が気になってしまいました。 scss→cssはコンパイルなの? 過去の記事でも混乱していました(笑) 調べているとコンパイラ言語からプログラムの実行をする過程の中でコンパイルが出てくるので図にしました。 …

HTMLの書き方を見直し

W3CのMarkup Validation Service(マークアップバリデーションサービス)でウェブページを確認する機会がありました。 これって警告・エラーなんだ!という新しい発見がありましたのでメモします。 ※2020年7月現在の内容です。 コメントの中にハイフン2つが…

黄色のSourceMapのコンソールエラー - コンパイルについても

今回のエラーはChromeのデベロッパーツールのコンソールエラーを調べていて気になったもののうちの1つです。 (もう一つはCookieのエラーです) DevTools failed to load SourceMap: Could not load content for (Chromeの拡張機能のjsのソースマップ): HT…

黄色のCookieのコンソールエラー

Chromeのデベロッパーツールの「Console」で出てくる黄色のエラー(警告)に対処したのでメモします。 Cookieのエラー A cookie associated with a cross-site resource at <URL> was set without the `SameSite` attribute. A future release of Chrome will onl</url>…

JavaScriptのコールバック関数について

JavaScript第一号の記事です。 JavaScriptを飛ばしてJSONの記事はあります。 こんな動きを実装しました!と堂々と記事にする以前の段階なので、そうなれるようにがんばります。 下積み記事第一弾はコールバック関数です。 やりたいことがあっても、うまくい…

CGIにふれる

WordPressインストール時にまたしてもつまづいたのでメモです。 (こちらにもつまづいた事例を書きました) WordPressをサーバーに入れて、インストールしようとアクセスすると、phpのエラーが出ました。 require がうまくできない、といったエラーでした。 …

PHPで忘れがちなこと(その2)

その1の続きです。 ※忘れそうになりますが、これはProgateをやってメモしたい部分をまとめた記事です。 return array() という書き方 はじめ何に違和感を覚えたかというと、それが関数の中ではなく、return array() の配列のみ書かれたファイルだったという…

PHPで忘れがちなこと(その1)

ProgeteでPHPをやっています。 これまで断片的に調べながら書いていたので、体系的に学習することは、とても効率的だと実感しています。 特にPHPでもWordPressから入った身としては、オブジェクトやクラスなどを意識することなく、世にたくさんある参考サイ…

JSONについて

ついにこのときが来ました。 ずっとよく分からないままモヤモヤしていたjson。 分かったつもりでいてもどこか腑に落ちていなかったjson。 あまり肩肘張らずに整理していきます。 JSON(JavaScript Object Notation)とは 【IoT用語集】JSONとは? XMLなどと…

Gitの学習ツール「Git-it」

Visual Stusdio Code(以下VS Code)でGitを使えるようになりたい、Atom + SourceTree から卒業しよう!ということでVS CodeでGitについて調べたものの、分からないことだらけだったのでGit(GitHub)についてイチから学習しようと思いました。 Visual Studi…

Visual Stusdio Codeに乗り換えます

エディタはAtomを使っていましたが、最近プロジェクト内のファイル名を変えたり、プラグインを使ったFTPアップロードをしようとすると落ちることが多々。 そこでお勧めいただいたVisual Stusdio Code(以下「VSCode」)に乗り換えを決めました。 Visual Stud…

GitHubで初push

Gitをしっかり学ぼう、という熱が出てきたので、ProgateでGitのレッスンを受けました。 「Gitの環境構築をしよう!」というコラムでGitHubの使い方が書かれていて、せっかくなので制作中のHugoサイトをGitHubで管理しようと思いました。 サイトに新しくプラ…

Hugo - 中華フォントを直す(cssファイルの読み込み)

Hugoの無料配布されているテーマをインストールして、最初に直したい所が、 フォント でした。 今回インストールしたテーマ「cleanwhite」は、おそらく中国方面の方が作られたようで、いわゆる「中華(中国語)フォント」が使われています。 「記」が気にな…

改行について

改行に手こずりました phpファイルにて。 やりたかったことは、文字列の特定の箇所で改行することでした。 $text = "あいうえおかきくけこ" を、ブラウザ上で あいうえお かきくけこ と表示させたいというものです。 改行させるためには改行コード! $text =…