@Blog

ブログをワードプレスからLaravelへ

2025.09.01

Logging

おはようございます.ブログをワードプレスからLaravelへ置き換えていこうか悩んでいます.チャッピーさんで調べった結果.

WordPress を Laravel に統合またはブログを移行する際に使える「プラグイン」やライブラリについて、おすすめの方法とその特徴を整理してご紹介します。

おすすめの主要アプローチ

1. Corcel

• WordPress データ（投稿、カスタム投稿タイプ、メタデータなど）を Laravel から直接取得できる Eloquent ベースの橋渡しライブラリです。Composer で簡単にインストールでき、設定ファイルで WP の DB 接続やモデル構成を指定可能です。(WP Engine, GitHub)
• WordPress を「バックエンド」として活用しつつ、Laravel を「フロントエンド／アプリロジック基盤」として完全に使いたい場合に最適です。

2. WordPress Pete

• WordPress 側にプラグイン（アプリのように動作）として組み込み、WordPress 管理画面から Laravel との統合を設定できます。試用も可能です。(WP Engine, Aalpha)
• Laravel 側から WordPress コンテンツを表示・活用したい場合に便利です。

3. Acorn

• Roots.io が開発したライブラリで、Laravel の Blade テンプレートや Artisan コマンド、マイグレーション機能を WordPress 内で使えるようにします。(Roots)
• WordPress 内でモダンな Laravel 開発体験（Blade, Artisan, Migration）ができるようになります。例えとして：wp acorn make:controller や Blade テンプレートの活用など。(Roots)

その他のアプローチ・参考情報

• WordPress REST API を使う方法
  WordPress から REST API 経由でコンテンツを取得し、Laravel 側で API 呼び出しする形もあり。比較的シンプルです。(Laracasts, Codeable)
• 中ミドル層としての統合
  Laravel をバックエンド、WordPress をフロントエンドに設定し、ログイン機能や API 呼び出しを含めた構成も可能です。(Medium)
• Reddit 上の意見
  Laravel はあくまで「フレームワーク」であり、WordPress は即使える CMS。ブログ用途中心であれば WordPress のままでも十分との声もあります。但し、October CMS や Canvas のような Laravel ベース CMS を使う選択肢もあります。(Reddit)

比較まとめ

まとめ

• 即時利用・簡単統合：まずは WordPress Pete を試してみるのがおすすめ。
• 柔軟で高性能な連携 を求めるなら、Corcel による直接 DB アクセスが強み。
• 開発体験の統一（Blade や Artisan を WordPress 内で使いたい場合）は Acorn が魅力的です。
• 軽めの統合・API中心構成 を望む場合は、REST API を使ったアプローチも便利です。

という結果が返ってきたわけですが、一番妥当なのはCorcelかなと思っています、ただ、本当に移行するかは結構大変な感じがします.移植すれば後々、いろいろと出来ることが広がるかなと思っています.フロント側をvue（ビュー）かReact（リアクト）に変更するにしてもメンテは楽になりそうな予感もします.

悩ましいですね…

明日へ続く

タグ

```, （:, アクセス, アプリ, アプリロジック, アプローチ, いん, インストール, エンド, おすすめ, カスタム, こと, コマンド, コンテンツ, サン, シンプル, そう, その他, タイプ, チャッピー, データ, テンプレート, バック, ビュー, ファイル, フラグ, フレーム, プレス, ブログ, フロント, ベース, マイグレーション, まとめ, まま, ミドル, メタデータ, メンテ, モダン, モデル, よう, ライブラリ, リアクト, ログイン, ワーク, ワード, わけ, 一番, 中心, 主要, 予感, 体験, 便利, 保守, 利用, 動作, 十分, 即時, 参考, 取得, 可能, 呼び出し, 基盤, 場合, 変更, 大変, 妥当, 完全, 実現, 強み, 強力, 後々, 情報, 意見, 感じ, 投稿, 指定, 接続, 整理, 方法, 明日, 最適, 有効, 柔軟, 構成, 構築, 橋渡し, 機能, 比較, 活用, 特徴, 用途, 画面, 直接, 移植, 移行, 管理, 簡単, 紹介, 経由, 結合, 結果, 統一, 統合, 表示, 設定, 試用, 軽量, 連携, 選択肢, 開発, 高性能, 魅力,

タグを出現回数によってタグの文字の大きさを変更するコードを実装しました.

2025.08.25

Logging

おはようございます.先日の休みに昼寝から目を覚ましたときに「あっそういや」と思って実装した機能がタグを出現回数によってタグの文字の大きさを変更するコードでした.記事の最後の最後あたりに付いているタグ文字の大きさが記事によって変わっているのが分かると思います.

こういうアイディアはもともとあるけれど、そのアイディアさえも思いつかなくなってしまったら悩ましいですね.因みにリアクトをこのサイトに実装するという計画はまだ実行に移していません.

if(document.querySelector('#main_content')){
    let txt = document.querySelector('#main_content').textContent;
    let tagElements = document.querySelectorAll('.tag');
    [...tagElements].forEach(element => {
        element.style.fontSize = fontSizeChange(txt,element.textContent);
    });
}
function fontSizeChange(text,word)
{
  const regex = new RegExp(word, "gi");
  const matches = text.match(regex);
  let cnt = matches?.length ?? 0;
  const sizes = ['medium', 'x-large', 'xx-large', 'xxx-large'];
  let fontSize = sizes[
    cnt > 6 ? 3 :
    cnt > 4 ? 2 :
    cnt > 2 ? 1 : 0
  ];

移したら技術共有か何かで記事を書くかもしれないです.

明日へ続く

タグ

```, アイディア, あたり, コード, サイト, タグ, とき, リアクト, 休み, 先日, 共有, 出現, 回数, 変更, 実行, 実装, 技術, 文字, 明日, 昼寝, 最後, 機能, 計画, 記事,

