[Wordpress] Gutenbergのカスタムブロック作成で始めるReactプログラミング - Webのプルタブ
公式リファレンス とりあえずここを見る 流れ（Windows 10 VScodeを想定） Nodeをインストールする。 テーマフォルダなどへ移動して`custom-block`とか解り易い名前のフォルダを作る。 作った`custom-block`フォルダへ移動して`npm init`して`package.json`を作る。entry pointは`build/index.js`とかにしておく。 `Run npm install --save-dev --save-exact @wordpress/scripts`でWordpressのパッケージをインストールする。 package.jsonを開いてビルドコマンドを追記する。 ``` "scripts": { "start": "wp-scripts start", "build": "wp-scripts build" }, ``` シェル
Wordpress Gutenberg よく使いそうなコンポーネントまとめ - Qiita
#この記事は？ Wordpressの新エディタGutenbergをいじってて よく使いそうだと思ったコンポーネントをまとめていきます 追記編集していきます TextControl と TextareaControl テキスト編集のコンポーネント。 onChangeでイベントオブジェクトじゃなく中身の文字列だけが渡されるようになってるので、値の取り出しとかしなくていいので普通にtextareaとか書いちゃうより楽です。 const {TextControl, TextareaControl} = wp.components; registerBlockType('myPlugin/myBlock',{ edit({attributes,className,setAttributes}){ return [ <TextControl onChange={(newText1)=>setAttri
Gutenbergのカスタムブロック開発環境にReactを導入する方法 | Fantastech（ファンタステック）
Node.jsのインストール 今回の開発環境の構築には「Node.js」というものが必要です。 こちらのページからパッケージがダウンロードできるので、インストールしてください。 ※Node.jsについてはこちらの記事が参考になります。 作業フォルダへ移動 開発環境の構築は「コマンド」を使って進めていきます。 Macなら「ターミナル」、Windowsなら「コマンドプロンプト」ですね。 今回はWordPressテーマ内にカスタムブロックの開発環境を構築する話なので、テーマ内の任意のフォルダへ移動します。 コマンドでの移動がよくわからなければ、以下の手順で進めることもできます。 「cd」と入力半角スペースを入力任意のフォルダをターミナルにドラッグ・アンド・ドロップエンターキーをクリック package.jsonの作成 最初に初期設定として以下のコマンドを入力してエンターキーをクリックします。 n
wordpress gutenbergはmarkdown書けるよという話 – joppot
概要 みなさんこんにちはcandleです。今回は最近メジャーバージョンアップグレードがあったwordpressのgutebergでmarkdownがかけるよという話をします。 主題の通りなのですが、これまでwordpressはmarkdownを書くならプラグインのJP MarkdownやMarkdown EditorやWP-Markdownなどのを使って書く必要がありました。しかしOSSであるがためにやはり更新が遅かったり他のプラグインと干渉してエラーが出たりしました。もちろんgutenbergもまだ十分に問題なく使えるわけではありませんが、標準で導入されたのは大きいと思います。 早速使ってみましょう。 前提 wordpressのバージョンが5.0.0以上である gutenbergのmarkdownを使う wordpressの管理画面から「記事一覧」 から「新規追加」ボタンを押します。 最
GatsbyJSの本を書いた理由 | エビスコム - EBISUCOM
意外なところに手を出してきたと思われるかもしれませんが、きっかけは WordPress ＆ Gutenberg なんです。 2015年の Automattic社 Matt Mullenweg 氏の "Learn JavaScript, Deeply" という言葉。そして、バージョン5.4までたどり着いた現在の WordPress と、見え始めた Block Based Theme。 世間では WordPress=PHP という認識がまだまだ強いわけですが、とっくに、Gutenberg=JavaScript（React）なわけです。 すでに見えている未来を考えれば、WordPress=JavaScript と言われる時代もそう遠くはないのではとさえ思います。 なので、自分たちも JavaScript（React）をもっと身近なものにしておかなければと動き始めました。 入門者の通常ルート通り、
WordPress REST APIでイマドキHeadless CMS - ドークツ
正直あまり時流に乗れていないのですが、昨今フロントエンドとバックエンドを分離してフロントにより自由度を！ とのコンセプトのもと「Headless（ヘッドレス） CMS」なるものが流行しているそうです。 国内ではあまりサービスは見られないものの、海外ではHeadless CMSの先駆けとして「Elemeno」、そしてFacebook社も「GraphCMS」をリリースしています。 確かにCMSからViewを分離できれば、 CMS側ではJSON（API）のみになるためフロント側が言語に依存しないホスティングされたものが使えるため自前のサーバーがいらず、セキュリティ等もおまかせ等のメリットがあります。 とはいえ、やはりそこは枯れたWordPress。 痒いところに手が届くプラグイン群や日本語のUIはクライアントワークには欠かせません。 そこで、「インストールしたらまずはREST APIをオフに」等
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WordPressのGutenberg編集のためにもReactを勉強すべき？ – gakuya -学屋-
gutenberg react - Google 検索
【効率UP】WordPressにMarkdown（マークダウン）記法を導入－簡単な導入方法を教えます！