-
gooliya.papa - 17 Jun, 2025
如何在 FilamentPHP 中使用 Spatie Setting 插件
在 Filamentphp 開發過程中,使用 Spatie Setting 插件,一開始一直卡關,所以寫這篇文章記錄一下。 安裝 Spatie Setting 插件 插件 filament-spatie-settings 安裝 spatie-laravel-settings-plugin composer require filament/spatie-laravel-settings-plugin:"^3.2" -W安裝相關 migration 和 class 用 spatie/laravel-settings 這個套件,所以需要根據 installation 來安裝相關 migration 和 class安裝 migrationphp artisan vendor:publish --provider="Spatie\LaravelSettings\LaravelSettingsServiceProvider" --tag="migrations" php artisan migrate你會取得 migration 如下,並且執行 migrate use Illuminate\Database\Migrations\Migration; use Illuminate\Database\Schema\Blueprint; use Illuminate\Support\Facades\Schema;return new class extends Migration { public function up() { Schema::create('settings', function (Blueprint $table): void { $table->id(); $table->string('group'); $table->string('name'); $table->boolean('locked')->default(false); $table->json('payload'); $table->timestamps(); $table->unique(['group', 'name']); }); } };安裝 classpublish setting 的 class,位置 app/Settings php artisan vendor:publish --provider="Spatie\LaravelSettings\LaravelSettingsServiceProvider" --tag="config"製作 setting class# php artisan make:setting SettingName --group=groupName php artisan make:filament-settings-page ManageGeneras GeneralSettings這樣就會在 app/Settings 目錄下產生一個 GeneralSettings.php 的檔案。 use Spatie\LaravelSettings\Settings;class GeneralSettings extends Settings { public string $site_name; public bool $site_active; public static function group(): string { return 'general'; } }新增你的 setting class 到你的 /config/settings.php /* * Each settings class used in your application must be registered, you can * add them (manually) here. */ 'settings' => [ GeneralSettings::class ],產生需要的 properties php artisan make:settings-migration CreateGeneralSettings這樣會在 database/database/settings 目錄下產生一個 ...create_general_settings.php 的檔案。 use Spatie\LaravelSettings\Migrations\SettingsMigration;return new class extends SettingsMigration { public function up(): void { $this->migrator->add('general.site_name', 'Spatie'); $this->migrator->add('general.site_active', true); } }php artisan migrate這樣就完成 spatie/laravel-settings 基礎設定 準備 filament setting Resource php artisan make:filament-settings-page ManageGeneras GeneralSettings 這樣會在 app/Filament/Pages 下產生一個 ManageGenerals.php,確認 $settings 是不是剛剛的 Setting class protected static string $settings = GeneralSettings::class;輸入在自己的 Resource 裡面,然後在 form() 方法裡面新增欄位。 use Filament\Forms\Components\Repeater; use Filament\Forms\Components\TextInput; use Filament\Forms\Form;public function form(Form $form): Form { return $form ->schema([ TextInput::make('copyright') ->label('Copyright notice') ->required(), Repeater::make('links') ->schema([ TextInput::make('label')->required(), TextInput::make('url') ->url() ->required(), ]), ]); }結果如下
-
gooliya.papa - 21 May, 2025
Google 重磅推出 Jules AI 對決 OpenAI 的 Codex
Google 在 2025 年 5 月 21 日宣布推出其最新的 AI 編程助手 Jules,旨在與 OpenAI 的 Codex 競爭。Jules 是一個強大的 AI 編程助手,專為開發者設計,能夠理解自然語言指令並生成高質量的程式碼。 以下就來試試看,如何透過 Jules 來幫我的一個 Filament 專案,加上我想要的功能。 我已經安裝 spatie-laravel-settings-plugin Plugin,我想讓 EmployeeResource.php 這個檔案裡面的其中一個欄位,能夠透過設定檔來控制。 開啟 Jules 並且連結 Github開啟 Google Jules選擇 Repo根據我的 prompt 生成我需要的程式碼 feat: assign config value $hr_base_salary to Employee resource's base_salary過程中會出現一些 error,Jules 嘗試自動修復環境問題。最後成功生成了我需要的程式碼,並且詢問要不要開新分支在我的 Github Repo 中可以看到 Jules 自動生成的分支總結 整體來說算是一個不錯的體驗,Jules 能夠快速理解我的需求並生成相應的程式碼。雖然在過程中遇到了一些錯誤,但它能夠自動修復並繼續進行。這對於開發者來說是一個很大的幫助,特別是在處理複雜的專案時。 我相信一個好的且明確的 prompt 可能會影響到 AI 執行的結果。這或許是我們需要多加學習如何當一個好的 prompt engineer。
-
gooliya.papa - 08 May, 2025
如何讓 Obsidian Canva 的文字置中
透過新增 CSS snippets進入 Obsidian Settings在彈出的視窗中,前往「外觀」(Appearance),然後向下捲動直到你看到「CSS 程式碼片段」(CSS snippets)。你應該會在右側看到一個資料夾圖示,點擊它以開啟程式碼片段資料夾。這時 Windows 資料夾應該會跳出,在空白處點右鍵,選擇「新增」->「文字文件」。將這個文字文件重新命名為 Canvas-Snippets.css(系統可能會詢問你是否確定要重新命名,請確認)。雙擊這個檔案,然後將以下提供的 CSS 程式碼貼上並儲存(關閉檔案並確認儲存變更)。.canvas-node-content:not(.is-loaded):not(:has(.has-list-bullet)) { text-align: center; }關閉資料夾視窗,別忘了啟用剛剛建立的 Canvas-Snippets(此時你的 Obsidian 設定應該還是開著的)。Ref
-
gooliya.papa - 19 Mar, 2025
Mermaid 流程圖轉換到 draw.io 使用
如何將 Mermaid 轉換到 draw.io 先談談什麼是 Mermaid Mermaid 是 Mermaid.js,它是一個 JavaScript-based 用來畫流程圖、甘特圖、時序圖等的開源圖表語言。可以透過簡單的文字描述來產生圖表。 很常使用在 Markdown 文件中,例如 Github 中的 readme.md 文件。 為什麼要這樣做呢? 因為我慣用的是 draw.io,有時候後透過 GPT 產生的流程圖,可以直接複製貼上到 draw.io。 插入 Mermaid 流程圖Reference
-
gooliya.papa - 07 Feb, 2025
使用 Hugo 架設 Blog
架設 Hugo 起手式環境: Mac OS Sequoia 15.3 Terminal: iTerm2安裝 Hugo brew install hugoHUGO 指令測試 安裝完成後,在 Terminal 輸入以下指令,確認是否安裝成功。 hugo version建立新 Blog hugo new site blog建立新文章 為了方便管理,我會將文章放在 posts 資料夾中。 hugo new posts/2025/2025.md啟動 HUGO 伺服器 -D 參數可以讓草稿文章也顯示在網頁上。 hugo server -D開啟 http://localhost:1313/ 即可看到 Hugo 預設的網頁。 安裝佈景主題 進入 Hugo Themes 選擇一個喜歡的主題,將它加入到 Blog 中。 這邊選擇 PaperMod 主題。 透過官方推薦的將 submodule 加入到專案中。 git init git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod git submodule update --init --recursive # needed when you reclone your repo (submodules may not get cloned automatically)修改 hugo.toml # 新增 theme theme = 'PaperMod'Local Build 出可以部署的檔案 ## --gc: 執行完後清除 cache ## --minify: 壓縮檔案 hugo --gc --minify部署到 Github Pages 在 Github 上建立一個新的 Repository,名稱為 {你的 Github id 名稱}.github.io。## Git init git branch -M main## 新增 remote git remote add origin https://github.com/{你的Github id 名稱}/{你的 Github id 名稱}.github.io.git## 將檔案加入到 git git add . git commit -m "Hugo 首次 commit"## 將檔案推到 Github git push -u origin main接著進入 https://{你的 Github id 名稱}.github.io 即可看到你的 Blog。