見栄えは同じだけど徐々にReactやVueを使用したサイトに変えていきます.

2025.08.20

Logging

見栄えは同じだけど徐々にReactやVueを使用したサイトに変えていきます.Laravel（ララベル）で作っているサイトもイナーシャをインストールしてリアクトと連動していく形に置き換えていこうと思います.

composer require inertiajs/inertia-laravel
php artisan inertia:middleware
npm i @inertiajs/inertia @inertiajs/inertia-react

Reactの基礎は大体身についたけど、まだまだな感じもするのでもう少し高度な技術などを覚えるには実践的にサイトを変えていくのが一番手っ取り早いかなと思ったのでこのサイトを手始めに変えていきます、尚ワードプレスは一番後回しにします.

というのもmysqlと直に接続出来そうにないので…やろうと思えば出来るだろうけど脆弱過ぎて危険なのでワードプレスをAPI化してそれを表示する形になりそうです.もともとワードプレスにはその機能が備わっているのでそれを使用する感じです.

明日へ続く

タグ

イナーシャ, インストール, サイト, そう, それ, プレス, やを, ララベル, リアクト, ワード, 一番, 使用, 危険, 基礎, 大体, 実践, 後回し, 感じ, 手始め, 技術, 接続, 明日, 機能, 脆弱, 表示, 見栄え, 連動, 高度,

ReactNativeのボタンがiosとAndroidでは挙動が違うので代替。

2021.11.18

Logging

今日はReactNative（リアクトネイティブ）でアプリを制作しながら勉強している中で、ボタンを使ってみたら・・・iosとAndroidでは挙動というか見栄えが違うのですよ、ドキュメントにもそう書いていた?。なので、ボタンじゃなくてこちらを使用するほうが良さげです。

Color of the text (iOS), or background color of the button (Android).

こちら【TouchableOpacity】などを使用してボタンを作成しないといけないみたい。こちらで作るとios、Android同じ見栄え（デザイン）になります。作ってて思うことは師というかメンターがいればもっと効率的に開発できそうです。

師匠がほしい今日此頃・・・。

以上、現場からでした。

import React, { useState } from "react";
import { StyleSheet, Text, TouchableOpacity, View } from "react-native";

const App = () => {
  const [count, setCount] = useState(0);
  const onPress = () => setCount(prevCount => prevCount + 1);

  return (
    <View style={styles.container}>
      <View style={styles.countContainer}>
        <Text>Count: {count}</Text>
      </View>
      <TouchableOpacity
        style={styles.button}
        onPress={onPress}
      >
        <Text>Press Here</Text>
      </TouchableOpacity>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    paddingHorizontal: 10
  },
  button: {
    alignItems: "center",
    backgroundColor: "#DDDDDD",
    padding: 10
  },
  countContainer: {
    alignItems: "center",
    padding: 10
  }
});

export default App;

タグ

Android, background, button, color, from, import, iOS, of, OR, quot, react, ReactNative, Text, The, TouchableOpacity, useState, アプリ, こちら, こと, デザイン, ドキュメント, ネイティブ, ボタン, メンター, リアクト, 中, 今日, 今日此頃, 代替, 作成, 使用, 制作, 勉強, 師, 師匠, 挙動, 現場, 見栄え, 開発,