サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
災害への備え
kinsta.com
WordPressエコシステムは成長を続けており、これまで以上にWordPress開発に柔軟性がもたらされています。フルサイト編集(FSE)では、特にtheme.jsonファイルを活用することで、誰でもゼロからテーマを開発することができます。 theme.jsonファイルを使えば、複雑なプログラミング言語の扱いに煩わされることなく、WordPressテーマをきめ細かくカスタマイズ可能です。 この記事では、フルサイト編集との関係性を含め、theme.jsonファイルの可能性を探ります。また、開発経験を問わず、theme.jsonファイルを使用しておしゃれでパフォーマンスに優れたサイトを構築する方法もご紹介していきます。 theme.jsonファイルとは theme.jsonは、WordPressテーマの設定とスタイルを定義する設定ファイルです。JavaScript Object Notati
GutenbergがWordPressの標準エディターとなった今、ウェブデザインの可能性は、WordPressテーマに縛られません。WordPressには、優れたサイトのレイアウトに必要なデザインツールが搭載されており、テーマはサイトの構築やデザイン機能を強化する目的で使用することができます。 そしてブロックテンプレートは、サイト構築をさらに強化してくれる存在。ブロックエディターハンドブックには、以下のように記載されています。 ブロックテンプレートはブロックアイテムのリストとして定義されます。定義済みの属性やプレースホルダーコンテンツを含めることができ、静的にも動的にもできます。ブロックテンプレートを使用して、エディターセッションのデフォルトの初期状態を指定できます。 言い換えるなら、ブロックテンプレートは、デフォルト状態をクライアント上で動的に設定するために使用可能な複数のブロックアイテ
Dockerコンテナを利用することで、アプリケーションの実行に便利な隔離された環境を確保することができます。そこでは、高いレベルでの一貫性と移植性が保証されます。Dockerコンテナで作業する際には、そのシェルの接続や検査が極めて重要です。そうすることで、コマンドの実行、問題のトラブルシューティング、コンテナの動作のリアルタイム監視が可能になります。 この記事では、メンテナンスやアップデートのためにローカルやリモートのDockerコンテナにアクセスする方法についてご説明します。 コンテナアクセスが欠かせない理由 コンテナへのアクセスは、コンテナ化された環境における効果的な管理とトラブルシューティングに不可欠です。コンテナのログやランタイム情報を分析し、簡単にエラーを特定して解決することが可能になります。 また、コンテナにアクセスすることで、設定の更新、パッケージのインストール、その他の管理
WordPress 6.5の新機能(フォントライブラリ、データビュー、Block Bindings API、Interactivity APIなど) WordPress 6.5「レジーナ」が4月2日に正式リリースされました。この記事では、その新機能と改善点の数々をご紹介します。 特に強力なAPIが導入されていることで、WordPressの開発体験が大幅に改善されそうです。また、サイト構築やコンテンツ作成に関する嬉しい変更点も多数組み込まれています。 そして、新登場のフォントライブラリにより、コアブロックのコンテンツにカスタムフィールドの値を注入したり、サイトエディターから直接Google Fontsをダウンロードしてインストールしたりすることも可能に。新たなデザインツールとUIの強化により、全体的な編集体験もさらに向上します。 この記事でWordPress 6.5のすべてを網羅することはで
ウェブ開発は、単一の静的ページで構成された個人サイトの始まりから、今日まで長い道のりを歩んできました。最近では言語、フレームワーク、そしてコンテンツ管理システム(CMS)の選択肢の幅は大きく広がり、あらゆるニッチに対応することができます。 今回取り上げたいのは、JavaScriptフレームワークの新星「Astro」です。 Fred K. Schott氏をはじめとする開発チームによって構築されたAstroは、静的サイトジェネレーターのように動作するオールインワンフレームワークで、開発者の間で瞬く間に人気を獲得しています。 Astroが支持を集めている理由、他のソリューションよりも優れている点などをご紹介し、Astroを使用してMarkdownベースのブログを構築する方法を見ていきます。 Astro Astro(Astro.js)は、素早くスムーズに動作するコンテンツ豊富なサイトの構築を想定し
「git rename」を使用してGitのブランチ名を変更する方法 どんなソフトウェアやウェブアプリケーションを開発するにしても、ワークフローにGitを組み込むことは、ほぼ必須の要件となっています。 特にチームでのコーディングとなると、分散バージョン管理システムが間違いのない選択肢です。Gitはシンプルなコマンドをいくつも備えており、すぐに使いこなすことができます。しかし、必ずしも直感的とは言えません。 ブランチでgit renameのような操作を行う場合には、慎重に手順を検討する必要があります。 チームワークには十分なコミュニケーションが必須であり、ブランチ名には、公開する以上、十分な説明と明確さが求められます。素早く効率的に仕事をこなす中でも、これをしっかりと意識する必要があるのです。そのため、ブランチ名について、プロジェクトを進める中で細かな調整が必要になることは決して珍しくないでし
どんな企業にとっても、膨大な量のコンテンツ制作は容易ではありません。複数のスタッフやフリーランスのライターが必要になり、往々にして終わりの見えない作業です。また、特定のキーワードを求め多くのサイトが競い合うことになり、検索エンジン上位表示となると、至難の業です。 さらに厄介なことに、例えば、コンテンツ執筆の外注先から、AI搭載のソフトウェアで生成された記事が納品される…なんてこともあるかもしれません。 そんなコンテンツはSEOに影響するのでしょうか。検索エンジンは、AI支援型コンテンツを検出することができるのでしょうか。今回の記事では、AIコンテンツの検出について検討し、記事制作にAIが利用されたかどうかチェックできるツールを一挙ご紹介します。 本題に進む前に、そもそも、なぜ今、AIコンテンツの検出が重要なのか考えてみましょう。 おすすめのAIコンテンツ検出ツールについて動画での解説もご用
Inertia.jsは、クライアントサイドとサーバーサイドの両方のレンダリングを組み合わせたSPA(シングルページアプリケーション)を作成することができる先進的な仕組みです。 この記事では、InertiaがいかにSPAの構築を容易にし、開発者が抱える他の多くの問題を解決できるのかをご紹介します。また、このツールの主要な機能も解説します。 それでは、サーバサイドアプリケーションとクライアントサイドアプリケーションがどのように機能するか、という基礎から理解を深めていきましょう。 サーバーサイドレンダリングとは サーバーサイドレンダリング(SSR)とは、アプリケーションがウェブページのコンテンツをブラウザではなくサーバー側でレンダリングまたは表示できるようにする仕組みを指します。例えばある人が「example.com」にアクセスしようとすると、その人の使用するブラウザはサーバーにリクエストを送信
Gmailは、現在最も人気のあるメールサービスで、そのアクティブユーザーは18億人に達しています。しかし、特にマーケティングやビジネスコミュニケーションにメールを使用していれば、Gmail以外のサービスに移行したい、あるいは少なくともGmailの機能を強化したいと感じることがあるはず。 そこで今回は、Gmailに代わる優れたメールサービスをご紹介します。この記事を読んで、自社に適したメールサービスを見つけてみてください。 Gmail以外のメールサービスを検討すべき理由 Googleはデータ収集に関して懸念が多く、過去にはプライバシーを侵害する行為やメールのスキャンなどが行われていたことが明らかになっています。加えて、Gmailにはパーソナライズされた広告を表示する機能があり、単に鬱陶しく感じることも。 GmailはGoogleエコシステムの一部。これはサステナブルの観点で、ベストな選択肢で
Windows、macOS、LinuxにReactをインストールする方法 Reactは現代のウェブ開発に欠かせないツールとなっており、これをマシンにセットアップすることは、優れたユーザーインターフェース構築を始めるための第一歩となります。 パフォーマンスと再利用性に重点を置いたUI構築のための人気のJavaScriptライブラリで、人々のために本当に役立つ、高速で応答性が高く、メンテナンス可能なインターフェースを簡単に作成できるようになり、ウェブ開発に革命をもたらしました。 コンポーネントベースのアーキテクチャと、実際の環境でどのように動作するかに重点を置いているため、モダンなウェブアプリケーションの構築を目指す開発者にとって、魅力的な選択肢となっています。 この包括的なガイドでは、Windows、macOS、およびLinuxオペレーティングシステムにReactをインストールする手順を説明
Tailwind CSSを使用しておしゃれなウェブサイトを素早く開発する方法 開発者として経験を積んでいくと、少ないコードで、より多くのことを実行できる技術を使用したいと思うようになるもの。Tailwind CSSのような強固なフロントエンドフレームワークは、そんな開発者の望みをかなえる存在です。 この記事では、ウェブページの構築とデザインを支援するCSSフレームワーク、Tailwind CSSについて学びます。Tailwind CSSのインストール方法や、プロジェクトへの統合方法、そしていくつかの実用的なアプリケーションもご紹介します。また、カスタムスタイルやプラグインの作り方についても見ていきましょう。 Tailwind CSSを使ってサイトを構築する方法について、動画での解説もご用意しています Tailwind CSSとは Tailwind CSS Tailwind CSSは、ユーテ
脆弱性が蔓延し、絶えず増え続ける今日、ユーザーのセキュリティとプライバシーの保護は、これまで以上に重要視されています。脆弱性を見過ごせば、評価が失墜したり、高額な制裁金を科されたり、顧客や訪問者からの信頼を失ったりする可能性が高まります。 ウェブサイトやウェブアプリケーションは、常にマルウェアやスパムなどの攻撃の危険に晒されています。今回は、そんな攻撃の1つであるCSRF(クロスサイトリクエストフォージェリ)に焦点を当てます。CSRF攻撃は、気づかない間に発生する可能性があり、特に問題視されています。また悪意のある要求は正しい要求と区別が難しく、開発者やサイト運営者が発見しづらいというのも厄介です。 この記事で、CSRF攻撃の概要と仕組み、そして対策について学びましょう。 CSRF攻撃について動画での解説もご用意しています。 CSRF攻撃とは クロスサイトリクエストフォージェリは、略してC
SvelteとReactの違いを徹底比較(機能、パフォーマンスなど) 現代のウェブ開発に欠かせないと言っても過言ではないのが、JavaScriptフレームワークです。開発プロセスの効率化を担うもので、あらゆるウェブ開発の現場で使用されています。技術の向上に終わりはありません。こうしている今にもフレームワークは進化を続け、より優れた、シンプルな、そして時には複雑なフレームワークが産声を上げます。 これだけ選択肢があると、プロジェクトにあったフレームワークを選ぶのはそう簡単ではありません。 今回は、大注目のJavaScriptフレームワーク/ライブラリであるSvelteとReactについて。両者を様々な視点から比較し、それぞれの長所と短所に迫ります。 Svelteとは Svelteは、高速で柔軟性があり、「サイバネティクス」の面での「強化」をウリにするウェブアプリケーション構築フレームワークで
どのようなサイトにおいても、スピードは重要です。高速読み込みの追求のために、さまざまな技術が利用されています。その中の一つが、サイトの機能に悪影響を与えることなく、使用するコードを最小限に抑えること。gzipでの圧縮でそれを実現することができますが、Brotliを用いた圧縮という新手法もあります。 これはGoogleが開発したアルゴリズムで、gzipを超える(あるいはそれに取って代わる)多くのメリットが豊富に詰め込まれています。今回の記事では、Brotliを用いた圧縮のスピードや効率を中心に、その技術に迫りたいと思います。 Brotliアルゴリズムを用いた圧縮について動画での解説もご用意しています。 Brotliを利用した圧縮とは何か、これがサイトで使用されているかどうかを確認する方法、そして、必要な場合に実装する方法も扱います。圧縮アルゴリズムにおけるBrotliの位置付けと、他の選択肢
【2024年版】ReactのUIコンポーネントライブラリ23選 ReactのUIコンポーネントライブラリは、Reactベースのソフトウェアアプリケーションやウェブサイトの優れたインターフェースを作成するのに役立ちます。 デザインの特徴や機能ごとにコードを記述することもできますが、UIコンポーネントライブラリを活用すれば、作業効率が高まります。 ボタンなどのデザインに必要なパーツを、ゼロから記述することなく使用することができます。 多くの時間と労力を劇的に削減できるだけでなく、より重要な課題への対策を検討し、イノベーションに取り組む機会を与えてくれます。 テーブルやマップのような基本機能、あるいはテーマのような高度なものを追加する際は、毎回、利用可能な選択肢から選ぶだけで、そのままデザインに適用することができます。 その結果、ソフトウェア開発プロセス全体が効率化され、より短い期間で質の高いア
多くの開発者が、Gutenbergのブロックやアプリ開発を始めるハードルの高さに不満を抱いています。習得の難易度が高い理由は、開発環境のインストールと設定の複雑さにあります。しかも、ブロック開発には、JavaScript、Node.js、React、Reduxの深い知識が必要です。 WordPress公式のブロックエディターハンドブックは有用なリソースですが、開発者向けの膨大な情報の中で、初心者が迷子になることはほぼ間違いないでしょう。 Gutenbergプロジェクトのリード開発者Matías Ventura氏は、WP Tavernのインタビューで以下のように語っています。 すぐにブロック開発を習得できる人もいますが、やはり多くの人にとって大きな壁となっています。段階的な習得が必要になりますが、ドキュメントは、構成も表現も桁違いに改善できるはずです。もっといろいろなことができればと思ってい
FastAPI は、Python 3.6以降を使用したモダンなアプリケーションプログラミングインターフェースの構築に便利な、高速かつ軽量のウェブフレームワークです。今回の記事では、そんなFastAPI を使ったアプリ構築の基本を説明し、これが2021年ベストオープンソースフレームワークの1つとしてノミネートされた理由の一端をご紹介します。 FastAPIアプリを開発する準備ができたら、サーバー選びが必要になります。Kinstaのアプリケーションホスティングとデータベースホスティングサービスは、Pythonに強いPaaS(Platform as a Service)です。是非ともあわせてご確認ください。 まずは基本から学びましょう。 FastAPIの強み はじめに、FastAPIフレームワークが各種開発プロジェクトにもたらす利点をご紹介します。 スピード:FastAPIは、その名の通り、非常
React.jsを使ってヘッドレスWordPressサイトを構築する方法 WordPressは、最も人気のあるコンテンツ管理システム(CMS)の1つで、インターネット全体の41%に相当する8億1千万人が利用しています。シンプルでユーザーフレンドリー、多様なカスタマイズオプション、プラグインやその他のリソースの強力なエコシステムを誇り、ウェブサイトを素早く構築したい人にとって優れた選択肢となっています。 WordPressを最大限に活用する方法のひとつが、ヘッドレス化です。 ヘッドレスCMSは、ヘッドレスシステムとも呼ばれ、コンテンツの管理に使用されるバックエンドCMSの一種です。ヘッドレスCMSのAPIを呼び出すだけで、あらゆるシステムやウェブサイトにコンテンツを統合することができます。 ただし、この手法を選択する際には、フロントエンドを別途管理する必要があります。そこで登場するのがAPI
【2024年版】おすすめのReactベース静的サイトジェネレーター6選 進化を続けるウェブ開発の現場において、静的サイトジェネレーター(SSG)は、ウェブサイトを素早く効率的に構築する人気の選択肢です。HTMLやCSSで構築された、手作業で更新や修正を行う必要がある従来の静的ウェブサイトと、データベースやPHPなどのサーバーサイドスクリプト言語に依存する動的ウェブサイトとの橋渡しをする役割を果たします。 この記事では、2024年に人気のReact静的サイトジェネレーターに迫ります。また、記事の後半では、特定のプロジェクトの要件にあわせて最適なものを選択する方法にも触れたいと思います。 Reactベース静的サイトジェネレーターとは Reactベース静的サイトジェネレーターとは、Reactコンポーネントをサイト構築の基盤として使用して静的なウェブサイトを生成することができるツールです。その前に
コミュニティから生まれたWordPressの新デフォルトテーマ「Twenty Twenty-Three」 「Twenty Twenty-Three」は、WordPress 6.1に搭載されているWordPressの新しいデフォルトテーマです。 無駄な要素を取り除き、必要最低限の機能を搭載したテーマで、テンプレートやスタイルバリエーションを作成したり、WordPressの最新バージョンに導入された新機能をテストするのに理想的です。そのミニマルなスタイル、レスポンシブデザイン、動作の軽さから、さまざまなブログやサイトに適していますが、開発やテスト環境として使用するのも良いアイデアです。 Kjell Reigstad氏は、Twenty Twenty-Twoテーマを紹介する中で、デフォルトテーマの展望について以下のように語っています。 theme.json、ブロックテンプレート、ブロックパターンな
WordPress 6.2の新機能(サイトエディターの一新、スタイルブック、ナビゲーションメニューの改善、新APIなど) WordPress 6.2 Dolphyは、2023年最初のメジャーリリースです。その新機能が気になるところです。 WordPress 6.2は、長期的なGutenbergの開発ロードマップのフェーズ2の最終段階に突入しており、ブロックエディターは正式にベータ版が終了します。 今回のリリースは、主にインターフェースの改善と編集作業の効率化に重点が置かれています。 テンプレートやテンプレートパーツの操作を楽にする新たな手法が導入され、ブロックテーマにウィジェットをインポートする機能、集中執筆モード、ブロック設定の拡張、そして既存のブロック、パフォーマンス、ユーザビリティに対する大小さまざまな改善点が盛り込まれています。 中でも、機能性や使い勝手の面で劇的に改善されたのが、
【2024年版】JavaScriptのおすすめライブラリ&フレームワーク40選 JavaScriptのライブラリやフレームワークを使うことで、幅広い特徴と機能により、ウェブサイトやアプリケーションの開発が容易になります。これを可能にしているのが、JavaScriptの動的で柔軟であるという特性でしょう。2020年に実施されたStackOverflowの調査によると、JavaScriptは回答者の67.7%が使用しており、最もよく使われているプログラミング言語として記録を更新(8年目)しています。 その汎用性の高さから、バックエンドとフロントエンド両方の開発やテストに利用できます。その結果、さまざまな目的に対応する数多くのJavaScriptライブラリやフレームワークを見つけることができます。それゆえに、プロジェクトでどれを利用すべきかと迷ってしまうこともあるでしょう。 しかし、心配はご無用
Dockerは、コンテナ型の仮想空間で開発およびデプロイを行うことができる人気のソフトウェア。そしてUbuntuは、Linuxディストリビューションであり、Dockerのサポートが充実しているOSとして知られています。 UbuntuにDockerをインストールすると、UbuntuのOSカーネルを共有する軽量の仮想マシンで、開発プロジェクトに理想的なプラットフォームを構築することができます。この記事では、これを実現する4つの方法をご紹介します。 Dockerとは Dockerは、コンテナ型の仮想空間(Dockerホスト)上でアプリケーションを構築・実行するための、ポータブルな開発環境を提供しています。コンテナのイメージは、ノートパソコンからクラウドまで、Dockerが利用できる環境であれば、変更なしでどこでも利用することができます。つまり、実行環境間の差異がなくなり、開発者の負担が軽減するこ
WordPress Elementorの基本 インターネット黎明期、サイトを作成するには、高度なウェブ開発・デザインのスキルが必要であり、そうでなければ、プロの力を借りる必要がありました。そのため、サイトの構築には時間がかかり、しばしばイライラが溜まり…コストも膨れ上がるありさま。 最新のページビルダーを使えば、特別なスキルを持たずに、おしゃれなデザインの高速サイトを構築できます。一度サイトを構築してしまえば、プログラマーでない人でも、いつでも素早く簡単にコンテンツを追加したり、レイアウトを変更したりすることができます。 WordPressのページビルダーには様々なものがありますが、500万以上のアクティブインストール数を誇る Elementorプラグインは最も人気のあるものの一つ。 Elementorでは、直感的なドラッグ&ドロップ操作で、ウェブサイト全体からランディングページまで、あら
プロジェクトに使用する技術スタックの選定は、一筋縄にはいきません。多くの場合、特にGraphQLとRESTful APIのどちらを選ぶかということになると、現状や今後を見据えたAPIデザインアーキテクチャを選択することが重要になります。 APIを構築するとなると、重要な形式として次の4つが挙げられます─SOAP、GRPC、REST、そしてGraphQLです。とは言え、API構築の際にはRESTとGraphQLに絞ることが多い、というのが実情です。というのも、RESTが従来のSOAPやGRPCによるAPI構築の方法を一変させたという経緯があります。 それをさらに上回る選択肢という触れ込みでGraphQLが語られる傾向にあります。現に、多くの開発者が、GraphQLがRESTに取って代わると予想するほど。REST APIを利用した開発の際によくある問題を、GraphQLが効率的に解決してみせる
サイトの脅威を排除する優れたWordPressセキュリティプラグイン ウェブサイトへの初期投資を行う段階で、サイトの保護には力を入れるのが賢明です。ハッキング、マルウェア、バックドア攻撃、SEOスパムなどは、サーバーや訪問者データ、ウェブサイトのインフラを悪用する脅威のほんの一部に過ぎません。 セキュリティの脅威は、将来の収益、顧客の信頼、そしてサイト全体の安全性を危険にさらします。そこで、潜在的な脅威をすべて阻止する優秀なWordPressのセキュリティプラグインを厳選しました。 サイトにセキュリティプラグインを導入するのは、住宅で言えば、保険に加入し、警報システムを設置するようなものです。その投資には、高額な頭金、検査費用、融資などが必要になります。それに準じる投資をウェブサイトに行ったら、最大限に保護したいと思うのは当然のこと。この記事で、サイトの保護についてみていきましょう。 Wo
MySQLは、Oracleが開発してサポートするオープンソースのSQLリレーショナルデータベース管理システムです。 上記は、「MySQLとはなんですか?」という質問に対する1文の短い回答ですが、もう少し分かりやすく説明させてください。 データベースは、データを簡単に使用したり取得したりできるように、そのデータをまとめて構造化したものです。WordPressサイトの場合、「データ」とは、ブログ投稿の内容、サイトに登録されているユーザーの情報、自動読み込みデータ、重要な設定・構成などです。 MySQLは、そのデータを保存したり管理したりする人気のあるシステムの一つにすぎませんが、WordPressサイトで特に人気のあるデータベースソリューションです。 参照文献:WordPressの「MySQL Server Has Gone Away」エラーの処理方法 と MySQL 1064エラーを修正する
誰にでも、日常使いのお気に入りのブラウザがあるはずです。多くのブラウザの機能は似通っていますが、よりセキュリティとプライバシーに力を入れたブラウザが存在することを「知る」ことが重要です。安全なブラウザを選ぶことで、ネット上でのあらゆる操作を危険から守ることができます。 セキュリティに力を入れたブラウザはデータの安全な保持を助け情報の傍受を効果的に防いでくれます。人気ブラウザの多くにセキュリティやプライバシー関連の機能がありますが全てが使いやすいわけではありません。 今回は、皆さんのニーズに合った安全なブラウザ選びをお手伝いします。ChromeからTorまで、今人気のブラウザを6つ厳選しました。 早速、その中身を見ていきましょう。 安全なブラウザ選びについて動画での解説もご用意しています。 安全なブラウザとは ほとんどのブラウザは、デフォルトで非常に安全かつプライベートな環境を提供しているわ
誰にでも、できればやりたくないと思うプロジェクトがあるはずです。コードが管理不能になり、スコープが拡張し、修正の上に修正を重ねる有様。コードが絡まり合い、構造が崩壊。コーディングは混乱を招くことがあります。 そこで責任の所在がはっきりした、シンプルで独立したモジュールです。これを使用することで、プロジェクトはスムーズに進みます。コードをカプセル化すると、実装についての心配も軽減できます。あるインプットが与えられたときにモジュールが何をアウトプットするかが分かっていれば、その目標が「どのように達成されたか」を理解する必要は必ずしもないのです。 モジュールの概念を単一のプログラミング言語で理解するのは、難しいことではありません。しかし、ウェブ開発の世界では、多様な技術を組み合わせることが必要になります。ブラウザはHTML、CSS、JavaScriptを解析し、ページのコンテンツ、スタイル、機能
次のページ
このページを最初にブックマークしてみませんか?
『Kinsta® - Fast, secure, feature-rich WordPress hosting』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く