ReactでSNS対応（Gatsby製ブログでSNSシェアボタン、OGPタグ追加） | Takumon Blog
なにこれ Gatsby製ブログ(Reactアプリ)でSNS対応した時のメモです。 (1) SNSシェアボタンと**(2) 自分のSNSへのリンクを設置して、ブログの記事をSNSでシェアできるように、、、 また、(3) OGPタグを設定し**、SNSでシェアするときにイメージ画像や、タイトル、記事概要を表示できるようにしました。 ブログのフッター Twitterの呟き 1. SNSシェアボタンを設置 Facebook、Google、Linkedin、Twitterシェアボタン react-shareでめっちゃ簡単にできます。 それぞれ専用タグが用意されているので url属性に記事のURL、icon属性にアイコンサイズを指定するだけです。 Linkedinアイコンはそれに加えてtitle属性に記事タイトルを Twitterアイコンはvia属性に自分のTwitterアカウント名、title属性に
Nuxt.js＋Apollo ClientでCRUD操作 / ユーザー管理画面でQuery, Mutation, Subscriptionを実装 | Takumon Blog
なにこれ 以前の記事設定いらずのNode製GraphQLサーバー「Graphpack」の使い方でGraphQLのサーバー側を実装を紹介しました。 Graphpackは備え付けのGraphQL Playground IDEで動作確認できますが、せっかくなので今回はクライアント側も作成してみました。 本記事では**Nuxt.jsとApollo Clientを使って簡単なユーザー管理画面を作成する方法をチュートリアル形式でご紹介します。** 最終的にはQuery, Mutation, Subscription全てを実装しますが、 以下のようにステップを分けて、少しずつ実装していきましょう✨ 🔰 プロジェクトのひな型を作成する 💪 Queryを実装する → ユーザー情報が一覧で表示できる 💖 Mutationを実装する → ユーザーの登録・更新・削除ができる 💎 Subscriptionを
懇親会で飛び込みLTに参加した / 「JavaScriptつまみ食い LT 会 ～ つまみ食い LT 大会！」の感想 | Takumon Blog
どんな勉強会だったか 今回で開催5回目となり、4回目までハンズオン形式で実施していたそうですが、5回目は毛色を変えてLT会にしてみたそうです。 人数は発表者5名を含め、全24名と程良い人数で、会場は少し大きめの会議室でした。 聞くだけの勉強会はあまり面白くないのですが、 この勉強会では、最後に振り返りを実施し、全員が参加できるような工夫がされていました。 具体的には4人1組になり、自己紹介を含め5分間振り返りを実施し、グループごとに感想を発表するというものです。 最後の懇親会も1時間半と長めで、飛び込みLTを聞きながら、いろんな人と話ができました。 飛び込みLTは自分含め5人と多めで、みなさん積極的に参加されていたのも、楽しめた要因の1つです。 LTでどんな話が出たか 5名の方がLTされており、 最近話題のAWS Amplipy、GraphQL、Nuxt.jsからGoogle Home、カ
ブログにあらゆる外部コンテンツを埋め込めるWebサービス「Iframely」の使い方 | Takumon Blog
なにこれ SNSのコンテンツ、動画といった外部コンテンツを自分のブログに載せる場合、 単純にリンクを張り付けるよりも、以下のようにHTMLの埋め込みコードを張り付けたほうがビジュアル面で効果的です。 ただTwitterやYouTubeなどの埋め込み対応サイトでも、サイトごとに埋め込みコードを取得する方法が異なるため結構めんどくさかったりします。 また埋め込みコードに対応していないサイトも多いのが現状です。 「Iframely」は、そのような問題を一挙に解決してくれるWebサービスです。 実際このブログでもIframelyを使って外部コンテンツを埋め込んでいますが、かなり便利です。 今回は、「Iframelyでどんなことができるか」、**「実際使ってみた感想」などについてご紹介したいと思います。 最後のほうに「GatsbyでIframelyを使う方法」**も紹介しています。 Iframely
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
