Archive

開発の記事

  1. vuex-module-decorators
    • 開発

    AI要約 この記事では、Vue.jsとTypeScriptでの状態管理ライブラリVuexの利用方法を探る過程を紹介しています。特に「vuex-module-decorators」を使ったクラスベースの書き方に注目し、Nuxt.jsとの関連も踏まえつつ、持続可能でメンテナンスしやすいコードを目指す姿勢が述べられています。後半では歩行者用信号機のスピーカー設置についての観察もつづられています。

  2. Vue.js (Vue-Cli) の ESLint 関連の参考リンク
    • 開発

    AI要約 Vue.jsの開発環境におけるESLint関連の設定や参考リンクをまとめました。公式の設定リファレンスやプラグイン情報、スタイルガイドとESLintルールの対応、環境構築手順、TypeScriptとの連携方法、export/importの基本など、開発者向けの実用的な情報を提供しています。これにより、コード品質向上と統一的な開発環境を支援します。

  3. Vue.js 苦戦中
    • 開発

    AI要約 Vue.jsの開発中に「is defined but never used」というコンパイルエラーに直面し、外部ファイルから読み込んだinterfaceが使われていないと誤判定され苦戦。調査の結果、eslint-loaderの不足が原因であることが分かり、npmでeslint-loaderをインストール後、ビルドエラーが解消。問題は解決したものの、完全に納得はいっていない様子を綴ります。

  4. WordPressの移行に際して参考になるサイト
    • 開発

    AI要約 WordPressの移行に役立つ情報を紹介しています。テーブル接頭辞を変更した際には、DB内の該当箇所を正しく置換する必要があり、その具体例と参考サイトを示しています。また、ドメイン変更時には「Search Replace DB」ツールを使うことで、DB内のドメイン一括置換が簡単に行え、効率的な移行が可能です。

  5. 本日、参照した役立ちリンク集
    • 開発

    AI要約 本記事は、プログラミング環境でよく使用されるAtomエディタの日本語化方法や、ESLint導入に伴うビルドエラーへの対処法、TypeScriptの書き方、Vue.jsにおけるデータバインディングやVuexの活用方法について、参考リンク集としてまとめています。各トピックの初心者向け解説と実際のトラブル経験に基づく知見が含まれており、フロントエンド開発者に役立つ情報を提供します。

  6. Webpack の Config はどこに?
    • 開発

    AI要約 Vue.js開発でWebpackの設定ファイルが見当たらず、Vue-Cliを使って新規プロジェクトを作成。Vue-uiのGUIで簡単に設定し、vue.config.jsがWebpackの設定ファイルに相当することを確認しました。プラグイン管理もUI上で手軽に実施可能です。

  7. WordPress のカスタム投稿タイプにリビジョンを追加する
    • 開発

    AI要約 WordPressのカスタム投稿タイプにリビジョン(バージョン管理)機能を追加する方法について解説しています。記事では、function.phpにadd_post_type_support関数を使って簡単にリビジョンを有効化できることを紹介し、実際の設定例やphpMyAdminでの確認画面も掲載しています。また、リビジョンによるデータベース肥大化の懸念についても言及し、適切なインデックス設定で問題は軽減される可能性があると述べています。

  8. WordPress で Gutenberg を用いる
    • 開発

    AI要約 WordPressの最新コンテンツエディタ「Gutenberg」をカスタム投稿に適用する方法について解説しています。function.php内のregister_post_typeに「'show_in_rest' => true」を追加するだけで利用可能になり、今後の投稿作成に活用予定。また、既存カスタム投稿記事はGutenbergで正常にブロック変換されない場合があるため注意が必要です。

  9. タイムゾーンの設定がおかしい
    • 開発

    AI要約 ロリポップサーバー上のWordPressでPHPのタイムゾーン設定による表示不具合が発生。サーバー自体は「Asia/Tokyo」に正しく設定されているが、WordPressのdate関数はUTCで動作し、管理画面の設定も反映されていない模様。最終的に、PHPコード内で直接タイムゾーンを強制設定する対処を実施したが、根本原因は不明。将来的なトラブルの可能性を懸念している。

  10. Vue.js の Style の書き出しが分からない
    • 開発

    AI要約 Vue.jsでのStyle要素の読み込み順序に関して、Bootstrapが複数回読み込まれ最後に再度読み込まれるため、スタイルの上書きが無効になる問題を指摘しています。main.tsやコンポーネント内で読み込むCSSの順序を理解しないと、意図通りのレイアウト作成が困難になるため、読み込みタイミングの調査が必要です。

  11. ローカル開発環境 WordPress の DebugBar プラグインで読み込みエラー
    • 開発

    AI要約 3月にWordPressのローカル開発環境でDebugBarプラグイン使用時に発生した「create_function()の非推奨エラー」について記録。PHP7.4環境下で表示されるこのエラーは、php.iniや.htaccessの設定変更が反映されず解決できなかったが、該当関数の前に@を付けてエラー表示を抑制。プラグインは本番で使わないため暫定対応とした。

  12. TypeScript 苦戦中
    • 開発

    AI要約 TypeScriptのコンパイルに成功したものの、その過程での型チェックに苦戦しています。厳密な型チェックに時間を要し、実際のプログラム開発がなかなか進まない現状を述べています。

  13. 深刻なマスク不足(20年2月末)
    • 開発

    AI要約 この記事では、2020年2月末の深刻なマスク不足に触れつつ、筆者がVue.jsを習得するためにTypeScriptの理解を深める必要性を感じたことを紹介しています。特に、山田祥寛氏の著書『速習TypeScript』をわかりやすいリファレンスとして薦めており、他の関連書籍も紹介しながら開発を続ける意向を述べています。

  14. どのフレームワークを選択すべきか
    • 開発

    AI要約 本記事では、JavaScriptフレームワークのAngular、Vue.js、Reactについて比較・検討しています。特にパフォーマンス面ではAngularが優れているという評価や、Vue.jsは初心者向けで学習コストが低い点が紹介されています。また、音を扱うウェブアプリ開発にはパフォーマンスが重要であり、その観点からフレームワーク選びが議論されています。最終的に筆者は、既に扱い始めているVue.jsを継続する方針を示しつつ、必要に応じて他のフレームワークの機能も検討したいと述べています。

  15. Vue.js 奮闘中(20年2月10日)
    • 開発

    AI要約 Vue.jsを用いた開発に取り組む中で、特に親子コンポーネント間のデータや関数のやりとりに注目しています。TypeScript環境で発生した$refsの型エラーを明示的な型定義で解決し、$emitの記述も改善しました。Reactより分かりやすい印象のVue.jsを今後も使い続ける予定です。

  16. Mac の Command Line Tools が見つからない
    • 開発

    AI要約 Macでnpm install中に node-gyp エラー発生。Xcodeが無いかCLTが認識されず、XcodeをApp Storeから再インストールしたが改善せず。xcode-select --installでは既にCLTが存在と表示。結局、Xcodeのメニューから公式サイト経由でCommand Line Toolsを手動ダウンロード・インストールし問題解決。Mac環境での開発ツールインストールの手間と注意点をまとめた。

  17. Vue.js 奮闘中(20年2月5日)
    • 開発

    AI要約 Vue.jsを用いて動的に要素の高さを調整しようとしていますが、うまく動作しない問題に直面しています。TypeScriptを導入し、Windowサイズの変更検知と高さ調整を試みています。参考にした記事も共有し、コード例を掲載しています。

  18. npm で苦戦中(20年2月)
    • 開発

    AI要約 WindowsのPowerShellでnpmを使ってパッケージをインストールしようとした際に、node-sassが原因のパーミッションエラーが発生。問題はnpm run serveでサーバーを起動したままだったためで、一度サーバーを停止してからnpm installを実行すると正常に完了した。OSに関わらず冷静な対処が重要であると述べている。

  19. エディタ選び
    • 開発

    AI要約 長年Vimを使用していたが、Windows環境の変化を機にAtomも利用するようになった。Vue.jsの開発に適したプラグインをQiitaの記事を参考に導入し、効率的な開発環境を整えている。具体的には「language-vue-component」「vue-autocomplete」「vue-snippets」など複数のプラグインを導入し、開発の進捗に期待している。

  20. Vue.js + Bootstrap
    • 開発

    AI要約 この記事では、Vue.jsのプロジェクトにBootstrapを組み込む手順を解説しています。まずnpmでvue、bootstrap-vue、bootstrapをインストールし、関連する設定ファイルを参考サイトを元に整えます。開発サーバー起動時に不足するsass-loaderとnode-sassを都度インストールして、最終的にサーバーの起動を成功させる手順を示しています。

©Hiroshi Nagayama