2024.11.25 WEBWebデザイン :nth-child()擬似クラスをもっと便利に！ 新構文、”of <selector>”を使って選択要素をフィルタリングしよう 先日、:nth-child()擬似クラスについて下記の記事を投稿しました。 :nth-child()擬似クラスで指定した順番・範囲の要素を取得する :nth-child()擬似クラスの基本的な使い方はこちらを参考にしていただければ幸いですが、もう一つだけお伝えしたい機能がありましたので筆を執りまし [...]
2024.11.19 WEBシステム開発 CodeIgniter4でAPIを使用してランダムユーザーを生成する方法 今回は前回の天気情報取得に引き続き、APIを使用して簡単なアプリケーションを作成してみます。 今回のテーマは「ランダムユーザー生成」です。Random User Generatorを使って、ランダムなユーザーのプロフィールを取得し、webページ上に表示する仕組みを実装してみます。 前提 Ubun [...]
2024.11.19 WEBWebデザイン 【Photoshop】アニメーション画像を作ってみよう！（APNG・WebP）【前編】 前回、Photoshopを使って画像の中に動画を埋め込み、mp4形式で書き出す方法をご紹介しました。 【Photoshop】画像の中に動画を埋め込んで書き出す方法（モックアップ動画の作成方法） あれからアニメーションが面白くなってきたので、今回はPhotoshopを使ってアニメーションを作成し、A [...]
2024.11.12 WEBシステム開発 ソフトウェアアーキテクチャメトリクスを読む（その1） 今回から、積み本になっていたオライリーの「ソフトウェアアーキテクチャメトリクス」を読んでいきたいと思います。 定義と計測 「Lean とDevOps の科学」のソフトウェアデリバリーに対する、メンタルモデルから4つのキーメトリクスが生まれた。 このメンタルモデルが、この本の土台となるらしい。 デプ [...]
2024.11.06 LIFE遊び・旅行 旅行の楽しさをちょっとプラス！全国津々浦々のアプリをご紹介！ ～東日本編～ 今回も前回の記事「旅行の楽しさをちょっとプラス！日本各地・世界各国、行ったことのある場所記録アプリ4選」に続き、旅行の楽しさをちょっとプラスできるアプリをご紹介します。 旅行に行く際、目的は決まっているけど、その場所や有名どころ、イベントについて詳しく知らない、アクセス方法や目的地の営業時間が分か [...]
2024.11.06 WEBWebデザイン 【jQuery】ページ内のどのコンテンツにいるのか分かるエレベーターメニューを実装してみた 最近のwebサイトではエレベーターメニューをよく見るようになりました。 LPなど長いページでの使用や、沿革ページで年ごとに区分するなど、使い方は様々です。 今回はjQueryを使って、エレベーターメニューを実装してみたいと思います。 エレベーターメニューの仕様 最初に、エレベーターメニューの仕様に [...]
2024.10.28 BUSINESS仕事効率化ツール パワポで簡単！画像にモザイクをかけてプライバシーを守りましょう！ Web上に画像をアップロードする際、一部だけモザイクをかけたい、なんてことありますよね。 スマホでもモザイク加工ができる加工アプリがありますが、PCで画像をアップロードする場合は一度スマホの端末に画像データを移すのは面倒かと思います。 そこで、パワーポイント（以下パワポ）であれば使ったことがある方 [...]
2024.10.22 WEBシステム開発 【Go】ベンチマーク機能を使って高速でメモリ使用量の少ないプログラムを書こう 先日、メモリ使用量をなるべく抑えたい処理を実装するにあたってGoのベンチマーク機能を使用しました。 今回はそのベンチマーク機能について記事を書いていこうと思います。 ベンチマークのコードの書き方 実際にベンチマーク機能で使うコードを書いてみます。 go func BenchmarkExampl [...]
2024.10.17 LIFEIT活用 Perplexity（パープレキシティ）で新しい検索体験をしてみよう！特長や使い方、料金を紹介！ 今話題のAI検索エンジンPerplexity（パープレキシティ）をご存じでしょうか？ Google検索に代わる新たな情報検索ツールになるかもしれないと話題になっています。 また、2024年6月ソフトバンクが「ソフトバンク」「ワイモバイル」「LINEMO」の契約者に対して、Perplexity（パー [...]
2024.10.08 WEBシステム開発 Vitestでブラウザテストができる!? Browser Modeを試してみた 久々に Vitest のドキュメントを漁ったら experimental 段階ですが新しい機能が追加されていました。 昨今のフロントエンド界隈のエコシステムが更新されるスピードは早いですね。 参照Browser Mode | Guide | Vitest 今回は Vitest の実験的（expe [...]
2024.10.08 WEBシステム開発 Vue3でjQueryのdatepickerを使いたい！実装手順と注意点を解説します。 皆様、ご無沙汰しております。 今回は、先日Vue3とjQueryのDatepickerを組み合わせて実装する機会があったので、その方法と、つまずいたポイントおよび解決策についてご紹介したいと思います。 要件 日付の入力欄が複数個欲しい 入力欄の個数は任意で増減させることができる それぞれの入力欄 [...]
2024.10.07 BUSINESS仕事効率化ツール パワポで画像調整はどこまでできる？背景削除や画像補正など、パワポでできることをご紹介します パワーポイント（以下パワポ）で資料を作成する際、画像を使用することが多いですよね。 多くの場合、他のアプリで画像を補正してからパワポに挿入することもあるかと思いますが、それだと手間がかかることもあります。できれば、パワポ上で完結できると便利ですよね。 そこで、パワポでどこまで画像調整ができるのか、 [...]
2024.10.07 LIFE遊び・旅行 旅行の楽しさをちょっとプラス！日本各地・世界各国、行ったことのある場所記録アプリ4選 突然ですが、皆さんは旅行が好きですか？ 私は、1か月に1回は旅行に行きたいほど、旅行が好きです。旅行の目的は、有名観光地を訪れたり、美味しいグルメを堪能したり、自然を活かしたアクティビティを楽しんだりと様々です。また、旅行とまではいかないけれど、ホテルを堪能することが目的である「ホカンス（ホテル+ [...]
2024.10.02 WEBアクセシビリティ 【ウェブアクセシビリティ】代替テキスト（alt属性）をチェックする方法をご紹介！ webサイトの更新やアクセシビリティチェックの際、画像の代替テキスト（alt属性）が正しく設定されているか確認することが重要です。 どのような文言が設定されているか、また代替テキスト自体が設定されているかを、ブラウザで確認する方法をご紹介します。 代替テキスト（alt属性）については下記ページで詳 [...]
2024.09.27 WEBWebデザイン 【Photoshop】画像の中に動画を埋め込んで書き出す方法（モックアップ動画の作成方法） 今回は、Photoshopを使って画像の中に動画を埋め込み、mp4形式で書き出す方法をご紹介します。 なんと、Photoshopは動画編集もできたのです…。需要はニッチかもしれませんが、下記のようなPCモックアップのGIF画像を業務で作成することがあったため、備忘録として残しておこうと思います。P [...]
2024.09.27 WEBシステム開発 話題の『ChatGPT o1』をコーディングに使ってみた（ChatGPT 4oとの比較） 昨今ではもう世間に定着してきたChatGPTですが、2024年9月12日に新しいAIモデルの『ChatGPT o1』がリリースされました。 https://openai.com/index/introducing-openai-o1-preview/ 今回のモデルに関しては思考プロセスが洗練され、 [...]
2024.09.20 WEBWebデザイン :not()否定擬似クラスを使ってCSSセレクタに！（否定条件）を追加しよう CSSコーディングをしていると、 一番下の行には線をつけないでください 3つ目の要素は背景画像をとってください といったように、要素の「位置」や「順番」に応じて装飾を除外するような要求を出されることがたくさんあると思います。 CSSセレクタは原則として「当てはまる条件」を連ねて要素を絞り込ん [...]
