タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
T3 Stackは以下のような思想があるアプリケーションです。 「簡素さ」「モジュール性」「フルスタック安全」を実現できる技術スタックを集めた総称をT3 Stackと呼びます。 Next.js TypeScript trpc NextAuth.js Prisma TailwindCSS で構成されています。 2021年に生まれて多く利用されてきたモダンなスキルスタックと呼ばれていた構成でしたが現代いくつかの不満が生まれてきました。 そんな不満をもったJosh氏が作ったのがJStackでした。 今回は「JStack」を使ってX(旧:Twitter)のクローンアプリを開発していきます。 JStackを使うことでエンドツーエンドの型安全を体験しながら、Clerkを組み合わせてよりT3 Stackに近い開発ができるようにチュートリアルを作成しました。 このチュートリアルをやることでモダンな技術スタ
画像を管理するクラウドサービスのCloudinaryではてなブログに動画を配信する[Mac][Windows] - T’s blog
はてなブログに動画を載せるにはYouTubeやVimeoにアップロードしてリンクURLを取得して貼り付けていました。しかし簡単な説明するだけの動画なのに仰々しくみえるのでiOSアプリのGIFトースターを使ってgifに加工して直接はてなブログに張ったりもしました。 画像注釈ソフトのScreenpressoで参考にしたkanaxx (id:kanaxx43)さんのサイトで動画や画像を保存できるストレージサービスのCloudinaryがあることを知りました。kanaxxさんの記事はこちら→はてなブログで動画を使いたい！動画プレーヤーの埋め込み方法を教えます - ((７回目の出直し🌼)) Cloudinaryはここで無料で手に入ります。使い方はkanaxxさんの記事で分かりやすく紹介されています。まずは動画をCloudinaryにアップロードしてリンクURLをコピーします。そのURLをブログの本
![ 画像を管理するクラウドサービスのCloudinaryではてなブログに動画を配信する[Mac][Windows] - T’s blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/e6428374029827e33690f0c9c23669ed5746a3db/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F10257846132657170059%2F13574176438052252903%2F1642089188)
Cloudinary API を使ってアセット一覧を取得し、JSONの結果をCSVファイルに出力する方法を紹介します。 Guten Tag, ベルリンより伊藤です。 Cloudinaryの画像一覧やURL一覧をCSVで出力できないか？という問いについて、要望はチラホラあるようですが、現時点でコンソールやAPIでそのまま取得する機能は提供されていません。 Admin API の Get Resources で JSON 形式で一覧を取得することができるので、簡単なスクリプトを書いてCSV出力をやってみました。 ◆ 参考：Cloudinary: How do I browse through all the resources in my account using the API? Python の場合 Pythonで実装しました。Cloudinary API のクレデンシャル設定など基本的
QiitaのOGPが可愛すぎて、自分のブログにも導入したい！と思い、 Cloudinaryを使って記事タイトル入りOGPを作成しました。 ▼ twitterに記事を投稿すると、こんな感じ。 Cloudinaryとは？ 画像の加工が得意なクラウドサービス。 APIを使用して、画像の変形・配信などができます。 料金プラン 基本的には無料で使えますが、上限があります。 料金プランに関しては、下記の記事がわかりやすかったです。 参考記事: Cloudinaryの新しいプランを調べてみた SDKが提供されている言語・プラットフォーム サービス開発における言語はほぼ網羅しています。 対応していない言語で使いたい場合も、URLにパラメータを渡して画像を変形することもできます。 参考： https://cloudinary.com/documentation どんなことができるか 下記の記事がわかりやすか
結果的に、S3オリジンでは820 KBのPNG画像がわずか6 KBのWebP画像に生まれ変わっています。 以下では Cloudinary の 画像の圧縮 ブラウザごとに効率的な画像形式に変換 HTTP/2通信 についてdev.toを例に紹介します。 画像の圧縮 テキスト系アセットはgzipなどで圧縮されることが多いものの、メディア系アセットが圧縮されることは稀です。ウェブサイトのペイロードの大部分を画像が占めるにも関わらずです。 Cloudinary ではq_オプションパラメーターを渡すと画像を最適化できます。 dev.to はおまかせ(q_auto)モードになっており、人間では違いがわかりにくい範囲で画像を最適化しています。 ブラウザごとに効率的な画像形式に変換 JPEGやGIFといった前世紀から存在する画像形式が現在も利用されている一方で、WebP、JPEG 2000、JPEG XRの
iOS 15からiPhoneでもドラッグ＆ドロップができるようになりMacやiPadと同じくAppleらしい操作が可能になりました。ドラッグ＆ドロップというのはオブジェクト(テキストや画像など)を選択しそれを移動(ドラッグ)して別の場所に置く(ドロップ)機能です。 iPhoneのドラッグ&ドロップ 1．移動させたいオブジェクトを指で長押しして指を離さないでそのまま(※複数ある場合は押したまま別の指で選択する)アプリからスワイプアウトする。 2．指を離さないように別のアプリを開いて貼り付けたい位置で指を離します。(ドロップ) まとめ iPhoneのドラッグ&ドロップは画面が小さいのと１つのアプリしか開いておけないので慣れるまで操作に戸惑います。しかしコピー&ペーストをアプリ間でメニューから繰り返し何度もタップして操作するよりも直感的で解りやすい。 Cloudinaryについてはコチラ↓ to
はじめに Cloudinary とは Cloudinaryとは画像や動画、他あらゆるアセットを保管・一元管理でき、変換や最適化を即座に行え、CDNで高速配信できるサービスです。 最適化やCDN配信はページ速度を上げてユーザ体験を向上させるだけでなく、SEOとしても重要な要素ですね。 そのキーとなる機能が、独自のアルゴリズムを使用して最適なフォーマットや品質を自動選択する、画像・動画の最適化といえます。 例えば、フォーマットの最適化パラメータ f_auto を使えば、ブラウザごとにサポートされている最適な圧縮フォーマットが自動的に選択され、視覚的な品質を落とさずに大幅に軽くすることができます。 今年新たにリリースされた Media Optimizer は、名前の通り「メディアの最適化」にフォーカスしており、Cloudinary の多様な機能のうち最適化やリサイズといった基本的な変換とCDN配
[動画公開] 目指せ、爆速サイト! Cloudinaryで始める画像最適化 #devio2020 | DevelopersIO
6月16日より、クラスメソッドの年次技術イベント「Developers.IO 2020 CONNECT」を開催しています。期間は2020年6月16日（火）から7月7日（火）、テーマごとに7日間の日程に分けて開催、セッションはなんと合計100本以上あります。 本日「目指せ、爆速サイト! Cloudinaryで始める画像最適化」というテーマにてセッション動画と資料を公開いたしました。 セッション情報 概要 サイトを魅力的なものにすべく、画像をふんだんに使いたい一方で、画像が重すぎてサイト表示が遅くなると、コンバージョン率が下がってしまうというジレンマがあります。 そんなときに役立つのが画像の最適化です。 画像フォーマット・画質などを最適化することで、画像サイズはかんたんに半分以下になります。 本セッションでは、Cloudinaryを使った画像最適化方法についてお話します。 セッション動画 セ
![[動画公開] 目指せ、爆速サイト! Cloudinaryで始める画像最適化 #devio2020 | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/fc9a9494072f053931dd1c9c9a7cd3a48c5728f4/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2020%2F06%2F848c8d9b6e4887cb9c9c6cb87b9a2cd4.png)
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【図解解説】Next.js,Hono,Drizzle,Zod,ClerkでTwitterクローンを開発するチュートリアル【JStack/TypeScript/Neon/Cloudinary】 - Qiita
Cloudinary のアセット一覧をPythonでCSV出力してみた | DevelopersIO
Cloudinaryを使って記事タイトル入りOGP画像を作る方法 - Qiita
dev.toに学ぶ画像最適化のヒント #Cloudinary | DevelopersIO
iPhoneによるドラッグ&ドロップのCloudinary動画 - T’s blog
Cloudinary MO でもっと手軽に画像最適化を導入できるように！ | DevelopersIO
ameblo.jp/happiness20141004
www.asahi.com
news.yahoo.co.jp
news.yahoo.co.jp
news.yahoo.co.jp
voicy.jp