ES2015のモジュールをBrowserifyとBabelifyでビルドしてクライアントで読み込んでみる - Qiita
概要 今更ES2015やES2015(ES6)からES5（現行）のJavaScriptに変換してくれるBabelとか ES2015のモジュールを使うのにはBrowserifyやBabelifyというものを使うといいらしいなどがわかった ビルドする際に色々とエラーが出て詰まったのでメモ ES2015とは ECMAScript 2015（ES2015)のことらしい ES2015自体はJavaScriptそのものではなく、あくまで言語仕様とのこと JavaScriptはECMAScriptという言語仕様に基づいた言語のひとつ ECMAScript 2015はECMAScript 6th editionでECMAScript 6(ES6)とも呼ばれる つまり ECMAScript 2015(ES2015) = ECMAScript 6(ES6) その前がECMAScript 5(ES5)で、ES6
React/flowの環境をWebpackで構築する - Qiita
Reactを使ったアプリケーションを作る機会があったので、改めてその際に学んだことを整理しました。 これを読むことでReactを使って開発する際のwebpackの基本的な設定は理解していただければ幸いです。 ただ設定を載せるのではなく何のためにそうするのかを意識して伝えるようにしました。 実際のソースコードはこちらです。 前提 対象 今までReactを書いていたが、どうやって環境構築されているのかが分からない webpackを使ってReactの環境構築をしたい flowも使って型定義もしたい 環境 webpackとは webpackとは、モジュールバンドラのこと。モジュールとは、依存関係（互いに参照したりしている関係）のある複数のファイルのまとまりのことで、それらを一つのファイルに束ねる（bundleする）主体をバンドラと呼ぶ。 つまり、webpackは複数のファイルを一つのファイルにまと
Microsoft Teams Scraping - Qiita
Microsoft Teams Scraping 更新履歴 2019/02/13 Application Registration Portalが，AzurePortalと統合されたことにより画面イメージが変更になったことと，トークンの更新にoffline_readが必要なので更新． 2019/02/25 いいね・被いいねの関係性や，メッセージの投稿に対する返答の関係性のデータを抽出できるようにしました． 目的 Microsoft Teams上でやりとりされているメッセージを全て取得します． 個人的なチャットは2018/10/06現在取得できません． 取得できる範囲は，AD認証したユーザーが所属している全チームのメッセージです． 結論 全コード GitHub 使い方 ADアプリ登録 Registragion Portalにアクセス，ログイン． 下記の通りに登録する． 名前：任意 リダイレク
Lighthouseを自動化する 〜その１〜 - Qiita
Lighthouse大事 LighthouseはGoogleが出しているWebサイトのパフォーマンス測定ツール。 今後はMFIが進んでいくこともあり、Lighthouseの数値を日頃からチェックしておくことは大事。 Webサイトに改修を加えた結果、スコアが落ちてSEOの評価が下がってしまったら目も当てられない。 Lighthouseは面倒 Lighthouseの実行はChrome拡張機能やChromeのデベロッパーツールから実行することができる。 けど、毎回対象のページをブラウザで開いてツールを実行するのは結構面倒。 あと、スコアの共有も面倒。 なので今回は、以下の3つの処理をJavaScript上から自動で行う。 スプレッドシートから対象のURLを取得（今回） Lighthouseのスコアを取得 Slackへの通知まで スプレッドシートからURLを取得 スプレッドシートを準備 Light
Lighthouseを自動化する 〜その２〜 - Qiita
Lighthouse大事 LighthouseはGoogleが出しているWebサイトのパフォーマンス測定ツール。 今後はMFIが進んでいくこともあり、Lighthouseの数値を日頃からチェックしておくことは大事。 Webサイトに改修を加えた結果、スコアが落ちてSEOの評価が下がってしまったら目も当てられない。 Lighthouseは面倒 Lighthouseの実行はChrome拡張機能やChromeのデベロッパーツールから実行することができる。 けど、毎回対象のページをブラウザで開いてツールを実行するのは結構面倒。 あと、スコアの共有も面倒。 なので今回は、以下の3つの処理をJavaScript上から自動で行う。 スプレッドシートから対象のURLを取得 Lighthouseのスコアを取得（今回） Slackへの通知まで Lighthouseのスコアを取得 Lighthouse CLIのイ
Lighthouseを自動化する 〜その３〜 - Qiita
Lighthouse大事 LighthouseはGoogleが出しているWebサイトのパフォーマンス測定ツール。 今後はMFIが進んでいくこともあり、Lighthouseの数値を日頃からチェックしておくことは大事。 Webサイトに改修を加えた結果、スコアが落ちてSEOの評価が下がってしまったら目も当てられない。 Lighthouseは面倒 Lighthouseの実行はChrome拡張機能やChromeのデベロッパーツールから実行することができる。 けど、毎回対象のページをブラウザで開いてツールを実行するのは結構面倒。 あと、スコアの共有も面倒。 なので今回は、以下の3つの処理をJavaScript上から自動で行う。 スプレッドシートから対象のURLを取得 Lighthouseのスコアを取得 Slackへの通知まで（今回） SlackへLighthouseスコアを通知 Slack Webho
Reekohサービスプラグイン(Node.js)を作ってみる - Qiita
Reekohとは Reekohとは、IoTデータをNode-REDのようにハードウェアデバイス/APIをオンラインサービスに接続したり、独自のダッシュボードを構築することができるクラウドサービスです。 ただ、フリーサービスではないので、Reekoh社及び代理店からの提供されるエンタープライズ向けツールです。 Node-REDのNodeのようにReekohプラットフォームはPluginをパイプします。このPluginを自ら開発することも可能です。 はじめてのReekoh Plugin開発 Reekohは、プラグインを作成してプラットフォームの機能を操作するためのオープンソースのフレームワーク/ APIを提供しています。(Node.js環境は事前に設定しておいてください） Reekohパッケージのインストール 下記コマンドラインにより、Reekohパッケージをインストールします。
Node.jsでYoutube動画をDLして保存するytdl-coreを使ったみたメモ - Qiita
const fs = require('fs'); const ytdl = require('ytdl-core'); const readline = require('readline'); //表示用途 const BASE_PATH = `https://www.youtube.com/watch?v=`; const youtubeId = `9CHiwJhx3qw`; //DLするYoutube動画のID（urlのv=の後ろの部分11桁） const url = BASE_PATH+youtubeId; const video = ytdl(url,{filter: (format) => format.container === 'mp4' }); let starttime; video.pipe(fs.createWriteStream(`${youtubeId}.mp
React + Polyglot で多言語化対応をおこなう - Qiita
はじめに 今のチームでは、多言語化対応をおこなう際、Airbnb製のライブラリであるnode-polyglotを使っています。 Reactの多言語化でポピュラーなライブラリとしてreact-intlがあります。 しかし我々の場合は、フロントエンドにReactを採用したのは最近のため、これまで利用していたライブラリを継続して使う形で開発をしています。 今回はその使い方を簡単にまとめました。 開発で用いる環境の構築 ここでは、create-react-appで環境を構築しています。 動作確認のための環境なので、 tslint のエラーが出ないように少し設定をいじっています。 tslint.jsonのrulesは以下の通りです。 "rules": { "no-var-requires": false, "interface-name": [true, "never-prefix"], "no-e
TypeScriptのIndex typesと Mapped typesを使ってJavaScriptライブラリをIDEで補完する - Qiita
TypeScriptの型定義はアプリの初期設計時に適切な形で導入すれば後の開発が楽になりますが、使うだけならともかく自分で定義するほどには理解が及ばないというケースは多いかと思います。 特に Index types や Index types は扱えると便利なのですが、聞かれると説明に窮することがあり、自分の理解を深めるためにもまとめました。 ※以下の記事は TypeScript3.1.1 が前提です。 EventEmitterを型安全に扱う ありがちですが、 EventEmitter を題材にします。 ほぼこちらの記事の二番煎じです。 TypeScript 2.1 で導入される keyof を使って EventEmitter を定義してみる 以下のように interfaceを定義します。 export type EventDef = {[P in string | symbol]: an
Angularを学習するにあたって参考にした書籍など - Qiita
前置き 以前、仕事でAngular使うことになったので整理するという記事を投稿しました。 あれから少し経って、だんだんAngularのことがわかってきたので、勉強につかった書籍やサイトなどをまとめておきます。 ※Angular 6を使ってた頃の話になります。 書籍 Angular Webアプリ開発 スタートブック Angular Webアプリ開発 スタートブック 最初に買った本です。 適当に寄った書店でAngular関連の本がこれだけ置いてあって、 とりあえず試しに買ってみた本でした。 感想としては、うーん、、、どうなんでしょう。 内容は薄めです。 ハンズオンのような形式で、かなり易しめに書いてありますが、 かゆいところに手が届いておらず、私の欲しかったような内容ではありませんでした。 とはいえ、書いてある通りに実装すれば動くものは作れましたし、それでなんとなく全体像が掴めたようなところは
Babel 7 へのアップグレードにあたっての修正点 - Qiita
これはなに？ とあるリポジトリを Babel 6 から Babel 7 にアップグレードするにあたって、公式のアップグレードガイドを読んで修正が必要だった箇所をまとめたものです。網羅的に記載している物ではないので、細部は公式のアップグレードガイドを参照してください。 公式のアップグレードガイド Upgrade to Babel 7 あわせて Babel 7 Released も読むと、今回のリリースの背景等も知ることができて面白いでしょう。 .babelrc の有効範囲の変更 .babelrc に設定した内容は package.json ファイルを含むディレクトリ配下には適用されなくなっています。 node_modules 配下も同様の制限を受けます。これは monorepo のように複数のパッケージを管理する際の拡張性に配慮した変更のようです。 一方で babel.config.js を
lodash のファイルサイズを lodash-webpack-plugin と babel-plugin-lodash を使って削減する - Qiita
概要 react で SPA を作成していたのですが、webpack-bundle-analyzer をみると、lodash の占める割合が大きかったので、少しでも減らせるような試みとして、 lodash-webpack-pluginと babel-plugin-lodashを使って、 ファイルサイズを削減しました。 利用した主なパッケージのバージョン "babel-core": "^6.26.3", "babel-loader": "^7.1.5", "babel-plugin-lodash": "^3.3.4", "babel-preset-env": "^1.7.0", "babel-preset-react": "^6.24.1", "lodash-webpack-plugin": "^0.11.5", "webpack": "^4.20.2", "webpack-bundle-a
Windows10でWSLを利用したLinuxの開発環境構築 - Qiita
VMはメモリを固定して利用するため、一度に複数起動するのは難しいです。 情報はlinux用が多いです。Windowsネイティブは.exeとかパスが\とか何かと読み替えないといけません。 速度的にはどれもほぼ同じで特に問題はありません。 Windowsネイティブは環境が破壊されます。下手するとWindowsが起動できなくなる可能性もあります。 Windows Subsystem for Linuxの有効化 突然ですが、検索ボックス使ってますか？ ここです。 入力するといろいろ検索してくれます。 通常EdgeでBingの検索結果が表示されるだけなので、使えないって思っている人が多いと思うのですが、PCの内部の検索する場合はここから行うと速い場合が多いです。 というわけでここに「windowsの機能」ぐらいまで入力してください。 そうすると、「Windowsの機能の有効化または無効化」と出てくる
[初心者] Node.jsでHello Worldする - Qiita
Node.jsとは？ 「Javascriptで動作するサーバー環境」 WebサーバーというとApacheやIISなどのHTTPサーバー上でPHPやASPなどを動作させる環境を思い浮かべるが、Node.jsはそれとは異なる Node.jsではサーバーを作るところから実装が始まる 特徴 非同期I/O、ノンブロッキングI/Oモデルを採用している シングルスレッド Googleの「V8」という優秀なJavascriptエンジンで動作する Hello Worldする (Node.jsがインストールされていることを前提としています) とりあえずコードを写経する var http = require('http'); // ① var server = http.createSever(function(req, res) { // ② res.writeHead(200, {'Content-Type
![[初心者] Node.jsでHello Worldする - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/593199dbbbaf41eb6cc664c668d7065823498af9/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMjIyNDUzJTJGcHJvZmlsZS1pbWFnZXMlMkYxNTM0NTQ4MTMzP2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZmbT1wbmczMiZzPWM1YjY1OThlNmQxYjkwNzU4YmI3ZWFhNDFhMjA3NzBh%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D86a9d5d8c5318258d4c08e79326e49d9%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JTVEJTIwTm9kZS5qcyVFMyU4MSVBN0hlbGxvJTIwV29ybGQlRTMlODElOTklRTMlODIlOEImdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz1jZmY5NDU3ZmYyMjgxOGQ2MzA0NjU2OTlhMmJmOWU4NQ%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBob2dlXzU1NTUmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz0xOTRmZTI1YWM5MDgzMzAzYjM4ZTc0MTNkZTFiMDA2NQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Db0382b0aef4b8314bd7006bd33b80e08)
Node.jsで画面遷移を行う - Qiita
Node.jsとは？ [初心者] Node.jsでHello Worldする [初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す わからなければ↑の記事をご参考ください！！ 画面遷移を行う Node.jsでは、リクエスト(URL)ごとにレスポンスとして返却する内容を使い分けることにより、結果として画面遷移を実現させる 以下コード var http = require('http'); var fs = require('fs'); var server = http.createServer(function(req, res) { var target = ''; switch (req.url) { case '/': case '/index': target = './index.html'; break; case '/next': target =
Electron製アプリをMac App Storeでリリースするまでの手順
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 最近、ElectronでGateというMac用デスクトップアプリケーションを作って、Mac App Storeにリリースしました。Gateは、入力したパスのフォルダを、Finderで開くことができるアプリケーションです。Macのパスだけではなく、Windowsパスも開くことができるので、特にMacユーザとWindowsユーザがいるチームでフォルダパスを共有する際に役立つと思います。 Mac App Storeにリリースするにあたり、具体的な手順がわからず苦労したので、今回はリリースまでの一連の流れをまとめてみようと思います。 前提事項
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Node-REDからpython-broadlinkでRM mini3をコントロール【失敗】[on Onion Omega2+] - Qiita![Node-REDからpython-broadlinkでRM mini3をコントロール【失敗】[on Onion Omega2+] - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/2f9d9c5238415f825037c1df236daf3d20bc916d/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMTAwNzEyJTJGcHJvZmlsZS1pbWFnZXMlMkYxNDg0MzgyMjE5P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZmbT1wbmczMiZzPWJjNmIzN2ZkOGM2ZDdkMGJjYzc0MjNhNzNjYTlkMTQ5%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D56fd162dd9dfe2abcea000671c876d36%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9Tm9kZS1SRUQlRTMlODElOEIlRTMlODIlODlweXRob24tYnJvYWRsaW5rJUUzJTgxJUE3Uk0lMjBtaW5pMyVFMyU4MiU5MiVFMyU4MiVCMyVFMyU4MyVCMyVFMyU4MyU4OCVFMyU4MyVBRCVFMyU4MyVCQyVFMyU4MyVBQiVFMyU4MCU5MCVFNSVBNCVCMSVFNiU5NSU5NyVFMyU4MCU5MSU1Qm9uJTIwT25pb24lMjBPbWVnYTIlMkIlNUQmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz0zNTAzMzZiYTEzMDExOWEyZDhiNmViZjM5YjRkY2U5Zg%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBzcGlkZXJ4X2pwJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LXBhZD0wJnM9M2RiZmNlYTdhMTg4NjQ4MjRkMmJkZGIzZjEzMmFjMzE%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Deea6570e6fa1b323fce9d4d785b88355)
Angular FormGroupの setValue() と patchValue() - Qiita
[初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す - Qiita![[初心者向け] [Node.js] fsモジュールを使ってhtmlファイルを返す - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/bfe3a86ad9219c62bb2d71d3dc1be4e5fe5b6e92/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMjIyNDUzJTJGcHJvZmlsZS1pbWFnZXMlMkYxNTM0NTQ4MTMzP2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZmbT1wbmczMiZzPWM1YjY1OThlNmQxYjkwNzU4YmI3ZWFhNDFhMjA3NzBh%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D86a9d5d8c5318258d4c08e79326e49d9%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUU1JTkwJTkxJUUzJTgxJTkxJTVEJTIwJTVCTm9kZS5qcyU1RCUyMGZzJUUzJTgzJUEyJUUzJTgyJUI4JUUzJTgzJUE1JUUzJTgzJUJDJUUzJTgzJUFCJUUzJTgyJTkyJUU0JUJEJUJGJUUzJTgxJUEzJUUzJTgxJUE2aHRtbCVFMyU4MyU5NSVFMyU4MiVBMSVFMyU4MiVBNCVFMyU4MyVBQiVFMyU4MiU5MiVFOCVCRiU5NCVFMyU4MSU5OSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1wYWQ9MCZzPTk5MjQyNTdkMGQyZWQxODNjZDYyZmVhOGFiMTY5NzNj%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBob2dlXzU1NTUmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz0xOTRmZTI1YWM5MDgzMzAzYjM4ZTc0MTNkZTFiMDA2NQ%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Dbb741db13b4a97388cc7df8b39d67ad0)
