サイボウズ株式会社が提供しているSaas「kintone」に関する情報や、独自に開発したプラグインを公開しています。 普段の開発に使用しているTypeScriptに関する情報も紹介しています。
kintoneを使用していて、Twitterのハッシュタグのような機能を使用したいと思ったことはありませんか？ただ、フリーワードでユーザーがタグを登録するとなると、サブテーブルなどを活用しなければうまく実装することができません。
SSGでサイト更新時に、サイトマップを自動的にGoogleに送信する
ウェブサイトには定期的にGoogleのクローラーが巡回しに来ますが、その時にサイトマップの変更を確認することはないそうです。クロール頻度の設定とは別に、サイトマップの更新をGoogleに伝える必要があります。今回はSSGのビルドと同時に、サイトマップを送信する方法を紹介します。
Wordpressのテーマはおしゃれなものが多いですよね。その中でも、作業工程などを説明する際に便利なstep1, step2...と垂直方向に表示されるアレ。憧れます。今回は、できる限りタグを少なく、簡単に垂直ステップデザインを実装する方法を紹介します。
Google Tag Managerを使って、AMP対応サイトでアナリティクスを使用できるようにする
amp-analyticsタグを使ったAMP環境化でのGoogleアナリティクスの実装について、同じ穴に陥まる人が1人でも減るように残しておきます。HTML ≒ AMPだと思っていましたが、HTML ≠ AMPだということを思い知らされました。
また、Kintoneのフィールド検索には制約があり、日本語であれば2文字以上、アルファベットと数字は単語単位でしか検索ができません。そのため今回は、この問題を解決することができる、僕が開発したプラグインの紹介します。オープンソースで公開しており、無料で利用できます。
表示するフィールドを制御するタブを実装するプラグインを開発しました【無料公開】
アプリのフィールド数が増えてくると、目的のフィールドがどこにあるのか見つけるのが難しくなります。今回はスクロールに追従し、フィールドの表示・非表示を制御するタブを実装するプラグインを開発しましたのでご紹介します。
FirebaseのSparkプランを使い倒すために、Realtime-Databaseのデータをスプレッドシートにキャッシュして、Next.jsからアクセスするという処理を別のウェブサイト作成時に実装しました。需要があるか分かりませんが、その中で使用したGAS・Next.js…
セルの垂直配置設定(上寄せ・中央寄せ・下寄せ)をGASから動的に制御する【Google Apps Script】
Google スプレッドシートでは、セルの垂直配置設定が標準で下揃えになっています。シート内全てについて同じ垂直配置設定を適用させる場合は、あらかじめスプレッドシート側で設定しておけば問題ありませんが、動的に、部分的に設定したい場合もあるかと思います。今回はGAS…
今までChromeがIEのシェアを超えても、EdgeのレンダリングエンジンがChroniumになっても、 日本においてIEユーザーは根強く一定割合残り続けていました。そのIE…
Kintone JavaScriptカスタマイズにおける例外/エラー処理について
JavaScriptはその柔軟性から、エラーにならない工夫が容易です。必要となって変数を定義したんであれば、うまく取得できない場合はエラーを出力するべきです。今回はKintoneのJavascriptカスタマイズにおけるエラー処理についてお話します。
Object.entries()で厳格に型定義された結果を受け取りたい【typescript】
typescriptの標準設定では、Object.entries()の型は以下のように定義されています。つまり、Record<string, number string>のような型が存在する場合、返り値の型は[string, number string…
2021年12月時点で、1度に取得できるアプリ数の上限は100件となっています。なかなかアプリ数が100件を超えることはないかもしれませんが、少しずつアプリが増えていき、10…
Sheetjs(xlsx)でスタイルを適用したExcelデータを出力する
皆さんはSheetjs、活用されていますか？独自にスプレッドシートを組み立てたり、HTMLのtable要素をそのままExcel…
Array.findの使い方、速度、使うべき理由【JavaScript】
今回はArray.prototype.find()の使い方とそのメリットを紹介します。速度を追求する場合、findよりforループの方が高速です。実際に速度の検証を行い、なぜfindが必要なのか説明します。
Dateオブジェクトを任意の文字列でフォーマットする(yyyy-MM-ddなど)【コピペで使えるJavaScriptコード】
Dateオブジェクトには様々なフォーマット関数が用意されています。任意の文字列で変換せずとも解決する可能性がありますので、要件に合うものがないか確認してみてください。まず結論だけ載せておきます。
一覧・詳細画面でフィールド名を取得する【Kintone JavaScriptカスタマイズ】
kintone.events.onのコールバック関数の引数であるevent…
今回は形態素解析が簡単に実行できるライブラリ「kuromoji.js」を使って、任意の文字列を品詞ごとに分解・解析する方法を紹介します。
レコードのサブテーブルを並び替えて登録する【Kintone JavaScriptカスタマイズ】
こんにちは、皆さんはサブテーブル、利用されていますか？とても便利な機能ですが、情報量が増えてくると、閲覧性に問題が起こってしまうこともあります。今回は解決策の1つとして、サブテーブルの各行を並び替えて登録しなおすJavaScriptカスタマイズを紹介いたします。
レコード一覧表示時(app.record.index.show)のサンプルコード集【Kintone】
KintoneのJavaScript…
スライダーを使って数値を設定できるKintoneプラグイン【無料公開】
Kintoneの数値フィールドには上限・下限を設定することができますが、設定した値が全体のどのあたりなのか、視覚的に把握したいことはありませんか？今回はスライダーを使って数値フィールドを設定できるプラグインを開発しましたので、紹介いたします。
レコード編集時(app.record.edit.show)のサンプルコード集【Kintone】
KintoneのJavaScript…
【Kintone】APIを使ったレコードの削除→登録による更新【デリートインサート】
APIを使ってレコードを更新したい場合、基本的にはPUT APIを使用します。ただ、仕様や安全性を考慮し、一定条件のレコードを全て削除したうえで、レコードを再生成しなければならない状況も起こりえます。今回はそういった場合のコードサンプルを紹介いたします。
ルックアップフィールドの関連付け問題を解決するプラグインを開発しました
ルックアップフィールドは、Kintone…
APIで取得したフォーム設定から、指定したフィールドのみを抽出する
KintoneではAPIを使用して、指定したアプリの各フィールド情報を取得することができます。ただ、このAPIのリクエストパラメーターはアプリIDと言語の設定しかできず、指定したアプリのすべてのフィールドが取得されます。レコードID…
特定のHTML要素のclassListを全て削除(リセット)する方法
特定のHTML要素に含まれているclassを削除する場合、classList.remove()を使用します。ただ、この方法を使用する場合、対象の要素にどういったclass名が使用されているか知っておく必要があります。今回は対象HTML要素にどのようなclass…
API トークンを発行したユーザのコンタクトとなっているユーザ一覧を取得します。kintone.proxy の返り値は Promise オブジェクトなので、then、catch…
最近ツイッターもフェイスブックも、APIを使用するための審査が厳しくなっているようですね。申請にあたって色んな作文を書かないといけませんが、楽天APIは幸い、楽天のアカウントさえ持っていれば利用することができます。今回はその中でも、楽天ブックス書籍検索API…
Kintoneの初期状態のフォントは、2021年時点ではメイリオとなっており、これを変更する機能はありません。また、サイボウズはCDNを提供していますが、対象はJavaScript…
引数に各パラメータを設定することで利用できます。返り値が Promise オブジェクトなので、送信を確認してから処理したい場合は以下のような記述が必要です。今回はメッセージを送りたいだけなので、POST を使用します。
アクセス権限のないアプリにJavaScriptからだけアクセスを許可する方法
KintoneでAPIを使用する際、認証方法としてアカウントID、パスワードを使用するか、APIトークンを使用するかを選択することができます。を利用した場合、各アプリへのアクセス権限は、そのアカウントに対する設定に依存します。そのためAPI…
API_TOKENの部分に利用するユーザのAPIトークンを貼り付けてください。APIトークン(使用ユーザ)も動的にしたい場合は、モジュールではなくクラスを作成するか、定数から引数に移動させてください。後は、上記のファンクションを以下のように呼び出すだけで取得できます。
ソースコードAPI_TOKENの部分に利用するユーザのAPIトークンを貼り付けてください。APIトークン(使用ユーザ)も動的にしたい場合は、ファンクションを以下のようにすると良いかと思います。 後は、上記のファンクションを以下のように呼び出すだけで取得できます。
【コピペで使える】バッチファイルでのファイル、フォルダの削除
ファイルを削除します。実行時に確認メッセージは表示されず、ゴミ箱にも格納されず完全に削除されます。オプションに /p を指定することで、実行時にクライアント側に実行可能かを問います。
kintoneで始めるjavascript入門【全体の構造、events onの紹介】
kintoneでjavascriptカスタマイズを始めようとされている中でも、javascriptに詳しくない、またはほとんど触ったことのない方向けに作成しました。javascriptの基礎を押さえていただいた上で、kintone…
Javascriptの即時関数と、省略記法【先頭の！やカッコの意味】
即時関数は、記述と同時に実行される関数を指します。変数のスコープを制限し、汚染を防ぐためです。例えば、以下の処理は全く問題なく実行されます。
各パーツの背景色及び文字の色を変更できます。‘BORDER’: 0でタイルレイアウト風、グリッドレイアウト風なUIが作れそうです。マテリアルデザイン風に影を・・・とかは難しそうですね。
【プラグイン無料公開】一覧をリロードせず高速に検索・絞り込みができるプラグインを開発しました【Kintone】
通常レコード一覧で特定のレコードを検索する場合、フィルターから検索条件を1つ…
プログラムにおいて、マジックナンバーは原則避けるべきコーディングです。VBA 以外の言語においては、少し学びさえすればマジックナンバーが現れることはほぼ無いかと思いますが、VBA…
Gatsby-ImageからGatsby-plugin-imageへ移行した
当ブログはフレームワークとしてGatsby.jsを使用しているんですが、OSをクリーンインストールし、環境を再構築した後からうまくビルドが通らなくなってしまいました。Cannot read property 'bitmap' of undefined…
【コピペで使える】バッチファイルで空ファイルを作る方法3パターン
Windows10 におけるバッチファイルは、扱い方を覚えてしまえば PC…
【コピペで分かる】サイボウズOfficeのJavascriptカスタマイズ
この記事は、これからサイボウズ Office を javascript でカスタマイズしようとされている方向けに書いています。1 から Javascript ファイルを作成する方法と、JS…
一般的にエラー処理は、各関数では最低限行い、後は呼び出し元にThrowするのが一般的かと思いますが、VBAではそれを簡単には実装できません。エラーハンドラを作ってしまうとエラーを握りつぶしてしまい、そこから再度Err.Raise…
テキストをBase64でエンコードtext 変換する値 Base64フォーマットデータ実行テストDebug.Print (EncodeToBase64("aaa"))
deepfacelabでうまく学習させるために注意すべきポイント、コツを紹介
deepfacelab は操作がコンソールベースで取り扱いには慣れが必要ですが、学習には Google が開発する TensorFlow…
【再起動しても消えない】バッチファイルでのネットワークドライブの割り当て方
コマンドラインからネットワークドライブの割り当ては、通常net useを使います。ですが、これだけではPC再起動の度に割り当て情報が消えてしまいます。persistent…
【Property Setは不要】Property Let と Set の違い
VBA でクラスを作成し、 プロパティ(メンバー変数) を取り扱う際に作成する Property メソッドには Get, Set, Let があります。一般的に、VBA 以外の言語では、プロパティ(メンバー変数)に設定するのは Getter と Setter…
eel.startの引数として、close_callbackに関数を設定できます。startで設定したhtmlが閉じられた際に呼び出され、呼び出したhtmlとソケット番号(指定した場合のみ)を受け取ることができます。ログには以下のように出力されるはずです。
【顔によって最適が異なる】フェイスタイプ(Face type)の正しい選び方
DeepFaceLab のバージョン 2 がリリースされ、顔だけでなく、頭部全てをスワップできるようになりました。それに伴って、学習時にプログラムに与える顔データのオプションとして、フェイスタイプ(Face type…
【Javascript】ドラッグ＆ドロップでCSVを読み込む
ドラッグ＆ドロップのイベントを登録する。まず、ファイルをドラッグ＆ドロップできる領域を設定します。今回はやっていませんが、対象領域上にファイルがドラッグされている時とそうでない時で、領域のスタイルを変更する方がユーザフレンドリーです。
【Node.js】対象URLにリンクされている全ての動画ファイルをダウンロードする
puppeteerを利用して、URL内にリンクされている動画ファイルをダウンロードします。puppetterを使うことで、JavaScriptが動いたあとにコンテンツが生成されるような画面でも正しく情報を取得することができます。全てpuppeteer…
【プラグイン無料公開】一覧情報をそのままExcel(.xlsx)としてダウンロード
皆さんはCSV出力機能、利用されますか？バックアップやアプリ移行、レコードの一括更新など、何かと使う場面は多いと思います。ただこのCSV出力、出力までに必要な手数が多くありませんか？一覧のデータを少しExcelで加工したいだけなのに、いくつかの手順を踏んで、CSV…
【kintone】Javascriptでダウンロード機能を独自実装する
僕がKintone上でアプリを開発する上で最もよく聞いた意見が、「ダウンロード(CSV出力)が使いづらい」でした。煩雑なダウンロード機能を解決するため、独自で簡単にダウンロード機能を実装する方法をご紹介します。
【kintone】プラグインのsetConfigとgetConfigをラクにする
kintoneのプラグインには、プラグイン単位で設定情報を保持してくれる機能がありますが、javascriptのオブジェクト型の情報を保持することはできません。通常、JSON.parseとstiringify…
electronには、URLからファイルをダウンロードするモジュールを持っていません。httpsやrequest…
【GAS】スレッドに引っ張られて、不要なメールまで取得してしまう場合の対処法
Google Apps Scriptを用いてGmailのメールを取得する際、取得される単位はスレッド単位になります。これが厄介で、1通のメールが欲しい場合も、まずはスレッドから取得する必要があります。データとしては、GmailApp…
【GoogleAppsScript】Gmailから特定のメールを取得する
Google Apps Scriptを用いることで、紐づくアカウントのGmailの情報を操作することができます。ただ、このGmailから取得できる情報が独自の構造を持っており、1件のメール情報を直接取得することができません。今回は対象のメールをGoogle Apps Script…
オプションのコールバックが渡されている場合は、コンポーネントがレンダーまたは更新された後に実行されます。
【プラグイン無料公開】デザインテーマをリアルタイムで変更する機能を追加
あまり活用している方は多くないかもしれませんが、kintoneにはデザインテーマがあり、いくつかの中から選択して全体のカラーを変更することができます。ただ、この機能はアプリ設定内にあり、実際にテーマを適用させるとどうなるのか、イメージをつかみづらいです。
Youtube…
【deepfacelab】顔を部分的、一部のみ変更する方法【XSeg】
deepfacelabでは、face typeに応じておでこから顎まで、または頭全体を標準でスワップさせます。deepfacelabには、こちらから能動的に「どこまでが顔なのか」を指示できる「XSeg…
日付の妥当性をチェックするワンライナー【JavaScript】
特定の文字列が日付として妥当かをチェックするコードです。日付として処理できる形かをチェックしているだけで、yyyy-mm-ddなどをチェックしているわけではない点に注意してください。
kintoneプラグインを開発しました。日付フィールドと年齢フィールドを紐づけて、自動計算・自動更新を行うプラグインです。まずは操作デモをどうぞ。
上限を気にせずPOST, PUT, DELETEする【Kintone】
kintone REST APIには、GET, POST, PUT, DELETEそれぞれに、1度に操作できるレコードの上限が設けられています。今回は上記のレコード上限を気にすることなく、一括でレコードの作成ができる関数をご紹介します。REST API…
もう損しない！現役会計事務所SEが教える経理向けPCの選び方とスペックの目安
会計ソフトの使用を含む、会計事務所で行うすべての業務を快適にこなすことが目的であれば、10万円以下のパソコンでも十分に可能です。もちろんOffice…
複数jsファイルで共通の変数・定数を使う方法【kintone】
Kintoneではグローバル変数・定数は基本的に使用禁止です。ただやむを得ず使用したい場合の対処法がガイドラインに定義されています。その定義方法・パターンをいくつか紹介します。
HTMLを記述する際は、XMLのように、開始タグと終了タグの数が一致している必要はありません。特定の条件のもと、特定のタグは省略可能です。今回は省略可能なタグとその条件をまとめましたので、よろしければご活用ください。
ダブルクォートの有無や文字コードを問わず使用できるCSV取込
文字コード、エンコード、改行コード、ダブルクォーテーション。この全てを意識することなくCSVデータを取り込む方法を紹介します。取り込むCSVデータはFileオブジェクトを使うことを前提としています。
まとめてではなく1件ずつファイルをzipに圧縮する【Power Automate Desktop】
エクスプローラーの通常機能を使用すると、特定のフォルダをzip形式に圧縮することができます。ただ、ファイルを1件1件圧縮したい場合は、それぞれzipへの圧縮を指示していかなければならないため、件数が多くなると手間がかかってしまいます。今回は特定のフォルダ内のファイルを…
Kintoneのフィールドコードの命名規則と、JavaScript上で使用する際に気を付けること
Kintoneで作成できるアプリには様々なフィールドが存在し、その全てにフィールド名とフィールドコードを割り振る必要があります。フィールド名は主にユーザーが見える部分に、フィールドコードは主にアプリ管理者およびJavaScript…
kintone.events.onで非同期処理(async/await)を使う - kintone
JavaScriptカスタマイズを行う上でよく利用する非同期処理を実装する方法と、実装する上での注意点を紹介します。kintone.events.onに登録した関数は引数として受け取ったeventを最終的にreturn…
1つのJavaScriptファイルに複数のkintone.events.onを登録する
KintoneにカスタマイズしたJavaScriptの処理を任意のタイミングで実行させるためには、kintone.events.on関数への登録が必要ですただカスタマイズを拡張していくと、1つのイベントだけでは機能を実現できず、複数回kintone.events.on…
要素を取得しているのに「表示するUI要素はありません」と表示される場合の対処法
Power Automateには、Webページコンテンツとウィンドウコンテンツ、2つのUI要素があります。しかし、UI要素を選択する画面はWebページとウィンドウどちらも同じ場所で管理されています。画面右側の「UI…
Power Automate Desktopを使って、Chatworkへメッセージを送信する
RPAを使う上で最も考えないといけないのは、エラー発生時の対応です。最低限エラーを拾って次の処理に移る、などを実装することは多いと思いますが、できればエラーをログに残したり、ユーザーに通知する手段が欲しいですよね。今回はChatwork APIを使って、Power…
【見栄え改善】セルの内側に余白を追加する【書式設定では解決できない場合の対処法も紹介】
スプレッドシートを使っている時、セルと文字の隙間が窮屈に感じたことはありませんか？幅を自動調整させると、一番幅を取っているセルの幅ギリギリに調整されるので、ちょっと不格好ですよね。今回はデータに影響を与えず、セルの内側に余白を追加する方法をご紹介します。
kintone.events.onを書かないkintoneカスタマイズ
kintoneカスタマイズを行う際、必ずと言っていいほど記述するコードは何でしょうか？kintoneが独自に用意する関数やプロパティはいろいろありますが、は誰しもが頻繁に使用されていると思います。…
【GAS】スプレッドシートからJSONへの変換を短く安全に記述する方法
Google Apps Script(GAS)のスプレッドシートのデータは、通常二次元配列で受け取ることができます。ただこのままではデータを取り扱うのが難しいので、今回はJSON形式(オブジェクトとプロパティ)に変換する方法を紹介します。
kintone.appとkintone.mobile.app、使い分ける必要ある？
kintone.appとkintone.mobile.appの使い分け、面倒じゃありませんか？PC版とモバイル版を意識せずリソースを共有するために、デバイスを自動的に判定して使い分ける必要をなくす方法を紹介します。
PC版とモバイル版、1つのアプリでできれば同じJavaScriptファイルを使いたいですよね。kintoneについてはURLも発生イベントもデバイスによって異なりますし、全く同じコードを使用することはできません。リソースを共有するために不可欠な、モバイル判定の方法を紹介します。
Contentfulから取得した記事中の画像を、WebPに変換する
Contentfulからマークダウン形式で記事情報を取得した際、埋め込まれている画像情報は最適化されていません。埋め込みの画像まで最適化し、対応ブラウザでWebPに変換して表示する方法を紹介します。
低スペックなPCでも高度な学習が可能なDeepFaceColab - DeepFaceLab
DeepFaceLabで高負荷な設定ができないパソコンでも、クラウド上で業務用のGPUを無料で使用し学習ができるDeepFaceColabの使い方を紹介します。必要なものはブラウザだけです。
「ブログリーダー」を活用して、Ribbit worksさんをフォローしませんか？
指定した記事をブログ村の中で非表示にしたり、削除したりできます。非表示の場合は、再度表示に戻せます。
画像が取得されていないときは、ブログ側にOGP(メタタグ)の設置が必要になる場合があります。
