em

Webの世界の片隅に生息しているコーダーです。

em

Webの世界の片隅に生息しているコーダーです。

マガジン

  • ぴよぴよコーダーの開発日記

    主にフロントエンドな開発日記。CSS、jQuery、WordPress多め。

  • ふりかえりログ

    ただの日記

    • ぴよぴよコーダーの開発日記

    • ふりかえりログ

最近の記事

#97 ES6 基本から

まずはモダンJS ES2015(ES6) let : 変数の有効範囲が{}(ブロックスコープ)に限定する if (true) { let x = 13;}console.log(x); 結果は、ReferenceError: x is not defined と参照できないエラーになる {}を外れた時点で、変数xは破棄される。 let : 同名の変数は定義できない let msg = 'Hello';let msg = 'Good Bye';console.log

    • #96 stopPropagation()の必要性

      よくあるmodalを作っていた。モーダルの中で拡大機能をつけようと、expandボタンを追加して押してみたら、モーダル自体が閉じてしまう現象が発生して、どうしたものかと、ためしにstopPropagation();をつけてみたら、無事に拡大できた。 これがイベントの伝播ってやつか。今まで情報としては知っていたけれど、実際にはじめて遭遇したので、メモしておく。 拡大機能の外側にあった、モーダル背景の閉じる機能が伝搬して動いてしまったのが要因。 デモ:8行目のe.stopP

      • 2024年2月のふりかえり

        2月は、雨だったり、家族が体調を崩したりで、なかなか走行距離はのびなかった。読了したものは、文芸書1冊と技術書1冊。仕事面では、あいかわらずちょい難しいけど、新しいことができるようになった。

        有料
        100
        • #95 SQL 基本から

          勉強しながら、ちょくちょく更新していく予定 一つのテーブルを扱う データを取り出す 文法 例 SELECT name FROM staffname; 複数の列のデータを取り出す 文法 複数のアイテムはカンマで区切る 例 SELECT ProductName, Price FROM products; 列名を逆にして指定すると SELECT Price, ProductName FROM products; 列に別名をつける 文法 As句を使って別名を

        #97 ES6 基本から

        マガジン

        • ぴよぴよコーダーの開発日記
          em
        • ふりかえりログ
          em
          ¥100

        記事

          #94 phpMyAdminを使ってデータベースやテーブルを作成する

          SQLの勉強をしたくなった。ので、家でもデータベースを扱える環境を作ろうと思う。 手っ取り早いのはXAMMPを入れてphpMyAdminでSQLを書く方法 まずはXAMMPを入れてみる 次に、XAMMP Control PanelからphpMyAdminを立ち上げる phpMyAdminは、データベース(MySQL)をブラウザーで操作できるツールのこと これでデータベースにアクセスする環境はできたので実際にデータベースを作っていきます。 phpMyAdminの起

          #94 phpMyAdminを使ってデータベースやテーブルを作成する

          #93 WooCommerceにテストデータを入れてみた

          サーバから /wp-content/plugins/woocommerce/sample-data/ をダウンロードする サンプルデータには、こういうデータが入っていました。 これをWordPressにインストールする sample_products.xmlをインポートする 参考

          #93 WooCommerceにテストデータを入れてみた

          #92 gulpを入れてみる

          とりあえずnode.jsが入っているかを確認 入っていない人はインストールしよう node -vv16.17.0 node.jsはざっくりいうと「PC上でJavaScriptを実行可能にするもの」 npmとnpxのバージョンを調べる。node.jsをインストールするとこれらは自動的に同梱されている npm -v8.19.1 npmは、node package managerの略。mavenみたいにweb上のリポジトリからパッケージのインストールを行う npx -

          #92 gulpを入れてみる

          #91 ネイティブブラウザとアプリ内ブラウザの違い

          アプリ内ブラウザ(WebView:アプリ内でWebページを表示できる機能) ネイティブブラウザ(iOSやAndroidに入っているブラウザ) WebViewの例 Amazonアプリ:商品詳細画面がWebView。ほかは通常のアプリ機能を使ったハイブリッドアプリ

          #91 ネイティブブラウザとアプリ内ブラウザの違い

          2024年1月のふりかえり

          何かを記録しないと、ぼーっと年月が過ぎそうなので、ログを残してみたくて書いてみます。

          2024年1月のふりかえり

          #90 数年ぶりにgithubに入ったら入れなかった件

          VS Codeでクローンした後に、作業してプッシュしようとしたら と出たので、VSCodeのターミナル上で下記を追記 git config --global user.name 'hogehoge'git config --global user.email 'hogehoge@gmail.com' 参考: git configに登録し直して、再度プッシュしようとしたら今度は、こんなエラーメッセージが。。Gitリモートで証明に失敗しました。 この解決策は、Githu

          #90 数年ぶりにgithubに入ったら入れなかった件

          #89 はじめてのNotionのデータベース

          ちょくちょく勉強して更新していく予定 Notionは以下の3要素から構成される ブロック:最小単位 ページ:ブロックが集まったもの データベース:ページが集まったもの(同じ性質をもったデータの集まり) ディレクトリの概念がない ページの中にページが入る構造 /page と書いて、ページ(このページ内に子ページを埋め込む)を選択して 子ページのタイトルを書いて増やしていく /data でインラインデータベースを選択 作った子ページをインラインデータベースの罫線のとこ

          #89 はじめてのNotionのデータベース

          #88 Notionの使い方の勉強

          ちょこちょこ更新していく予定 まず https://www.notion.so/ja-jp にアクセス 料金:フリープランはゲストは10人まで Notion AI $8別途かかる サインアップする サイドバーとエディターがある サイドバー上部(コントロールパネル) 検索 更新一覧:メールなどが届く 設定 サイドバー下部 「チームスペースの作成」>「〇〇チーム」>「人を招待」 プライベートセクション(共有しないもの:自分しか見れない) プライベートのページを誰かと共

          #88 Notionの使い方の勉強

          #87 正規表現 基本から

          正規表現の問題集を買ったので、備忘録的に。 こまめに解いて、ちょくちょく更新していく予定。 任意の一文字 . 任意の2文字 .. .の数を増やすと3文字や4文字など任意の文字が抽出できる 任意の一文字 ただし英数字アンスコに限る \w 任意の2文字 ただし英数字アンスコに限る \w\w \wの数を増やすと3文字や4文字など任意の英数字アンスコが抽出できる ちなみにwはwordの略だそうです。 任意の一文字 英数アンスコ以外 \W 任意の2文字 英数アンスコ以

          #87 正規表現 基本から

          #86 アドレスバーに入力したURIはそのままに、内部的に他のディレクトリにアクセスする方法

          何を言っとるのかわからないのかもだが、こんな構成のサーバがあるとする 何もしないと、https://www.test.co.jp/data/hoge/aaa.php とか https://www.test.co.jp/static/piyo/ccc.png で表示されるが、 途中の「data」ディレクトリとか、「static」ディレクトリをURIに表示させたくない。 そこで、chatGPTさんに次のように聞いてみた (これは失敗談 成功談はページ下部) RewriteE

          #86 アドレスバーに入力したURIはそのままに、内部的に他のディレクトリにアクセスする方法

          #85 カルーセルを縦スクロールだけで動かす

          カルーセルは横にフリックしたり、インジケータを動かしてスライドを動かしたりするけど、縦スクロールだけで動かしてみる。 GSAP(GreenSock Animation Platform)というGreenSock社のアニメーションライブラリを使うと、実現できるらしい。 参考: LIGさんのデモ ↓ わいのデモ  (最初のスライドが中央に来て最後のスライドが中央でストップように調整) 真ん中にする方法 .slide_list { position: ab

          #85 カルーセルを縦スクロールだけで動かす

          #84 WordPress6.0入れたらやったこと

          Twenty Twenty fourの子テーマを作る 親テーマをカスタマイズすると親テーマ自身がバージョンアップするとカスタマイズが全部消える それを避けるために子テーマを作る しかし、親テーマがバージョンアップされた際、子テーマにも変更を加える必要がある場合がある。それは親テーマのPHPファイルをコピーして子テーマをカスタマイズした場合。 Twenty Twenty fourをコピーして、別の名前にする。名前は、 ‘親テーマ名-child’ を付けることが推奨される 

          #84 WordPress6.0入れたらやったこと